HTML <noscript> Tag Tutorial - Usage, Syntax,
Attributes and Example

calender-iconPublished: 11 May 2025

clock-icon5-min read





INTRODUCTION

The <noscript> element is used to define a section of webpage which is executed when <script> tag is unsupported or scripting is currently disabled in the browser. This tag is typically used to display alternative content or messages when JavaScript is disabled

The <noscript> tag is used to provide fallback content for users who have disabled JavaScript in their web browsers or for browsers that do not support JavaScript. It ensures that important information is still available even if JavaScript is not executed.

The <noscript> element can be used in both the <head> and <body> section of webpage. When used in <head> section, it can contain one or more <link>, <style>, <meta> elements in any order.

Syntax:


<noscript> 
 -- Code -- 
</noscript>

Example: In the below example if javascript is disabled then the warning message is shown otherwise it is ignored.


<noscript> 
 Hey Your Browser does not support Javascript.
</noscript> 

ATTRIBUTES

The <noscript> element only includes global attributes.


Tag Omission

For <noscript> element both the start and end tags are mandatory.


How to test noscript tag?

To test the <noscript> tag, you need to disable JavaScript in your browser or use developer tools to simulate a no-JavaScript environment. Here are a few ways to do that:

1. Disable JavaScript in Your Browser

Google Chrome - settings > Privacy and security > Site settings > find JavaScript and toggle it off.

Edge: - settings > Cookies and site permissions > Site permissions > find JavaScript and toggle it off.

Firebox:

  • Type about:config in the address bar and press Enter.
  • Click Accept the Risk and Continue to enter the settings.
  • Click show all
  • Search for javascript.enabled
  • Click on it to set it to false.

2. Browser Extension

You can use an Google Chrome extension like Disable JavaScript for quick toggling.

Usage

The <noscript> tag is typically used to display alternative content or messages when JavaScript is disabled. Below are some common use cases:

1. Displaying a Message

The <noscript> tag can be used to display a message to user.


<noscript> 
 <p>JavaScript is disabled in your browser. Please enable JavaScript for the best experience.</p>
</noscript> 
2. Providing Alternative Navigation

The <noscript> tag can be used to divert a user to alternate page which is specially designed without using javascript.


<noscript>
 <a href="alternative-page.html"> Click here if the site is not loading properly. </a>
</noscript> 
3. Using <noscript> Inside <head> for Alternative CSS

The <noscript> tag can be placed in the <head> section to apply alternative styles if JavaScript is disabled:


<noscript> 
 <link rel="stylesheet" href="noscript-style.css">
</noscript> 


Best Practises

  • Avoid relying on JavaScript for critical functionalities.
  • Provide meaningful alternative content within <noscript>.
  • Test your website with JavaScript disabled to ensure accessibility.

Frequently Asked Questions (FAQ)

What is <noscript> tag in html?
The <noscript> element is used to define an section of webpage which is executed when <script> tag is unsupported or scripting is currently disabled in the browser. This tag is typically used to display alternative content or messages when JavaScript is disabled

Where the <noscript> tag, can be placed in an HTML document?
The <noscript> tag can be placed in different locations within an HTML document, depending on its purpose.
  • Inside <head> - Used when you want to apply alternative styles if JavaScript is disabled.
  • Inside <body> - Used to display fallback messages, links, or images when JavaScript is disabled.

What kind of content the <noscript> tag can contain?
The <noscript> tag can contain most types of HTML content, but with some restrictions depending on where it is placed.
  • Inside <head> - It can only contain <link>, <style> and Plain text
  • Inside <body> - It can contain HTML elements like <p>, <div>, <a>, <img>, <form>, etc.

What is the difference between <script> and <noscript> tag?
The <script> and <noscript> tag tags serve different purposes in HTML:
The <script> Tag used to include and execute JavaScript code.
The <noscript> Tag provides fallback content for users with JavaScript disabled or when the browser doesn't support JavaScript.

Is there an HTML tag which is the opposite of <noscript> tag?
In HTML, there is no direct opposite to the <noscript> tag—that is, no native HTML element specifically designed to display content only when JavaScript is enabled.