『徹底解説HTML5マークアップガイドブック』を読みました。
書名にどおり、マークアップについて徹底的に解説でした。
本書では、HTML5で使用できるタグをひとつひとつ解説しています。
HTML5で新しく導入されたタグや変更されたタグについては、特に詳しく丁寧に解説しています。
タグの意味と正しい使い方だけではなく、間違った使い方についても解説されています。
たとえばブログで、紹介したラーメン屋の住所にaddressタグを使うのは間違いです。
addressタグは、サイトの連絡先やブログ著者の連絡先です。
ラーメン屋の住所にaddressタグを使うと、サイトまたはページの連絡先がラーメン屋になってしまいます。
navタグの項では、サイト内検索ボックスにnavタグを使うべきか否かの解説があります。
検索ボックスは訪問者を適切なページにナビゲートするため、navタグを使っても良さそうに思えます。
しかし、navタグはナビゲーション・リンクを伴うセクションを表すため、検索ボックスにnavタグを使用するのは適切ではないとのことです。
マークアップ例やレンダリング例は豊富でわかりやすく、未対応ブラウザの問題を回避する方法も書かれていて、とても役に立つ本です。
本書で紹介されていたHTML5サイト作成に役立つページ
- The W3C Markup Validation Service
マークアップが仕様に準拠しているかをチェック - HTML 5 Outliner
アウトラインをチェック - ExplorerCanvas
Internet Explorerが未対応のcanvasをエミュレートするJavaScriptライブラリ
古いブラウザで発生する問題について
- Internet Explorer6/7/8
- The WHATWG Blog ? Supporting New Elements in IE
HTML5の新要素を使うとDOMツリーがおかしい
- The WHATWG Blog ? Supporting New Elements in IE
- Firefox 2以前
- The WHATWG Blog ? Supporting New Elements in Firefox 2
HTML5の新要素を使うとDOMツリーがおかしい
- The WHATWG Blog ? Supporting New Elements in Firefox 2
- スタイルシートの問題
- HTML5新要素をブロックとしてレンダリングする
section, article, aside, hgroup, header, footer, nav, figure { display: block; }
- HTML5新要素をブロックとしてレンダリングする