引き続きWordPress化について取り組んでいますが、やっていた課題の中で表（リスト）を表示させる部分がありました。方法としていろいろとありますが、使い分けがよくわかっていないのと、特にdl（定義リスト）についてはいまいちピンときていないので、少し調べてみました。
今回調べたこと
- dl（定義リスト）について
- tabelについて
- ul/olについて
- 使い分け
dl（定義リスト）について
dl=definition list、定義リストのことです。dlタグの中で定義する言葉（dt=definition term）とその定義の説明（dd=definition dscription）を書いていきます。具体的には・・・
<dl>
<dt>定義する言葉＝説明したいこと</dt>
<dd>その定義の説明</dd>
</dl>
複数の言葉を定義する場合は、<dt>~</dt> <dd>~</dd>を複数回書けばOKです。
いろいろと見ていると、ブログのお知らせ（日付とタイトル）を定義リストで書いたりするようです。
tableについて
よくある表を作ることができます。
tableタブの中では、tr（table row）＝テーブルの列、th（table header）＝テーブルの見出し、td（table data）＝テーブルのデータで構成されます。具体的には・・・
<table>
<tr>
<th>見出し１</th>
<th>見出し２</th>
</tr>
<tr>
<td>１行目の見出し１のデータ</td>
<td>１行目の見出し２のデータ</td>
</tr>
<tr>
<td>２行目の見出し１のデータ</td>
<td>２行目の見出し２のデータ</td>
</tr>
</table>
ul/olについて
一番シンプルなリストを作ることができます。数字付のリストならol（ordered list）、数字なしのリストならul（unordered list）を使います。具体的には・・・
<ol>（もしくは<ul>）
<li>一つ目のリスト内容</li>
<li>二つ目のリスト内容</li>
</ol>（もしくは</ul>）
使い分けについて
調べてみると、いろいろなことが書かれていますね。
いろいろと見たうえでの勝手な意見です(笑)が・・・
・簡単なリストや表を作るときは「ul/ol」「table」
・リストが項目と説明といった組み合わせや、一つの項目に対しての説明の時は「dl」
・レスポンシブル対応が必要な場合（横並びのリストを縦並びにするなど）のときは「dl」
こんな感じです！SEO対策を考えると「dl」が有利ということもあるようです。
dlの使い方がやっぱり理解が難しいです。こらからもいろいろと作りながら学習していきたいと思います！
コメント