■目次

はじめに
本書の読み方
序章

第1章　(X)HTMLの基本法則

1　文書構造を的確に伝える要素でマークアップする
2　(X)HTML文書には適合するDTDに合わせた文書型宣言を行う
3　HTMLとXHTMLの違いを理解して正しいマークアップを行う
4　文字コードを正しく宣言して文字化けを防ぐ
5　XHTML文書では条件付きでXML宣言を省略できる
6　XHTML文書のメディアタイプは「application/xhtml+xml」が基本
7　id属性とclass属性を目的に応じて使い分ける
8　XHTML文書ではCSSやJavaScriptをできるかぎり外部ファイル化する
9　id属性、class属性の値はCSSセレクタの命名規則に合わせて指定する
10　XHTML文書の公開時にHTMLとの後方互換性を確保する
11　(X)HTML文書のコメントは正しく書く
12　インデントとコメントで読みやすい(X)HTML文書を作る
13　(X)HTML文書には内容が伝わりやすいタイトルを設定する
14　既存の要素で表現できない部分にはdiv 要素とspan要素を使用する
15　link要素で(X)HTML文書の利便性を高める
16　順不同リスト（ul）と順序リスト（ol）を使い分ける
17　引用部分と本文の差を明確にする
18　address要素を使用して制作者の署名を記す
19　略語に説明を加えて利便性を向上させる
20　label要素を利用してフォームを使いやすくする
21　入力コントロールをグループ化してフォームを整理する
22　Tabキーによる項目選択とキーボードショートカットで利便性を高める
23　項目数の多いセレクトメニューはoptgroup要素でグループ化する
24　alt属性ですべての画像に的確な代替テキストを付ける
25　アンカーテキストにはリンク先の内容を明示する
26　target="_blank"の使用は最低限に抑える
27　英単語は小文字で、略語は大文字で記述する
28　日付情報にはわかりやすい表記法を使用する
29　表のマークアップではアクセシビリティを考慮する
30　特別な記号は文字参照で記述する

第2章　CSSの基本法則

31　CSSの基本的な記述方法を理解する
32　スタイル適用の優先順位を理解する
33　CSSにおけるボックスモデルを理解する
34　レンダリングモードの切り替え条件を把握して表示をコントロールする
35　セレクタと擬似クラスを使いこなして効率的なCSSを記述する
36　:hover擬似クラスは:link／:visited擬似クラスよりあとに記述する
37　インラインボックスの高さの値には単位を指定しない
38　文字色と背景色のコントラストに配慮する
39　出力メディアに合わせて適用するスタイルを制御する
40　複数人で管理するCSSはコメントでガイドラインを記述する
41　スペース、インデント、改行を使って読みやすいCSSを書く
42　プロパティの指定順序を統一する
43　ショートハンドプロパティでCSSを効率化する
44　ショートハンドプロパティはポイントを押さえて使用する
45　ベースとなる文字サイズの指定方法を工夫する

第3章　用途と目的に合わせたレイアウトの法則

46　マルチカラムレイアウトはfloatプロパティで実現する
47　マルチカラムレイアウトではclearプロパティの使い方に注意する
48　positionプロパティで自由度の高いレイアウトを実現する
49　floatプロパティによる2カラムレイアウトの基本を理解する
50　サイト全体の文書構造を整理してからCSSを記述する
51　2カラムの可変レイアウトにはネガティブマージンを使用する
52　固定幅の2カラムレイアウトをエラスティックレイアウトにする
53　floatプロパティを使用して柔軟な3カラムレイアウトを実現する
54　positionプロパティでより柔軟なマルチカラムレイアウトを実現する
55　カラム落ちの原因と対処方法を理解する
56　背景画像を工夫してフロートボックスの下辺を揃える
57　見出しの横に表示するボタンはpositionプロパティで実現する
58　画面中央の配置はposition／marginプロパティで実現する
59　エラスティックレイアウトで横幅サイズを指定して可読性を高める

第4章　ユーザビリティを向上させるCSSデザインの法則

60　CSSのみでロールオーバー効果を実現する
61　パンくずリストは階層構造を考えて作る
62　文書構造が明確にわかる縦並びのメニューを作成する
63　CSSのみでドロップダウン型メニューを作る
64　クリック領域を大きくしてユーザビリティを高める
65　リンク先のファイルタイプを利用者に明示する
66　リンク先が新規ウィンドウで開くことを明示する
67　CSSで擬似フレームを作成する
68　代替スタイルシートを利用して複数のスタイルシートを切り替える
69　印刷に適した印刷用スタイルシートを作成する
70　フィードにCSSを適用してユーザビリティを向上させる

第5章　実践的なCSSデザインの法則

71　Webブラウザのデフォルトスタイルをリセットする
72　1行テキストの上下中央配置にはline-heightプロパティを使用する
73　画像の下の余白はvertical-alignプロパティで解消する
74　字下げとぶら下がりはCSSでコントロールする
75　文字サイズを変更してもテキストが重ならないようにする
76　定義リストを横並びにしてスマートに見せる
77　リストの横並びはインラインとして実現する
78　透過gif画像を利用してカラーバリエーションを作る
79　背景画像を指定してimg要素の見栄えをよくする
80　JavaScriptを使わずにロールオーバー時の画像拡大効果を再現する
81　ステッカーを貼ってプロモーション効果を高める
82　スクロールバー領域を常に確保してセンタリング位置のズレを避ける
83　角丸の背景は最低限の要素で実現する
84　未対応セレクタも状況により使用してかまわない
85　CSS3セレクタを使用してスマートなCSS を記述する

第6章　プロを感じさせるデザインの法則

86　レイアウトデザインはグリッドを意識する
87　余白の使い方でデザインに差をつける
88　マルチカラムデザインでは横幅比のバランスを考える
89　レイアウトと機能に一貫性をもたせユーザビリティを向上させる
90　画像サイズは黄金比や白銀比を利用する
91　配色のルールを理解する
92　号数活字システムで見栄えのよい文字サイズを決める
93　ドロップキャップで文書にリズムを与える
94　ターゲットユーザーに合わせてフォントやディテールを使い分ける
95　各国の欧文フォントの雰囲気をWebデザインに活かす
96　見出しや本文ごとに行間を変えて美しい文字組みを作る
97　もっとも伝えたい情報は左上に配置する
98　ボタンやリンクの機能がひと目でわかるようにする
99　引用をわかりやすく視覚表現する
100　グローバルナビゲーションでは情報の優先順位と利便性を考慮する

付録
用語集
要素索引
属性索引
プロパティ索引
用語索引