【検索エンジンを意識したワンランク上のコーディングをしよう】

f:id:wp-lesson:20161016151400j:plain

ブログの新着記事一覧など、リスト（箇条書き）
の意味を持つ部分はHTMLの<li>タグで記述する
ことが多いかと思います。
　
　
しかし、
　
　
”<li>には箇条書きという以上の意味はない”
　
　
ので、
　
　
検索エンジンにはただの文字の羅列にしか見えません。
　
　
そこで、定義リスト（<dl>,<dt>,<dd>タグ）を
使うと、より意味を明確にすることができます。
　
　　
例えばこんな場面です。
　
　
2016/10/15　新着情報のタイトル
2016/10/14　新着情報のタイトル
　
　
これを<li>タグで書くと、
　

<li>2016/10/15　新着情報のタイトル</li>
<li>2016/10/14　新着情報のタイトル</li>

　
となりますが、検索エンジンには日付と
タイトルの区別がつきません。
　
　
どちらも「文章の一部分」に見えます。
　
　
一方、定義リストは、
<dt>タグで見出しを表し、
<dd>タグで見出しに対応する内容を表します。
　

<dl>
    <dt>2016/10/15<dt><dd>新着情報です</dd>
    <dt>2016/10/14<dt><dd>新着情報です</dd>
</dl>

　
会社のサイトなら会社概要や沿革のページに、
イベントやお知らせの一覧、リリースノート、
などに使えそうですね。
　
　
ただし、<dt>,<dd>はそのままだと横並びには
なりませんので、CSSで横並びにしてあげる必要があります。
　
　
やや詳しいCSSの知識が必要になりますので、
勉強したい方はお気軽にご相談ください。
　
　
「より意味のあるコード」を意識することで、検索エンジンは
あなたのサイトをより正確に認識できるようになります。
　
↓↓↓「自分で作れる力」を身につけたいあなたへ↓↓↓