Ie

[html5.js]とは?

そもそも[html5.js]とは何か?

一言で説明すると「Internet Explorer 8 以前のブラウザでも HTML5 に対応できるようになるスクリプト」です。

Microsoft が開発している[Internet Explorer]は、そこそこ普及しているにも関わらず、エラーやセキュリティの脆弱性が多く、また最新技術への対応も遅く、特にウェブデザイナーの方たちからは「諸悪の根源」として忌み嫌われている残念なブラウザです。

実際 Internet Explore 9 でようやく HTML5 の新要素がサポートされるようになったものの、下位ヴァージョンの Internet Explorer 8 以前のブラウザで HTML5 で製作したサイトを閲覧すると恐ろしいほどにレイアウトが崩れて表示されてしまいます。

これは、Internet Explorer 8 以前では HTML5 から導入された新しいタグ、例えば「header」「aside」「footer」「section」「article」等は未知の要素として扱われ、タグとして認識してくれないことが原因で起こる、ある種の致命的なバグです。

仮に HTML5 に未対応のIE(Internet Explorer)に対して新しいタグを認識させたい場合、以下のような JavaScript のコードを読み込ませる必要があります。

<script type="text/javascript">
document.createElement('header');
document.createElement('footer');
document.createElement('その他の新要素名…');
</script>

上記のコードで「document.createElement()」メソッドを使って半ば強制的に新しい要素を追加生成し、IE にも HTML5 を対応させることができます。

しかしながら HTML5 の要素は数が多く、いちいち1つ1つ記述していくのは大変です。
そこで開発されたのが[html5.js]で、このライブラリを<head>〜</head>要素内のCSSを組み込んでいる部分よりも前に配置すれば、IE8 未満でも HTML5 の新要素が認識されるようになります。

具体的には以下のコードを<head>〜</head>内に挿入することになります。

<!--[if lt IE 9]>
<script type="text/javascript" src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

[if lt IE 9]と[endif]を「<!--」と「-->」のコメントで囲うのは、IE独自の仕様で「もしもIEのバージョンが9未満だったならば◯◯を実行する」という意味になります。

ちなみに、お気づきかもしれませんが、実は[html5.js]は旧名で、現在は「html5shiv.js」と呼ばれています。

さて。
前置きが長くなりましたが、この度オンズでは [html5.js]または[html5shiv.js]の利用を止めることにしました。

これは「Internet Explorer 8 には対応しない」ということと同義です。

[html5.js]を使わないコーディング方法とは?

実際に[html5.js]または[html5shiv.js]を使わずとも、HTML5 を IE8 以下に対応させる方法があります。

それはズバリ「HTML5 タグにCSSを設定しない」ことです。

HTML文書の製作を開始するとき、まずは HTML5 を使わずにマークアップしていき、CSS でデザインを整えた上で、後から任意の要素を HTML5 タグで囲んでいくことで「HTML5 タグに CSS を設定しない」ことが実現します。

HTML5 の大きなメリットと特徴の1つは文書の構造化と意味付けです。
CSSによる「デザインの設定」は従来の <div> 要素等に効かせてスタイリングを行い、文書の「意味付け」に関しては、後から HTML5 を追加するようにすれば、HTML5 を使いつつ、IE8 でもデザインの表示が崩れることがありません。

今後のマークアップの動向は?

先日、遂に正式に HTML5 が「勧告」されました。
周知の通り代表的なモダンブラウザである「Safari」「Google Chrome」「Firefox」はHTML5に対応しています。

しかし、未だ「Internet Explorer」のようなバグだらけのブラウザが一部のシェアを獲得しているのも事実。
こうした新旧が入り乱れる中で、どのような方針でマークアップに取り組むことが正解なのか?

様々な見解があるかと思いますが、「廃れていく古い技術は切り捨てる」ことを、1つの選択肢として検討してみてはいかがでしょうか。

過去、Apple は Adobe の「Flash」を切り捨て、業界では大きな波紋を呼びました。
結果的に Apple の選択と決断は正しかったワケですが、同じように、オンズでは「Internet Explorer」を切り捨てる決断をしました。

この選択は「古い仕様へ対応するために注がれていたリソースを、もっと新しく、クリエイティブな方向に費やしたい」という思いが根底にあり、今後廃れて消えていくブラウザに対応するのは無意味だと実感しているからです。

保守的な意見をお持ちの方からすればかなり過激な意見かもしれません。

しかし、時代の最先端を担い、未来を創造していくクリエイターとして、必要な決断なのではないかと思うのです。