HTML

今回はHTMLのお話です。ホームページを構築するに当たって重要な内容です。最近ではコーディングをしなくても自動で生成する機能を持った色々なアプリやプラグインなどが出てきていますので、近い将来作業の割合はぐっと少なくなって来るかもしれませんが、知っておいて損はないかと思います。

さて、HTML5では、ブロック要素とインライン要素がなくなりました。
これで、自由にコーディングできると思いでしょうが、実はHTML5にはコンテンツモデルと言われる新しい定義が導入されています。

以下の７つになります。

• メタデータ コンテンツ
• フロー コンテンツ
• セクション コンテンツ
• ヘッディング コンテンツ
• フレージング コンテンツ
• エンベッディッド コンテンツ
• インタラクティブ コンテンツ

これがコンテンツモデルと言われるものです。
HTML5のタグは各コンテンツモデルのいずれかに分類されるのではなく、複数に属するものも多々あります。条件によっては変化する場合もあり、なんだかとっつきにくい感じです。（詳しい説明は様々なサイトがしているので割愛します。）

２つから７つに要素が増え面倒な感じがしますが、かなりざっくり言うと

ブロック要素・インライン要素の考え方がわかっていれば特に困ることはなし！

です。

最近コーディングを勉強始められた方は地道に勉強するしかありませんが、HTML4.01を知っているのであれば学習コストは高くないと思います。

HTML5になって、私の中で一番大きかったのはaタグでした。

以前、aタグ（インライン要素）内にdivタグやhタグを入れる事はNGでしたが、HTML5では可能になりました。
以下のコーディングは基本NGでしたが、HTML5から可能になった事で気兼ねなくコーディングできストレスが減りました。

<div>
 <a href="link.html">
  <img src="demo.jpg" alt="demo">
  <h1>見出し</h1>
  <p>テキストテキスト</p>
 </a>
</div>

タグはその意味を無視しても使うことができますが、意味を加味した上でコーディングすることによって、文章の構造化が最適化されSEOにもプラスにホームページの機能も十二分に発揮します。是非意味を知ってコーディングしてください。

同じ業界の人が見て、気持ちのいいコーディングだなって言ってもらえるように社員全員で努めていきたいと思います。