HTML noscript: Fallback Content When JavaScript Is Disabled

HTML <noscript> contains fallback content for situations in which the browser cannot use scripts. It does not detect a failed JavaScript download or a runtime error, so you must implement error messages separately.

Disabled scripting and failed execution are different

When the browser is configured to run scripts, the content inside noscript is not displayed as ordinary page content. A missing file, syntax error, or runtime exception does not automatically switch the page to noscript. If readers need guidance when a feature fails, consider providing a message in the basic HTML and updating it only after the script succeeds.

Complete example: compare successful execution and an error

Save the following document as noscript-demo.html and open it in a browser. With JavaScript enabled, the initial message changes to a success message. The example uses no external libraries or server requests.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Comparing noscript behavior</title>
</head>
<body>
  <h1>Script status exercise</h1>
  <p id="status">The script has not updated this message yet.</p>
  <noscript>
    <p>Scripting is currently unavailable. Please read the basic guidance below.</p>
  </noscript>
  <p>Basic guidance: you can read this page without scripts.</p>
  <script>
    if (new URLSearchParams(location.search).has('fail')) {
      throw new Error('Demo runtime error');
    }
    document.getElementById('status').textContent = 'The script has run.';
  </script>
</body>
</html>

1. Open the document with scripting enabled. The page displays The script has run. and the basic guidance, while the noscript message remains hidden.
2. Open it again with ?fail=1 appended to the address. The demo error leaves the initial message in place, but the noscript message does not appear because scripting is still enabled. You can check the demo error in the developer tools console.
3. Disable JavaScript for this page using the browser’s settings or developer tools, then reload it to display the noscript message. Simply deleting the script element is a different test.
4. After the exercise, restore the original JavaScript setting, remove the query string from the address, and reload the page.

If your environment restricts query strings on file addresses, serve the same file through a local web server for comparison. The menu and scope of script disabling vary by browser and developer tools, so check the relevant settings. Apply the change temporarily to the exercise page and restore it afterward rather than disabling scripting across the whole browser.

Keep basic content and guidance in the body

Put ordinary fallback paragraphs and links inside body, as the example does. The allowed content of noscript inside head is restricted, so do not put paragraphs or buttons there. Do not nest one noscript inside another.

If JavaScript generates all essential explanations or contact options, readers may lose access when it does not run. Provide content in the initial HTML wherever possible, then progressively enhance the parts that need interaction. This reduces dependence on a fallback message alone. Do not assume noscript provides error recovery or security features; the MDN noscript reference explains its display conditions.