こんにちは。
シーサイドレーベルweb担当の飯野です。
今回は前回ご紹介した
「HTML5の基本的な書き方について②」
の続きのお話です。
前回までのタグを追加した
HTML5の基本的な書き方の例としては
下記のようになります。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>サイトのタイトル</title> <link rel="stylesheet" href="css/style.css" /> </head> <body> コンテンツ内容をここに書きます。 </body> </html> |
今回は、HTML5のタグに未対応のブラウザへの対策は
どの様にすればよいのか。
解決策の１つとしてご紹介させて頂きます。
HTML5の対応をしていないブラウザへの対策
インターネットエクスプローラーのIE6からIE8は、
HTML5の新要素に対応していません。
ですので、HTML5でマークアップしたウェブサイトを
IE8以前で見ると、表示崩れを起こしてしまう可能性が
あります。
正直、古いバージョンのインターネットエクスプローラーを
使う人が居なくなれば良いのにと思うことは何度もあります^^;
（愛用者の方々すいません。。）
セキュリティ面を考えても、しっかりバージョンアップした方が
良いのではと思うのですが。
ただ、バージョンアップ出来ない環境の方も、
まだまだ多くいるのかもしれません。
そこで、 IE8以前のバージョンにHTML5を対応させるための
方法を解説します。
「html5shiv.js」を利用する
IE8以前のバージョンに、HTML5を対応させるための
対策方法の１つとして「html5shiv.js」というスクリプトを
読み込ませる方法があります。
GitHubサイトからスクリプトをダウンロードして使う場合は、
下記にアクセスして、右下にある「Download ZIP」を
クリックしてダウンロードします。
ダウンロードした「html5shiv-master.zip」を解凍して、
「dist」フォルダの中にある「html5shiv.js」ファイルを
お使いのサーバーにアップして<head>〜</head>内に記述します。
|
1 2 3 |
<!--[if lt IE 9]> <script src="html5shiv.js"></script> <![endif]--> |
もしくは、こちらのURLを直接記述して使う方法もあります。
|
1 2 3 |
<!--[if lt IE 9]> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"> <![endif]--> |
<!–[if lt IE 9]><![endif]–>で囲んでいると思いますが、
これは「条件付きコメント」と呼ばれるもので、
「if lt IE 9」と書くと、バージョン番号が９より小さい
（９を含まない）インターネットエクスプローラーの場合にのみ
囲った中の条件を実行するという意味になります。
なので、 IE8以前のバージョンのインターネットエクスプローラーには
「html5.js」スクリプトを実行するという司令を設定していることになります。
これで、IE8以前のインターネットエクスプローラーでも
HTML5の要素を適用することが出来ますので、
表示崩れなどの問題も解決できると思います。
今回は、HTML5のタグに未対応の
インターネットエクスプローラー（IE8以前）への
対応について解説させて頂きました。
では、また来週お会いしましょう。
●３年ぶりに帰ってきた「藤田哲也の個別コンサルティング」
