サイト製作 - 3 / html

サイト製作 - 2のつづき

実際にソースを書いて、

このような形に作ってみる。
※CSSで上図のようなレイアウトに整形するのは次回にやるので、
とりあえず、htmlソースを仕上げる。

下の画像のようなソースを書いてみる。



ブラウザで表示すると下の画像のように表示される。

タグ名	役割
h1	ページの主題
h2	h1に続くページのサブ題
p	文章の段落（pは段落「paragraph」のp）
ul	リストを箇条書きの形式で使用する際に記載
li	リストの項目を記述

タグにはそれぞれ役割がある。
h1でページの主題を記述して、pタグでテキスト文章を盛り込み、liタグで他のページへのメニューリストを箇条書き作成する。

少ないコンテンツでも十分Webサイトの1ページが出来上がる。
※ちなみにメニューでは他のページへのリンクを記述するが、現段階では「index.html」のTopページしか編集していないため、設置方法だけ↓

タグ名	役割
a	aタグはリンク要素。他のページやサイトへ移動する

<a href="URL">リンクの名前</a>

aタグで挟む文言に画像を指定すれば画像でのリンクになる

divでの区切りは下の画像を参照。



次はCSSでデザインやレイアウトを整形して、
サイトを作る。