2011年12月15日 20:00 [Edit]

備忘録 - 本blogをHTML5にするためにやったこと

html5-logo

正確には、「本blogをIEから見てHTML5に見えるようにするためにしたこと」ではありますが。



レシピ

二つだけ

  1. <!DOCTYPE html><html>の前に追加
  2. <head>内に以下を追加
    <!--[if IE]>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
    <![endif]-->
    

本来であれば1.だけでIE9はHTML5モードになってくれるはずなのですが、2.がないと駄目でした。実のところHTML5では2.はinvalidなのですが、重要なのはvalidityではなくブラウザーの挙動なので。Chrome Frameでも利用されているテクニックですし。

そうした理由

  • IEのためだけにJavaScriptを書き分けるのはもううんざりだし
  • 同じIEでもIE9はECMAScript 5をフルサポートしているけど、Quirks modeになったとたんどこ吹く風だし
  • 本blogではIEのアクセスはもう2割しかなくて、うち半分はIE9なので、HTML5非サポートなブラウザーは1割を切ったし
  • その一割もChrome Frameを使えばしのげるし
  • 少なくともJS以外の部分の表示や挙動が大きくおかしくなることはなさそうだし

というわけでWindows XPをお使いの方は、MacにするかUbuntuにするかWindows 7にするかChromeかFirefoxでご覧になるかChrome Frameをインストールするかしていただけるとうれしい…な。

Dan the Man with Too Many Kinds of Browsers to Support

追記:

はてなブックマーク - 亜細亜ノ蛾 - ブックマーク
どうして誰もが 2 を条件付きコメント (Conditional Comments) で囲まないのだろう。「IE 用の記述」なのに。

というわけで<!--[if IE]><![endif]-->で囲みました。id:asiamoth++


この記事へのトラックバックURL