h7以上の見出しをマークアップすることのことを考えてみる
- 2008年02月14日
- category:XHTML/CSS
- Comment(4)
- Trackback(0)
HTMLで見出しを表すためにはh1~h6要素が用意されています。しかし、7以上のレベルの見出しを必要とする場合の要素は用意されていません。
XHTML2.0からは下記のようにsection要素とh要素の入れ子階層によって見出しレベルを構造的に示すことができるようになるみたいです。
<h>見出しレベル1</h>
<section>
<h>見出しレベル2</h>
<p>....</p>
<section>
<h>見出しレベル3</h>
<p>...</p>
</section>
</section>
しかし現状ではh7以上の見出しを表す要素はないので、どうにか別の方法で対応策を見つけるしかありません。まず思いついたのがh6要素に「h7」というclassを指定する方法。見出しということをh6要素で示しつつ、class指定でh7であることを明示する。うーん・・・微妙か?
<h6 class="h7">見出しレベル7</h6>
それよりはdivに「h7」のclassを指定するほうがいいんだろうか。
<div class="h7">見出しレベル7</div>
もしくはp要素に指定する?
<p class="h7">見出しレベル7</p>
h6に指定するよりこっちのほうがいいような気がしますけど、どっちも微妙ですね。とりあえずdivが一番ましかな?もっといろいろな方法を考えてみようと思ったんですが、僕にはこのくらいしか思い浮かびませんでした。残念!他に何かいい方法をご存知の方はぜひ教えてください!
関連書籍
- Prev Entry
- FireFoxのアドオンHtml Validatorについての覚え書き
- Next Entry
- 「ページトップ」のリンクは必要か(アンケート付き)
トラックバックURL
http://webtech-walker.com/archive/2008/02/14171200.html/trackback
※トラックバックを受け付けてから表示するまでにしばらく時間がかかる場合があります。

ユニバーサルHTML/XHTML
コメント一覧
デッドリー 2008年2月19日 00時11分
俺だったら、この記事の中に記載されている
見出しレベル7
を使うと思います。
何かしらの代替タグとして、divタグはよく使いますよねえw。
hoka(管理人) 2008年2月19日 01時15分
>デッドリーさん
やっぱdivですかね。どれも微妙だもんなぁ・・・
ヒロ 2008年3月3日 21時45分
私もdivが妥当だと思います。h6にクラスをつけた場合、そのh7は複数あるh6のうちで何らかのグルーピングされたものであり、本質はh6である。すなわち階層としてはあくまでh6の階層であると考えられます。pも同様のことが言えます。以上から、divしかないと思われます。
ただ、階層がかなり深いので1ページものの文章としてはかなり読みにくいだろうと思われます。
例えば
題(h1)--第1部(h2)--第1章(h3)-1(h4)-1.1(h5)-1.1.1(h6)
生物分類なら
界(h1)--門(h2)--綱(h3)--目(h4)--科(h5)--属(h6)--種(h7)
民法のように大規模な法令、生物分類・微生物分類などではやむをえない気がしますが、通常の文書ではh7まで階層が発生する文章構成自体を避けるべきだと思います。
さらにh7まで深くなる場合について、実は定義リストにすべきものを見出しと本文に解体している懼れがあるように思えます。
とくに別ページになった時点でh1がリセットされることを思えば。
hoka(管理人) 2008年3月3日 23時01分
>ヒロさん
やはりh6やpは変ですよね。消去法で考えるとdivしか残らないですね・・・
文章構造に関する問題は、確かに仰るとおりだと思います。h7以上の階層になる文章なんて滅多にないですよね。深い構造にしすぎるのがよくないというのもよくわかります。
ただ、妥当な構造の文章でh7以上の階層まである文章をコーディングする機会があったので、一度考えてみたのですよ。そこまで深い構造の文章は僕も今まででその一回だけですけどね。