HTMLパーツからHTMLタグへ 【ヘッダー編２】

ども、サンデーアマグラマーNorimakiです。
今日は親戚の家に行っていたので作業は出来てません。
なもんで、ＭＴのラスボスも倒せていません。

ということで、急遽、前にやっていたHTMLタグについて書いて
みたいと思います。

ヘッダー部分の要素について書いていました。

・ヘッダー画像
・サイトタイトル
・サブタイトル
・サイトの説明文
・アフィリエイトバナー
・H1タグ
・ナビゲーション（パンくずリスト・グローバルメニュー
　のようなもの）
・各種リンク

これでしたね。でもって、ヘッダ部分は

<div id="header">～</div>

で括ると。ここまでが、前に書いた内容のおさらいです。
では行きます。


■ヘッダー画像

ヘッダ画像については、スタイルシートのidで設定します。
headerですね。ここのスタイルの背景画像として、ヘッダー
画像を設定します。


■サイトタイトル

サイトタイトルはH2タグで括ろうかとは思いますが、
場合によってはクラス名"SiteTitle"をつけても良いかなと
思っています。

<h2 class="SiteTitle">～</h2>

みたいな感じです。大体、サイトタイトルはトップページに
リンクしているので、aタグに関するスタイルも設定しておく
必要がありますね。HTMLは、

<h2 class="SiteTitle">
<a href="サイトタイトルURL">サイトタイトル</a>
</h2>

という感じになりましょうか。


■サブタイトル

ここは、サブタイトルなので、通常は１行くらいかと思いますが、
pタグで括りましょうか。クラス名は"SubTitle"でしょうか。

<p class="SubTitle">サブタイトル</p>

こんな感じで。あるいは、spanタグではどうでしょうか？

<span class="SubTitle">サブタイトル</span>

こうなりますが。タグの意味ってのをあまり気にしてないので、
使い分けが出来ないんですが、どっちが良いんでしょうかね。
ここら辺は検討課題ということで。


■サイトの説明文

ここは複数行になる可能性が高い部分ですが、実はサブタイトルと
同じようなやり方でOK。クラス名は"SiteExp"と言った感じ。

<p class="SiteExp">サイト説明文</p>

こんな感じで。


長くなってしまったので、続きは次回以降にしたいと思います。


ではでは。
Norimakiでした。




無料ツール（配布期間限定）が手に入るメルマガ発行中です。
登録はこちらからどうぞ