だいたい決まった構造の 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 なんですよ！！　俺は悪くない！　放せ！