関連サイト
出版社による関連ページが公開されています。
内容紹介
2012年12月にHTML5の勧告候補がリリースされ、HTML5の策定作業もゴールが見えてきました。本書は、そのHTML5勧告候補に基づいて、各要素の定義や機能、使い方について、ビジュアルとサンプルを多用してわかりやすくまとめたものです。
基本、セクション、メタデータ、段落書式/文字書式、テーブル、フォーム……など機能別に分け、それぞれの要素について、基本情報や書式、ブラウザの対応状況、HTML4.01やXHTML1.0からの変更点、注意したいポイントやTips、サンプルコードなどを掲載。「HTML5を理解すること」「HTML5でデザインすること」を目標に、できるかぎりの情報を盛り込んでいます。
HTML5はそのポジションが大きく変わってしまったため、従来の視点からHTML5を眺めてしまうと、見通しが非常に悪いのです。しかし、これまでのHTML/XHTMLの知識をちょっと脇に置いて、HTML5の視点に立ってみると、この新しいHTMLが長い年月をかけて緻密に作り上げられていることが見えてきます。
そして、この緻密さの基礎となっているのが「セマンティクス」です。
このセマンティクスという考え方は、新しく追加されたセクショニングやmicrodataなどの機能に限らず、すべての要素に込められており、これまでのビジュアルによるコンテンツデザインとは異なる、セマンティクスによるコンテンツデザインを実現します。
そして、このセマンティクスによるコンテンツデザインは、Webの新たな可能性を生み出す、HTML5の最も重要なテーマだといえるでしょう。
そこで本書では、HTML5の視点から、HTML5を理解することを目標に各要素に関する解説を行っています。
(著者「はじめに」)
ブラウザについてはGoogle Chrome、Internet Explorer、Safari、Firefox、Mobile Safari、Androidの標準ブラウザ、Operaの対応状況を掲載。
HTML5の次バージョンとされるHTML5.1やWHATWGがリリースしているHTML Living Standardに関しても、適宜情報を掲載しています。
また、本書中に掲載したサンプルコードは、本書サポートサイトからダウンロードできます。
Webデザイナー/クリエイター必携の解説書となっています。
書誌情報
- 著者: エ・ビスコム・テック・ラボ
- 発行日: 2013-02-14
- 最終更新日: 2013-02-14
- バージョン: 1.0.0
- ページ数: 320ページ(PDF版換算)
- 対応フォーマット: PDF
- 出版社: マイナビ出版
対象読者
Webデザイナー、Web制作者
著者について
エ・ビスコム・テック・ラボ
さまざまなメディアにおける企画制作を世界各地のネットワークを駆使して展開。コンピュータ、インターネット関係では書籍、CD-ROM、デジタル映像、CG、ソフトウェアの企画制作、WWWシステムの構築などを行う。
主な編著書: 『スマートフォンサイトのためのHTML5+CSS3』マイナビ刊
『CSS3 スタンダード・デザインガイド』同上
『XHTML/HTML+CSS スーパーレシピブック』同上
『WordPress3 サイト構築スタイルブック』同上
『WordPress3 デザイン&カスタマイズ スタイルブック』同上
『Movable Type サイトデザイン&レシピ事典』同上
『Dreamweaver+HTML5&CSS3レッスンブック』ソシム刊
『HTML5 & CSS3ステップアップブック』同上
『WordPressデザインブック3.x対応』同上
『HTML/XHTML&スタイルシート レッスンブック』同上
『HTML/XHTML&スタイルシート デザインブック』同上
目次
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の文法チェック
- 未対応ブラウザへの対応
- グローバル属性
- 要素&ブラウザ対応一覧
- 逆引き索引
- 索引