MdNCORPORATION

Webデザインの新しい教科書 改訂新版 基礎から覚える、深く理解できる。

Webデザインの新しい教科書 改訂新版 基礎から覚える、深く理解できる。

赤間 公太郎 著/こもり まさあき 著
定価 2,750円
(本体 2,500円+税10%)
※電子書籍の価格は各販売ストアにてご確認ください。
発売日 2016-02-02
仕様 B5判/288P
ISBN 978-4-8443-6563-1
Webデザイン・Webサイト制作の「本当に必要な正しい基礎」を伝える入門書の改訂版。WWWやインターネットの仕組みを始まりに、サイト制作のワークフロー、HTML・CSSの技術的な解説、Webサイトを公開・運用するまでの基礎知識を、系統立てて解説しています。改訂版ではHTML5をベースにした内容に改変し、レスポンシブWebデザインに対応した簡単なサンプルサイトを制作する章を新たに加えたほか、SVGやサイトデータのバージョン管理に関する解説も追加しました。 本書の一番の特長は基礎的な知識や制作技術の解説とともに、「なぜ、そうするのか?」といった「背景」や「理由」にも踏み込んで説明している点です。サイト制作のツールやテクニックは時代によって常に変化していきますが、本書では最新の情報や技術手法を扱うだけではなく、Web・Webデザインの根本的な仕組みや、技術の裏側にある背景を含めて深く理解することで、「自分で考える力」や「ずっと役立つ応用力」を養うことを目的にしています。プロのWebデザイナーを目指す方はもちろん、Webにかかわるすべての方に知ってほしい内容を集約した1冊です。

→サンプルデータはこちら





■ページ見本










目次

■Lesson 1 Webデザインの世界を知る
01 インターネットとWWWの歴史
02 WebページがWebブラウザに表示されるまでの仕組み
03 多様化するWebブラウザのことを知ろう
04 Webデザインって何をすること?
05 実際のWebサイトができるまで
06 Webサイト制作にはどんな人たちが関わるのか?
07 Webサイト制作のために必要な技術
08 Webサイト制作に必要なツール
09 これからのWebデザイン

■Lesson 2 Webサイトを設計する
01 Webサイトは何のためにあるのか?
02 Webサイト全体の構成を見てみよう
03 Webページの構造を分析してみよう
04 Webページを一般的な文書に置き換えてみよう
05 文書のアウトラインを考えてみよう
06 情報を多様な環境で取得しやすくすることの大切さ
07 情報の意味を伝えるために必要なHTML
08 ワイヤーフレームを使って情報を視覚的に配置する
09 HTMLをデザイン・レイアウトするCSS
10 高度なインタラクションを追加するJavaScript
11 これからのWebサイト設計
12 レスポンシブWebデザインとは

■Lesson 3 HTMLの役割とできること
01 HTMLとはどんなもの?
02 テキスト情報に意味を与えるマークアップ
03 HTMLファイルをWebブラウザで表示してみよう
04 要素(タグ)と属性の違い
05 HTMLの基本構造
06 head要素とbody要素の違い
07 head要素の中に入る要素
08 body要素内の構造と要素の性質の違い
09 見出しを表すh要素と段落を意味するp要素
10 文字列の特定部分に意味を与える要素
11 引用や出典を示す要素
12 強制改行を意味するbr要素と水平罫線を表すhr要素
13 情報の削除を示すdel要素と修正を意味するins要素
14 画像を挿入するimg要素
15 文書同士をつなげるa要素
16 文書の制作者などを示す要素
17 情報をグループ化するdiv要素とspan要素
18 リストを表現する要素
19 表組みを作るための要素
20 フォームを作るための要素
21 文章をマークアップしてみよう
22 HTML5の特徴
23 HTML5で新しく加わったWebページの構造を示す要素
24 HTML5のフォームに関連するtype属性値と属性

■Lesson 4 CSSの役割とできること
01 CSSとはどんなもの?
02 CSSで情報をデザインする
03 HTMLはWebブラウザにどう表示されている?
04 HTMLにCSSを適用するには?
05 セレクタとはどんなもの?
06 よく使われるセレクタ
07 覚えておきたいCSSのルール
08 CSSを書いてWebブラウザで表示してみよう
09 プロパティを性質の違いで大きく2 つに分類してみる
10 文字や背景に色をつけてみよう
11 背景に画像を表示する
12 文字のサイズを設定する
13 書体(フォント)を指定する
14 文字の行間や開始位置を調整する
15 リンクの色を変更する
16 マウスの状態に応じてリンクのスタイルを変える
17 疑似要素の使い方と効果
18 CSSを書く前に覚えておきたいボックスモデル
19 内容の幅と高さを指定する
20 情報の含まれるブロックにボーダーを設定する
21 パディングを調整する
22 隣接するブロックとの間隔を調整する
23 情報をブロック単位で並べる
24 文書構造順に積み木感覚でブロックを配置
25 floatプロパティによる回り込みの解除
26 意図した場所にブロックを配置する
27 CSSによるレイアウトの実践
28 displayプロパティで要素の表示状態を切り替える
29 リストを装飾する
30 テーブルを装飾する
31 フォームを装飾する
32 CSSの最新バージョン「CSS3」について

■Lesson 5 Webサイトを構成する素材
01 Webサイトで使う素材
02 著作権とライセンス
03 テキストと文字コード
04 Webサイトの標準的な色空間
05 画像を構成する単位「ピクセル」
06 Webサイトで使う画像フォーマット
07 ベクター形式の画像フォーマット「SVG」
08 Webサイトで使う映像素材や音声素材

■Lesson 6 Webサイトを表現する色
01 カラーモードの違い
02 色の三属性
03 色指定の方法
04 代表的な配色技法

■Lesson 7 Webサイトを公開する
01 ホスティングサービスの種類と選び方
02 Webサイトの公開前に確認すること
03 Webサイトの品質を確認する
04 ローカル環境でWebサイトをチェックする
05 サーバーとクライアントの関係
06 制作したWebデータの送信に利用するFTP
07 FTPクライアントでデータをアップロードする
08 Webブラウザで表示を確認する
09 Webサイトデータのバージョン管理

■Lesson 8 Webサイトを運用する
01 ソーシャルメディアと連携する
02 Googleにサイトを登録するには?
03 アクセス解析でWebサイトの効果を測定する
04 Webサイトの調査、改善を行うには?
05 サーバーソフトウェアのアップデートとセキュリティ対策

■Lesson 9 Webサイトを制作する
01 HTMLをコーディングする前の制作準備
02 ページのHTMLファイルを制作する
03 ベースとなるモバイル用のCSSを作る
04 タブレットとPCサイズのスタイルを指定する

用語索引

制作の基本からデザイン業界の最新状況まで! MdNのデザイン・グラフィック書8選

デザイン・制作・マーケティング Webでもう困らない! わかりやすくて知識が身につく8冊