だいたい決まった構造の HTML を書くようになってきたので、俺の場合を紹介してみる。body 以下を書く。

1. body
   1. (div#all)
      1. h1#top
         1. a
      2. div.section#navigation
         1. h2
         2. (p#skip-to-main-content)
            1. a
         3. map
            1. ul
               1. li#navigation-home
                  1. a
               2. 以下似たようなのが続く
      3. div.section#content
         1. div.section
            1. h2
            2. 内容
         2. 以下似たような（ｒｙ
      4. div.section#footer
         1. address

おおむね上のような感じ。っていうか ol, li で書くとすげぇ大変なんですが！！

これはもちろん現実的にこうなっただけであって、いろんな妥協に溢れている。

body 直下の div#all なんてもちろんいらない要素だけど、実際問題 CSS 書くときに、これがあるだけで、クロスブラウザ用の無駄にややこしいハックを減らせるので、安全になる。幅も広がる。

div#navigation map なんて、パっと見変な風に見えないかもしれないけど、ぶっちゃけた話、こじつけられた div 要素みたいなもの。意味的には問題ないので、使ってみると結構便利。ただし display: block を書かないとハマるときがある。こいつには一枚多く背景に画像突っ込めるわけだ。あと実は p#skip-to-main-content も、アクセシビリティの配慮とか、そういうの関係なく、あると便利な要素の一つ。サイトによっては書かなかったり (そもそもナヴィゲーションがないとか) するけど。

できるだけ意味をこじつけて、div じゃない要素を使おうとしているだけ。いろいろ置換してけば div 厨になるんです。なんでもいいけど、悪いのは微妙な仕様の CSS と、その CSS に対応してない IE なんですよ！！　俺は悪くない！　放せ！

1. トップ
2. sw
3. 俺的 XHTML 構造

1. トップ
2. web
3. 俺的 XHTML 構造

1. トップ
2. csS
3. 俺的 XHTML 構造