前回に引き続きHTML5プロフェッショナル認定試験レベル1の学習を再開！
①HTML5以降の要素の種類
HTML5以降は「ブロックレベル要素」と「インライン要素」の分類がなくなり、7種類のカテゴリーが登場。そもそもブロックレベルとインラインとは何か。例えばp要素をブロックレベル要素、そしてem要素はインライン要素。文章の一部分として含むことができる要素は、インライン要素。
しかし、HTML5以降は、この分類がなくなり、従来のインライン要素に該当する要素でもbody要素の直下に配置できる。
また、親要素のコンテンツモデルを継承する性質のことをトランスペアレントと呼び、代表的なものは、a要素、ins要素、del要素など。
7種類のカテゴリーをコンテンツモデルといい、各種名称がある（HTML5の要素のカテゴリー写真参照）
［補足説明］
インラインとブロックレベルという分類が完全に不要になったわけではない。CSSの一部では、この分類が現在でも使用される。
②HTMLの全要素
かなりの数がある。本書掲載の要素数が異常なほどだ。全要素と書いてあるだけに全部あるのかもしれない。ウェブサイト制作やブログ運営など独自のコンテンツ制作において「この要素が必要だ」と状況に応じて記憶していくといいかも。または普段閲覧しているウェブサイトのデベロッパーツールを参照すると、どんな要素をマークアップしているか垣間見えて面白い。
③各カテゴリーに含まれる要素
［フローコンテンツ］・・・①
ほとんどの要素が①に該当するため①に該当しない要素を覚えるといい
［見出しコンテンツ］・・・②
h1~h6, hgroup
［セクショニングコンテンツ］・・・③
article, aside, nav, section
［フレージングコンテンツ］・・・④
a, abbr, area, audio, b, bdi, bdo, br, button, canvas, cite, code...
［組み込みコンテンツ］・・・⑤
audio, canvas, embed, iframe, img, object, picture, video
［インタラクティブコンテンツ］・・・⑥
a, button, details, embed, iframe, img, input, label, select, textarea, video ※条件あり
［メタデータコンテンツ］・・・⑦
base, link, meta, noscript, script, style, template, title
ずらっと各カテゴリーに含まれる要素を並べた。
これで1-2［HTMLの要素とカテゴリー］の項目が終了！
1-2のHTMLの要素とカテゴリーの項目の総括
従来のブロックレベル要素とインライン要素の分類がなくなりカテゴリーという関係性があることを習得できたのではないか。そのカテゴリーをコンテンツモデルと表し、それぞれ名称があることを理解した。またHTMLの要素の少数を書いてはみたが、要素に関しては実際にBracketsなどのツールを用いて書いていかないと実感はつかめなさそう。ただ、はてなブログの記述方式にHTML編集が採用されているゆえにここでも練習は可能。
HTML5の大枠は頭の中にイメージできたっぽいから引き続き1-3グローバル属性を次回は書いていきたい。
