<noscript>タグは、<script>要素を使用して埋め込んだスクリプトが実行できない環境のユーザーのために、代わりに表示させる内容を指定するタグです。今回は、HTML5における<noscript>タグの使い方をご紹介します。
HTML5における<noscript>タグの使い方
まず、<noscript>は、<script>で用意したスクリプトが実行できない場合の、代替コンテンツを用意するためのものなので、単体では使わず、必ず<script>とセットで使用することになります。スクリプトが通常通り実行できた場合は、<noscript>のコンテンツは表示されません。
スクリプトが実行されない環境の原因は主に２つ考えられます。１つが、ブラウザのバージョンが古くスクリプトが実行できない場合です。もう１つは、ブラウザの機能では対応しているけど、設定でスクリプトを無効化している場合です。
使用の仕方は以下のようになります。<script>要素の下に<noscript>〜</noscript>で代替コンテンツを囲んで使用します。
|
1 2 3 4 5 6 |
<script> コンテンツ </script> <noscript> 代替コンテンツ </noscript> |
<script>では、多くの場合、動きのある動画や画像のようなコンテンツを表示させていると思うので、<noscript>の代替コンテンツでは、似たような内容の静止画やキャプチャー画像を使用するのが望ましいでしょう。以下がサンプルコードです。
|
1 2 3 4 5 6 |
<script> コンテンツ </script> <noscript> <img src="代替コンテンツのURL" alt="代替コンテンツのキャプション" width="横幅" height="高さ"> </noscript> |
また、HTML4.01では<noscript>要素を<head>要素内に使用することはできませんでしたが、HTML5では<head>要素内にも使用することができるようになっています。また、<head>要素内で使用する場合では<noscript>要素の中に<link>要素、<style>要素、<meta>要素のみ記述することができます。
