廃止されても今も使われる HTML5 の情報誌「HTML5 完全読本」のまとめ

[最新更新] 2022年04月10日
[初回公開] 2015年04月27日

HTML の新しいマークアップの定義となる HTML5 が登場して 10 年近く経過し、2021 年に廃止されて後継が出ているものの HTML5 で定義されたマークアップは今でも SEO に大きな影響を与えており、その HTML5 の情報とサンプルコードが掲載された「HTML5 完全読本」の要点を紹介する。

１．「HTML5 完全読本 – 実践テクニックと Web デザインの最新動向」とは

「HTML5 完全読本 – 実践テクニックと Web デザインの最新動向」とはウェブサイト制作者向けに発刊されていた web creators の特別号として HTML5 の概要と用途に応じたサンプルコードが掲載された情報誌である。

著者は web creators と同じくウェブサイト制作会社に所属する各企業の担当者が各ページを分担して執筆しており、ウェブサイトの製作者とウェブサイトの運営管理者向けの内容となっている。

２．HTML5 完全読本の要点

HTML5 完全読本の要点としては、HTML5 の概要と HTML5 で新しく追加されたマークアップ要素を文章で解説されており、実際に HTML5 の事例の代表格となる CSS3 やコンテンツ内に動画を埋め込んだり、絵画する JavaScript のサンプルコードが掲載されている。

本書を大きく分類すると次の 4 点にまとめられる。

1. HTML5 新要素の実戦テクニック
2. HTML5+JavaScript の応用テクニック
3. レスポンシブ Web デザインと CSS フレームワーク
4. スマートフォン・Web アプリの現状と活用アイデア

2-1．HTML5 とは

HTML5 とは HTML タグによるマークアップする要素が追加になった他、CSS3 や JavaScript といった Web アプリケーションも含んだテクノロジーの総称として呼ばれることもある。

W3C が策定したものだが、同じく HTML の標準化を進める WHATWG と同じ道を進むことができず、残念ながら 2021 年 01 月に廃止された。
現在は W3C も WHATWG に協力することを表明して「HTML Living Standard」が最新の規格となっている。

2-2．SEO に大きな影響を与える HTML5 で追加されたタグ

HTML5 から追加されたマークアップ要素の中には Google など検索サイトのクローラーに適切にコンテンツの内容を伝えるために重要な鍵となっているものがある。
HTML5 で追加されたタグの有無で検索サイトにインデックスされるまでの期間や検索結果の順位に大きく影響し、SEO 対策する上で記述することをお勧めする。

その中で次の 5 つがインデックスまでの期間を早め、検索結果の内容や順位に影響を与える HTML タグである。
内容を理解して適切に利用するとともに、本書「HTML5 完全読本」でも利用例が掲載されている。

main : HTML 文書内の主要な箇所を定義する。
time : コンテンツが投稿または更新された日付を定義する。
article : メインとなる本文を定義する。
header : 本文以外のウェブサイトのサイト名やナビゲーション等を配置するページの冒頭を定義する。
footer : 本文以外のウェブサイトのコピーライトやページ内リンク等を配置するページの末尾を定義する。

３．HTML5 完全読本の販売価格とページ数

本体価格は税抜 1,800 円で全 125 ページで構成され、第一刷発行は2014年02月11日である。

４．HTML5 完全読本を読んだ感想

HTML5 完全読本を読んだ感想としては、HTML5 で追加されたタグの使い方よりも CSS と JavaScript を利用して動画や画像を印象的に見せる Web アプリケーションのサンプルコードがページ数の大半を占めているので事例の幅を広げたい人や、すぐに動くものを導入したい人には打ってつけの書籍である。

本書が発刊されたのが 2014 年で、当時は IE7 から IE8 に変わる転換期と重なっていた。
HTML5 は古い IE では動作しないため当時は HTML5 の活用を様子見されていたが、現在ではどのブラウザも HTML5 に対応しているとともに、 JavaScript で利便性を上げるのが一般的になっているので掲載されているサンプルコードは現在でも利用できる。

ただ、掲載内容が「ウェブサイトの見せ方」や「フレームワークや外部ライブラリの使い方」に傾倒しており、HTML5 で SEO に効果を与える点までは言及されていない。
HTML5 を概要を手早く見返したり、導入したい動きやライブラリが本書に記載していれば参考にする書籍だと感じる。

関連記事