俺的 XHTML 構造

sw web csS | 11:53 |

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

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
        
        li#navigation-home
        
        a
        
        以下似たようなのが続く
  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 なんですよ！！　俺は悪くない！　放せ！