Tag HTML <noscript>
A tag <noscript> exibe conteúdo alternativo em navegadores que não suportam scripts ou têm JavaScript desativado. Descrição e exemplos de uso.
A tag <noscript> define um conteúdo que o navegador exibe somente quando o JavaScript não está disponível — seja porque o navegador não suporta scripts, seja porque o usuário os desativou. Quando o JavaScript está habilitado, o navegador ignora o elemento <noscript> e não renderiza nada a partir dele.
Esta página explica para que serve o <noscript>, onde é permitido utilizá-lo e como usá-lo para oferecer uma experiência significativa a pessoas que não executam seus scripts.
Quando usar <noscript>
As interfaces modernas dependem muito de JavaScript, mas uma parcela não desprezível de requisições chega com o scripting desativado: usuários preocupados com privacidade e extensões como NoScript, ambientes corporativos com restrições, conexões instáveis em que um script falhou ao carregar, e muitos rastreadores da web. A tag <noscript> é a ferramenta padrão para aprimoramento progressivo e degradação graciosa — construindo uma página que ainda comunica algo útil quando a camada JavaScript está ausente.
Usos típicos:
- Substituir um widget renderizado via JS (um gráfico, um feed ao vivo, um mapa interativo) por uma mensagem estática, link ou imagem de fallback.
- Avisar o usuário que um recurso depende de JavaScript e explicar como proceder.
- Fornecer uma alternativa sem JS, como um
<form>simples que envia dados ao servidor em vez de usarfetch.
Intimamente relacionada está a tag <script>, que incorpora o JavaScript do qual <noscript> serve de fallback — as duas geralmente são escritas juntas.
Onde você pode colocar <noscript>
No HTML5, a tag <noscript> pode ser colocada tanto no <head> quanto no <body>. No HTML4, era permitida apenas dentro de <body>. O posicionamento determina qual conteúdo é permitido dentro dela:
- Dentro de
<head>pode conter apenas elementos<link>,<style>e<meta>. É assim que se troca folhas de estilo ou metadados para o caso sem JS. - Dentro de
<body>pode conter qualquer conteúdo de fluxo — parágrafos, imagens, links, formulários e assim por diante.
<noscript> no <head> (apenas <link>, <style>, <meta>)
Por exemplo, carregue uma folha de estilo de fallback que estilize conteúdo normalmente oculto até que o JavaScript o revele:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<noscript>
<link rel="stylesheet" href="no-js.css" />
</noscript>
</head>
<body>
<p>Page content.</p>
</body>
</html><noscript> no <body> (qualquer conteúdo de fluxo)
No body, você pode usar conteúdo de fallback mais rico. Este exemplo renderiza uma mensagem estática no lugar de um widget que o JavaScript normalmente construiria:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<div id="chart">
<script>
document.getElementById("chart").textContent =
"Interactive chart loaded with JavaScript.";
</script>
<noscript>
<p>Charts require JavaScript. Please enable it to view live data,
or <a href="/report.csv">download the raw report</a> instead.</p>
</noscript>
</div>
</body>
</html>Quando o JavaScript está habilitado, o <script> substitui o conteúdo do container e o bloco <noscript> não produz nada. Quando está desativado, o script nunca é executado e o usuário vê o parágrafo estático com um link de download funcional.
Sintaxe
A tag <noscript> vem em pares. O conteúdo de fallback é escrito entre as tags de abertura <noscript> e de fechamento </noscript>.
<noscript>Sorry, your browser doesn’t support JavaScript!</noscript>Atributos
A tag <noscript> suporta os Atributos Globais e os Atributos de Evento.