Template-22、ページ構成を示すセマンティックなタグたち

Template-22、ページ構成を示すセマンティックなタグたち

1. header等のタグを入れていないサイト

SEO関係のサイトで、「HTML5で新しく導入されたページ構成を伝えるタグです!」なんて、これらのタグを紹介しながら、ご本人は使っていないサイトも散見されました。なにやら特別な理由がありそうです。

関連記事でも「HTMLタグの栄枯盛衰」について触れましたが、これらのタグが将来的に廃止になると見立てておられるのでしょうか??

とても気になります。

2. そのページの固有のコンテンツをArticleとみなすサイト

ヘッダー、ナビ、アーティクル、セクション、フッター

当ブログでいうと、上記のような感じです。

私も上記のような感じでタグをふりました。が、しかし、最上部のheaderタグだけはどうしても型崩れをするので、ちゃんとclassやidとにらめっこしながら注意深く入れていく必要がありそうです。

また、Article内にも目次を入れるブロガーさんをよく見かけます。この場合、記事内にもheaderとnavを持つことができてタグ記述としては面白そうです。しかし読者としての私がそういうデザインを個人的に好んでいないので、このテスト記事以外に今後も使っていくかわかりません。

記事内header、CSS


.entry_m header {
font-size:1em;
font-style:normal;
border:4px double #fa8072;
background:#ffe4b5;
margin:0.25em 1em 0.25em 1em;
padding:0.75em;
}

記事内header、サンプルHTML


<header>
<p>冒頭文</p>
<nav><ol>
<li><a href="#1">目次1</a></li>
<li><a href="#2">目次2</a></li>
<li><a href="#3">目次3</a></li>
</ol></nav>
</header>
<section>
<h2 id="1">大見出し1</h2>
<h3 >中見出し</h3>
<h3 >中見出し</h3>
</section>
<section>
<h2 id="2">大見出し2</h2>
<h3 >中見出し</h3>
<h3 >中見出し</h3>
</section>
<section>
<h2 id="3">大見出し3</h2>
<h3 >中見出し</h3>
<h3 >中見出し</h3>
</section>

変な話、こういう風に雛形を固めて、ガイド付きで文字を埋めていくのは楽だったりします。ただ、書いていて、あんまりおもしろくないんですよね~。

3. Articleの解釈が拡大版のサイト

Articleの拡大解釈

わかりにくいかもしれませんが、記事が一つのsection、サイト内独立ページのプラグインが次のセクション、タグリストのプラグインがそのまた次のセクションというように解釈しているサイトのことです。

私が書いた記事の多くは、検索語句とスニペットが悲しいミスマッチになってしまっています。こんな風に全く関係がないタグやリンクをふんだんに入れて、それをsectionとしてみなしてしまうと、検索語句とページコンテンツのミスマッチが更にひどくなってしまいそうなので、私はパスです。

そもそも、footerタグの次に興味が湧いたのがnavタグです。このタグを書いておくと、スニペットに記述されるのを避けられないかな…なんていう淡い期待を胸に抱いております。

スポンサーサイト

Comment

コメントを投稿する
記事: Template-22、ページ構成を示すセマンティックなタグたち

お気軽にコメントをどうぞ~。

  非公開 (管理人のみ閲覧可能)
 

Trackback