html5第1回

html5の勧告が出された。今回からhtml5の仕様や構文について学習を進める。

html5の特徴

大まかに以下の2系統のタグが増えた。

メディア系タグ　audio,video,sourceなどの各種タグ。動画等の扱いがhtmlだけでできる。
文書構造タグ　header,article,sectionなどの各種タグ。文書構造が明確化される。

メディア系のタグに関してはどんなサイトでも使うわけではないので、比較的影響が小さい。一方、文書構造タグについてはどんなサイトでも意識しなくてはいけないため、習得が必須となる。こちらの内容を中心に学習を進める。

またinputのtype属性値が増えた(type="email"など)。さらに、inputの属性にautofocusなどが増えた。これによりメールフォームなどでエラー回避のコーディング工数が削減可能となる。

文書構造タグの概要

例としては、今までdiv id="header"で括っていたh1等を、代わりにheaderタグで括る。これだけでは単にdivの代わりの役割に感じられるが、文書構造を明確にできるため情報集積が大いに促進されるといった役割がある。divでid名を付けただけでは、css等で編集しやすくする点にのみ限定された意義性であったが、情報集積の観点では無意味だった。この点は大きな違いとなる。

各タグの使い方

使用頻度が高いと思われるタグを列挙した。全て閉じタグを要する。

header　ページタイトルよのうな、最重要部が入る。　
footer　　著作権情報やフッタサイトマップなどが入る。
nav　　ナビゲーションが入る。
section　　1つの独立した章や節が入る。
articl　　1件のブログなど、1つの記事が入る。
aside　　本筋とは関連性が小さい箇所が入る。

sectionとarticleの差異について理解が乏しく、今後も学習を続けたい。

感想

html5の導入により、ユーザにとってのメリットも考えられる。文書構造のしっかりしたサイトが増えれば見やすいサイトが増えることに繋がると思われる。また、情報集積の品質向上がなされれば、検索結果の精度がより向上するとよそうされる。
一方、コーダにとってはメリットというよりは時流に乗るためには覚えざるを得ない、といったところであろう。この先、更にhtmlのバージョンアップがなされていくとき、headerタグ内に書かれていないh1はseo上で重視されなくなる、という日が来るかもしれない。時代の波に置いて行かれないようにするためには、こうしたバージョンアップを適宜取り入れ続ける宿命がある。
業界動向に対し敏感であり続け、置いて行かれないように注意し続けたい。