はじめに
長かったHTML5の策定作業も、いよいよゴールが見えてきました。
HTML5は従来のHTML/XHTMLに置き換わる、新しいHTMLとして開発が続けられてきました。しかし、拡張によって進化してきたこれまでのHTML/XHTMLとは異なり、セマンティクスという新たな概念を取り込みつつ再構築されているため、従来と同様に扱おうとすると戸惑うことが少なくありません。
HTML5はそのポジションが大きく変わってしまったため、従来の視点からHTML5を眺めてしまうと、見通しが非常に悪いのです。しかし、これまでのHTML/XHTMLの知識をちょっと脇に置いて、HTML5の視点に立ってみると、この新しいHTMLが長い年月をかけて緻密に作り上げられていることが見えてきます。
そして、この緻密さの基礎となっているのが「セマンティクス」です。
このセマンティクスという考え方は、新しく追加されたセクショニングやmicrodataなどの機能に限らず、すべての要素に込められており、これまでのビジュアルによるコンテンツデザインとは異なる、セマンティクスによるコンテンツデザインを実現します。
そして、このセマンティクスによるコンテンツデザインは、Webの新たな可能性を生み出す、HTML5の最も重要なテーマだといえるでしょう。
そこで本書では、HTML5の視点から、HTML5を理解することを目標に各要素に関する解説を行っています。また、セマンティクスによるコンテンツデザインを行う上で必要となる情報も、可能な限り盛り込みました。
HTML5の勧告候補もリリースされ、HTML5も一区切りがつきました。この機会にHTML5の視点に立ったウェブデザインをはじめてみてはいかがでしょうか。
掲載した要素
対応ブラウザ
もくじ
Chapter1 HTML5とインフォメーションデザイン
これまでのHTML
HTML5の登場とセマンティクス
構造化データの活用
セマンティック・マークアップの実践
HTML5のコンテンツ・モデル
Chapter2 Webページの基本
DOCTYPE 宣言
ルート要素 html
メタデータの設定 head
コンテンツ body
スタイルシート style
スクリプト script / noscript
Chapter3 セクション
セクションとアウトライン
独立したコンテンツ article
セクション section
ナビゲーション nav
補足・関連情報 aside
見出し h1 / h2 / h3 / h4 / h5 / h6
見出しのグループ化 hgroup
ヘッダーとフッター header / footer
汎用要素 div / span
Chapter4 メタデータ
ページタイトル title
リンクに関する設定 base
関連URL link
メタデータ meta
コンテンツの内容をより詳細に明示する
microdata（マイクロデータ）
RDFa
microformats（マイクロフォーマット）
Chapter5 外部コンテンツ
画像 img
インラインフレーム iframe
外部コンテンツ object / param
外部コンテンツの組み込みポイント embed
ビデオ/ オーディオ video / audio / source
テキストトラック track
イメージマップ map / area
Canvas canvas
SVG svg
MathML math
Chapter6 段落書式
段落 p
段落レベルの区切り hr
連絡先・問い合わせ先 address
引用 blockquote / q
整形済みテキスト pre
リスト ol / ul / li
関連リスト dl / dt / dd
図版とキャプション figure / figcaption
Chapter7 文字書式
リンク a
略語 abbr
定義 dfn
作品のタイトル cite
日時 time
コンピュータ関連 code / var / samp / kbd
上付き・下付き sup / sub
但し書き・注意 small
重要 strong
強調・強勢 em
変更・更新した情報 s
語句の区別 i / b / u
ハイライト mark
ルビ（ふりがな） ruby / rt / rp
双方向アルゴリズムの変更 bdo
双方向アルゴリズムの隔離 bdi
追加・削除 ins / del
改行 br
改行を認める箇所 wbr
Chapter8 テーブル
テーブル table / tr / th / td
テーブルのキャプション caption
列のグループ colgroup / col
行のグループ thead / tbody / tfoot
Chapter9 フォーム
フォーム form
ラベル label
フォームコントロールのグループ fieldset / legend
データの入力・送信 input
ボタン button
選択肢 select / option / optgroup
入力候補 datalist
複数行のテキスト textarea
暗号鍵 keygen
計算結果 output
進捗状況 progress
メーター meter
Chapter10 インタラクティブ
付加的な情報 details / summary
コマンドリスト menu / command
ダイアログボックス dialog
APPENDIX
HTML5の構文規則
HTML5の文法チェック
未対応ブラウザへの対応
グローバル属性
要素＆ブラウザ対応一覧
逆引き索引
索引