HTML辞書ホームへ
HTML要素 辞書 by Sentaro
<noscript>
ノースクリプト要素。JavaScriptが無効になっている、または対応していないブラウザ向けに代替コンテンツを提供します。
info
概要
<noscript> 要素は、**ブラウザがスクリプト（主にJavaScript）をサポートしていない**、または**ユーザーがブラウザでスクリプトを無効にしている**場合にのみ、その内部のコンテンツを表示します。
クライアントサイドスクリプトに依存する機能の代替手段を提供するために使用されます。
warning
配置の制限
<noscript> のコンテンツは、通常はブロックレベルまたはインラインレベルのHTML要素ですが、配置できる場所はコンテキストによって異なります。<head> 内に配置する場合は <link>, <style>, <meta> のみを含めることができ、<body> 内に配置する場合は透過的なコンテンツモデルに従います。
play_circle
デモ (静的表示)
HTML (Source)
<script>
document.write("このメッセージはJavaScriptが有効な場合に表示されます。");
</script>
<noscript>
<p>JavaScriptが無効です。コンテンツの一部が利用できない可能性があります。</p>
<a href="./basic-version.html">基本バージョンを見る</a>
</noscript>
Preview (Result)
<noscript>の内容は通常非表示です。
（JavaScriptが無効な環境ではこのメッセージが表示されます。）
list
属性 (Attributes)
| 属性名 | 説明 |
|---|---|
| **グローバル属性** | <noscript> 要素には固有の属性はありません。すべてのグローバル属性を使用できます。 |
code
実用例
1. JavaScript利用不可の警告表示
<p>
サイトを完全に利用するにはJavaScriptが必要です。
</p>
<noscript>
<div style="border: 1px solid red; padding: 10px; background-color: #ffeaea;">
<strong>警告:</strong> JavaScriptが無効化されています。一部機能が動作しません。
</div>
</noscript>
2. フォーム送信の代替手段の提供
<form id="js-form" onsubmit="return handleSubmission(this);">
<... 入力フィールド ...>
</form>
<noscript>
<p>
JavaScriptが無効なため、代わりにシンプルなフォームをご利用ください。
</p>
<form action="/submit-basic" method="POST">
<... 基本的な入力フィールド ...>
</form>
</noscript>
lightbulb
知っておくべき重要事項
accessibility_new
アクセシビリティとSEO
Googleなどの検索エンジンはJavaScriptを実行しますが、すべてのクローラーが完全にサポートしているわけではありません。重要なコンテンツやナビゲーションは、JavaScriptに完全に依存せず、**
Googleなどの検索エンジンはJavaScriptを実行しますが、すべてのクローラーが完全にサポートしているわけではありません。重要なコンテンツやナビゲーションは、JavaScriptに完全に依存せず、**
<noscript> 内またはデフォルトのHTMLでアクセス可能** にしておくことが、アクセシビリティとSEOの両面で重要です。
code_off
AMP HTMLとの関連
この要素は、Googleが推奨する高速化技術であるAMP（Accelerated Mobile Pages）の仕様で、**AMPファイル内でのみJavaScriptが無効な場合にコンテンツを表示する**ための重要な役割を果たしています。
この要素は、Googleが推奨する高速化技術であるAMP（Accelerated Mobile Pages）の仕様で、**AMPファイル内でのみJavaScriptが無効な場合にコンテンツを表示する**ための重要な役割を果たしています。