HTML5 ＆ CSS3 標準デザイン講座 30 Lessons(エイチティーエムエル ゴ アンド シーエスエス サン ヒョウジュン デザイン コ)

ゼロから学べる Web 制作学習書が HTML5 と CSS3 に完全対応!

わかりやすいと好評の Web 制作入門書が、現在の標準規格である「 HTML5 」と「 CSS3 」に完全対応して登場です。 HTML5 と CSS3 の初歩的な文法学習から始めて、本格的なサイト制作までの流れを通して学ぶことで、初心者でも正しいマークアップの作法が身に付きます。用語や考え方を解説する講義パートと、実際にサンプルページを制作していく実習パートからなるレッスンを順に進めて、ステップアップしながら学んでいけます。サンプルソースはダウンロードが可能。 Web 制作をこれから始める人に最適の 1 冊です!

ORIENTATION レッスンを始める前に

Chapter01 HTML で文書を作成する

LESSON01 HTML の概要
LESSON02 文書を HTML でマークアップする
LESSON03 改行や強調・画像やリンクを挿入する
LESSON04 表とフォームを設置する
補講 文法チェックのすすめ
補講 DOCTYPE を HTML4.01/ XHTML1.0 にする場合の注意点

Chapter02 CSS で文書を装飾する

LESSON05 CSS の概要
LESSON06 基本プロパティとセレクタの使い方
LESSON07 背景画像を使って装飾する
LESSON08 初歩的な文書のレイアウトとボックスモデル
LESSON09 表組みと入力フォームのスタイリング

Chapter03 CSS レイアウトの基本

LESSON10 レイアウトの種類
LESSON11 float レイアウト
LESSON12 position レイアウト
補講 新しいレイアウト手法

Chapter04 本格的な HTML5 によるマークアップを行うための基礎知識

LESSON13 セクション関連の新要素
LESSON14 新しいカテゴリとコンテンツ・モデル
LESSON15 その他の新要素と属性
補講 HTML5 の全体仕様と実装上の注意点

Chapter05 本格的な Web 制作のための設計と準備

LESSON16 Web サイトのコーディング設計
LESSON17 効率的な CSS コーディングの下準備

Chapter06 実践的な Web サイトのコーディング

LESSON18 大枠のレイアウトフォーマットを作成する
LESSON19 display プロパティを活用したレイアウト
LESSON20 CSS スプライトの仕組みを理解する
LESSON21 メインコンテンツ領域を作成する

Chapter07 CSS3 入門

LESSON22 CSS3 の概要
LESSON23 CSS3 セレクタ
LESSON24 CSS3 プロパティ
LESSON25 変形・アニメーションとメディアクエリ

Chapter08 マルチデバイス対応の基礎知識

LESSON26 デバイスの特性を理解する
LESSON27 モバイル対応 Web サイト制作の基礎知識

Chapter09 レスポンシブ・ウェブデザインのコーディング

LESSON28 レスポンシブの画面設計とベースコーディング
LESSON29 メディアクエリを使ったレイアウトの調整
LESSON30 Retina ディスプレイ対策
補講 レスポンシブにまつわる各種 TIPS

索引

Web ページを自分の手で組み立てる感覚を最初に掴むための一冊です。全 30 レッスンで HTML の文書構造から CSS によるレイアウト・装飾・レスポンシブ対応までを順序立てて進める構成になっており、各レッスンが短い単位で完結するため「今日はここまで」と区切りやすい設計です。

著者の草野あけみ氏は Web デザインの教育現場で長く教鞭をとっており、つまずきやすいポイント (ボックスモデル、フロートの解除、メディアクエリの記述順) に対して平易な言い回しで補足を入れる丁寧さが紙面に表れています。ゼロからコードを書いて「画面に反映される」体験を積み重ねる過程で、マークアップとスタイリングの分離という Web 標準の考え方が自然に身につきます。

ただし、 JavaScript やフレームワークには踏み込まないため、動的な振る舞いを実装したい人は別途学習が必要です。 HTML と CSS だけで「静的なページを正しく組める」状態をまず作りたい入門者にとって、過不足のない出発点になります。