リストはホームページをキレイに見せるためにも役立つし、訪問者にもわかりやすいサイトだと認識させることができるHTMLタグです。一般的にリストタグを使用するとSEO効果も高いといわれていますので、できるだけ使うようにするといいと思います。
マークつきのリストを作る(<ul>~</ul> <li>~</li>)
リストの基本形です。
マークつきのリストを作りたい場合はこちらのタグを使用します。
<ul>タグで全体を囲い、項目ごとに<li>タグを使用します。
リストはWeb上キレイに表示されますので、積極的に使っていくことをオススメします。
<ul>
<li>リスト1</li>
<li>リスト2</li>
<li>リスト3</li>
<li>リスト4</li>
<li>リスト5</li>
</ul>
↓↓↓
- リスト1
- リスト2
- リスト3
- リスト4
- リスト5
番号つきのリストを作る(<ol>~</ol> <li>~</li>)
番号つきのリストを作るときに使用します。
こちらは<ol>タグで全体を囲い、項目ごとに<li>タグを使用します。
<ol>
<li>リスト1</li>
<li>リスト2</li>
<li>リスト3</li>
<li>リスト4</li>
<li>リスト5</li>
</ol>
↓↓↓
- リスト1
- リスト2
- リスト3
- リスト4
- リスト5
用語と説明のリストを作る(<dl>~</dl> <dt>~</dt> <dd>~</dd>)
用語と説明をリスト化するときに使用します。
使い方は全体を<dl>タグで囲い、用語を<dt>、説明を<dd>という形で使用します。
こちらのタグを使うとHTMLがとってもスッキリしますので、検索エンジンにも優しいサイトになります!
また、用語<dt>と説明<dd>は必ずしも1対1になる必要はなく、例えば用語<dt>1つに対して、説明<dd>が6つで構成されていても構いません。
<dl>
<dt>MENU</dt>
<dd>TOP</dd>
<dd>htmlとは</dd>
<dd>CSSとは</dd>
<dd>テンプレート</dd>
<dd>練習問題</dd>
<dd>Q&A</dd>
<dd>お問い合わせ</dd>
</dl>
↓↓↓
- MENU
-
TOP
-
htmlとは
-
CSSとは
-
テンプレート
-
練習問題
-
Q&A
-
お問い合わせ