煩瑣なタグ(No.0005)

煩瑣なタグ

HTML5から section, nav, article, aside, header, footer, main などのタグが新設されている。しかし、これらのタグには明確なイメージが湧いてこない。そこで、ここでは次のように考える。以前はdivタグしかなかったが、内容に応じた色々なdiv相当タグがあるということである。

それらのタグを使ったからといって何か特別の効果が結びつくわけではない。単に「区分け」程度の意味しかない。どこでどんなタグを使おうと問題はない。必要がなければ使わなくてもかまわない。ただ、各タグに応じてスタイルシートの設定ができる分だけ、divよりは便利で分かりやすくなっていると言える。

使用例
<style>
header {font-weight:bold;}
main {color:green;}
nav {font-weight:bold;color:blue;}
aside {color:#999999;font-style:italic;}
section {color:purple;}
</style>

<header>
ヘッダであることを示す
  <nav>
  ナビゲーションであることを示す
  </nav>
</header>

<main>
メインコンテンツであることを示す
  <article>
  記事であることを示す
    <section>
     一つのセクションであることを示す
    </section>
  </article>
</main>

<aside>
補足情報のセクションであることを示す
</aside>

<footer>
フッタであることを示す
    <section>
     一つのセクションであることを示す
    </section>
</footer>

実行例

ヘッダであることを示す

メインコンテンツであることを示す

記事であることを示す

一つのセクションであることを示す

メモ
要するに、普通のテキストと何ら変わりはない。divタグを使うのと大差はない。これを見ていると、以前はよく取り上げられていたxmlを思い出す。自由にタグを作っていく形式のファイルである。あれとよく似ている。