HTML Noscript Fallback | JS Disabled Support Guide

HTML NoScript Fallback

HTML <noscript> tag is used to provide fallback content when JavaScript is disabled or not supported in the browser. It ensures that users still see important messages or basic content even if scripts are not working. This improves accessibility and user experience for all devices and browsers.

4 views

5 min read

What is NoScript?

Some users disable JavaScript in their browsers. The <noscript> tag shows content ONLY to those users.

Why do people disable JavaScript?

Security concerns
Slow internet
Privacy reasons
Some corporate networks block it

Example:

1<script>
2    // This runs if JavaScript is ON
3    document.getElementById('dynamic-content').innerHTML = '<p>JavaScript is working!</p>';
4    console.log('JavaScript enabled');
5</script>
6
7<noscript>
8    <!-- This shows ONLY if JavaScript is OFF -->
9    <div style="background-color: #f8d7da; color: #721c24; padding: 15px; border: 1px solid #f5c6cb; text-align: center;">
10        Warning: This website requires JavaScript for full functionality. 
11        Please enable JavaScript in your browser settings.
12    </div>
13</noscript>

Real-world example:

1<noscript>
2    <p style="color: red;">JavaScript is disabled. Some features may not work.</p>
3    <a href="no-js-version.html">Click here for the non-JavaScript version</a>
4</noscript>

When to use:

When your website needs JavaScript to work
To inform users why something isn't working
To provide an alternative version