【検索エンジンを意識したワンランク上のコーディングをしよう】
ブログの新着記事一覧など、リスト(箇条書き)
の意味を持つ部分は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の知識が必要になりますので、
勉強したい方はお気軽にご相談ください。
「より意味のあるコード」を意識することで、検索エンジンは
あなたのサイトをより正確に認識できるようになります。
↓↓↓「自分で作れる力」を身につけたいあなたへ↓↓↓
【1】CODEMYマンツーマンレッスン
codemy-lesson.office-ing.net⇒30分無料相談あり
⇒知りたいことだけ学べる個人レッスン
▼レッスンの記録をご覧いただけます。
https://www.facebook.com/codemy.lesson/
【2】プログラミング講座CODEMY
office-ing.hatenablog.com
⇒動画と個別添削で学べるオンラインレッスン
自分でホームページやプログラムの制作やカスタマイズをできるようなりたい方が
業種・経験・地域を問わず参加されています。