Blogger:見出し設定(5)どのHタグの見出しを変更するか?

前の関連記事:Blogger:見出し設定(4)テンプレートデザイナーで見出しをカスタマイズ

テンプレートのどこにどのhタグが使われているかを調べる


hタグはすでにテンプレートに使われています。

投稿記事の見出しのデザインを考える前にまずはテンプレートでどのhダグがどこで使われているのかを知る必要があります。

前記事でみたテンプレートデザイナーのCSSを追加機能を使ってh1, h2, h3, h4がどこで使われているのかを調査します。

h1は前記事で見たようにブログタイトルに使われていましたね。


h1をh2に書き換えてプレビューを見ます。


h2は日付とガジェットタイトルに使われていますね。

今度はh2をh3に書き換えてみます。


h3は投稿タイトルに使われています。投稿内容に使っているh3タグも反映されていますね。

h3をh4に書き換えてみます。


どこににも変化がありません。h4は使われていないのでしょうか?

実はコメントタイトルなどはプレビューではみれませんのでそれらは一旦ブログに適用して確認します。

右上の「ブログに適用」ボタンをクリックします。


と表示されたら「ブログを表示」をクリックします。

投稿タイトルをクリックしてコメント欄を表示させます。


h4はコメント関係に使われていますね。

このほかh5、、、とhタグはまだ使われているものがあるかもしれませんがh5以上のタグを調べる価値は低いと思います。

というのもBloggerの投稿エディタの表示形式ではh2、h3、h4しか選択できないからです。


もちろんHTMLモードではh5以上も入力できますが私は作成モードで投稿を編集するのでh5以上は使いません。

まとめると私が使ってるテンプレートでは以下のようにhタグが使われていました。

h1タグ ブログタイトル

h2タグ 日付、ガジェットタイトル

h3タグ 投稿タイトル

h4タグ コメント関係

検討した結果、私は記事のなかではh4を使うとして、記事タイトルはそれ以上に目立つようにするためh3もカスタマイズしました。

参考にしたサイト


Bloggerの本文見出しをカスタマイズする
ここを参考に修飾パターンを採用させて頂きました。

前の関連記事:Blogger:見出し設定(6)Hタグ編集の記録

PR

0 件のコメント:

コメントを投稿