HTML5の2014年正式勧告前にデザイナーが再確認しておくべき一冊！『HTML5マークアップ 現場で使える最短攻略ガイド』

このエントリーをはてなブックマークに追加

先日、アスキー・メディアワークスの小橋川さんより、12月11日に発売された『HTML5マークアップ 現場で使える最短攻略ガイド』を献本いただきました！小橋川さん、そして著者のはましゅんさん、ありがとうございます！！

HTML5マークアップ 現場で使える最短攻略ガイド：Amazon

先日発売していたのをFacebookやTwitterで、インターネット・Web開発のカテゴリで１位！なんてのをみていたのですが、まさか私にもお送りいただけているなんて思いもよらず。姫実家にしばらくいたこともあり、宅配の不在票に気づいたのが先週末くらい、その後うけるとまで１週間もかかってしまいました。

早速内容に目を通してみましたのでご紹介をしたいと思います。

HTML5マークアップについて

この書籍は ASCII.jpで hamashun.meの浜 俊太朗さんが連載していた『浜 俊太朗のHTML5マークアップ移行ガイド』にいろいろと加筆修正がはいって書籍になった一冊です。

読んでみたところ、業務でHTMLをこれまで使っていた人が、これまでのXHTMLの違いを知ったり理解するための内容が、かなり充実している一冊でした。HTML5の基礎知識は元ちろんのこと、XHTMLとHTML5の違い、新要素・新属性の解説、そして仕様が変更になった要素・属性の解説、さらには実際のページコーディングを例にマークアップのコツまで網羅されていました。

もちろんHTML5から勉強を始めようという人でもタグの理解をするための一冊として、サンプルも豊富なので、HTML5を利用した場合どのようにマークアップをしていけばいいのかが読みながら理解できる書籍だと思います。

HTML5マークアップ 現場で使える最短攻略ガイド

書籍の目次

  1. 第1章［導入編］これだけは押さえたいHTML5の基礎知識
    1. [1-1] いまさら聞けないHTML5とは
    2. [1-2] HTML5を使うときに必要な準備
    3. [補講] HTML5マークアップに便利なお役立ちリンク
  2. 第2章［入門編］有名サイトで学ぶXHTML 1.0とHTML5の違い
    1. [2-1] XHTML 1.0からHTML5へ移行する第一歩
    2. [2-2] セクション関連要素でセクションを明示する
    3. [2-3] その他の変更点とCSSの適用
  3. 第3章［新要素・新属性編］HTML5の新要素・新属性をしっかり理解する
    1. [3-1] HTML5の「アウトライン」と「セクション」を理解する
    2. [3-2] HTML5のコンテンツモデルとカテゴリー
    3. [補講] 特別なカテゴリー「セクショニングルート」
    4. [3-3] セクション関連要素
    5. [3-4] セクションに関連したその他の要素
    6. [補講] デザインに合わせたマークアップに注意しよう
    7. [3-5] Web制作でよく使う新要素
    8. [3-6] ルビ関連の新要素
    9. [3-7] フォーム関連の新要素・新属性
    10. [補講] HTML５で廃止された要素
  4. 第4章［仕様変更編］意味や使い方が変わった要素・属性を知る
    1. [4-1] コンテンツをグループ化する要素
    2. [4-2] テキストレベルの意味づけに関する要素
    3. [4-3] 埋め込みコンテンツに関わる要素
    4. [4-4] その他の要素
    5. [補講] HTML5で廃止された属性
  5. 第5章［実践編］実例に見るHTML5マークアップのコツ
    1. [5-1] ブログをHTML5でマークアップ
    2. [5-2] カフェのサイトをHTML5でマークアップ

どちらも豊富な正しいマークアップと誤ったマークアップ

おそらくこの本の特徴としては、正しいマークアップ方法のサンプルのみがたくさん例示されているだけでなく、これは誤り！のマークアップも、使い方に迷いそうなところにたくさん例示されています。

誤りの間違った例のマークアップで覚えないように、タグの使用方法で迷ったらまずはサンプルをチェックしてみてください。

重要箇所のマーカー

この本の特徴のもう一つは、重要箇所の文章やサンプルにマーカーが引かれていて目立つようになっていたことです。タグを説明する上でのポイントになるところや、サンプルではここに注目！といった箇所全てにマーカーのラインが入っています。

まるで学生時代に教科書にラインを引いたように、わかりやすく目立させてあるため、一度読んだあとの復習の目印にも活用できるはずです！

HTML5マークアップ 現場で使える最短攻略ガイド

新要素と仕様変更編は必読！

HTML5になってから新しく増えた新要素と、これまでもあったタグだけど仕様が変わったタグというのが多々あるのですが、それらがサンプルコード付きで丁寧に解説されているので、仕様を確認するには丁度よい内容でした。どのようにしたらいいのかの迷うポイントも抑えられているので、この一冊あればタイトルどおり最短攻略可能だと思います。私にとっても、dl・dt・ddあたりはHTML5になってから未だに考えてしまう時があったので、とても良い復習になりました。

HTML5カルタ付き

巻末にWEBCRE8.jpさんと四畳半ワークスさんのHTML5KARUTAが収録されていました。109枚のカルタすべてではなく9枚×4ページ分の代表的な36のタグのカルタが集力されていました。

HTML5のタグを楽しく遊びながらタグを学べるHTML5KARUTA、会社の仲間同士やコミュニティのメンバー同士で競い合いながら学べるのが、このカルタの特徴ではないでしょうか。

HTML5KARUTA - 「HTML5カルタ」で覚えるHTML5の108つのタグ

なお、読み札は上記リンク先をご確認ください。

HTML5マークアップ 現場で使える最短攻略ガイド

全体を通しての感想

新タグの解説から仕様変更のタグ解説もこれ一冊で十分勉強できるのですが、さらに第５章の実践編は、実際のページのマークアップ例を通して学べる章になっているので、その章のマークアップを参考に、すぐに実践でも使えるような内容になっていました。

まだ変わる可能性のあるHTML5ですが、実際に仕事でも採用されることが殆どになったいま、今一度タグについてを再確認として、もしくは新たに学び始める一冊として、この本を読んでみてください。

HTML5マークアップ 現場で使える最短攻略ガイド

HTML5マークアップ 現場で使える最短攻略ガイド

浜俊太朗
アスキー・メディアワークス

Amazonで詳しく見る

参考サイト：