Redirect to a URL if Javascript is disabled

Asked

Viewed 264 times

4

Using the tag <noscript> it is possible to detect when the Javascript engine is disabled in the browser (as per this question), but how to redirect the browser, after a few seconds, to a particular page or URL if you enter the <noscript>?

In addition to redirecting after a certain time (e.g., 5 seconds), display a message before the start of the body, something like:

<body>
   <noscript>
      Seu navegador não tem suporte ao JavaScript ou ele está desabilitado!
      <br>
      Você será redirecionado em 5 segundos...
   </noscript>
   ... resto do conteúdo
</body>
html5 redirecting

2 answers

6


One of the alternatives is to put a Meta Refresh within the <noscript> with the page path you want to forward the user.

<noscript>
  <p>teste</p>
  <meta http-equiv="refresh" content="2; https://developer.mozilla.org/en-US/docs/Web/HTML/Element/noscript">
</noscript>

Here are more details about this Meta Tag: Screen forwarding after Load

About the Meta inside Body (undeclared)

See what’s in the documentation: https://www.w3.org/TR/html5/document-metadata.html#the-meta-element

inserir a descrição da imagem aqui

"If the attribute http-equiv is present, but not in the state of the coding declaration: in an element noscript that is child of a head element."

That is to say: If it is a meta attribute-ridden http-equiv other than of the type http-equiv="content-type" you can use inside a <noscript> direct son of <head>.

So the ideal is to declare your code from noscript within the head, Chrome will render the above code in this way. Note that even the noscript being inside the head the tag <p> is rendered inside the body. I believe this behavior can vary from browser to browser...

inserir a descrição da imagem aqui

  • Then I’d have to use two <noscript>, one in the body and one in the head?

  • @Sam not necessarily, because I tested Noscript with Meta right inside Body and it worked. (Chrome 74, Win 10). You have to see how the Noscript tag is interpreted in the Render Tree

  • But I think putting meta tags inside the body is incorrect within HTML5 specifications, no?

  • @Sam I will search, but some tags normally used inside the <head> tb are allowed inside the body, like <link> and <style>, the meta I will search, but it should be allowed, because it works :)

  • Take a look here :D

  • @Sam I edited the answer and put in a few more pointers. Note that even having tags like <p> inside the noscript in the head, the browser puts this content inside the body, and redirects it as expected

  • 1

    I had remembered meta http-equiv="refresh" but had not thought to use so interesting the idea

  • @Ricardopunctual I just remembered pq the other day even used it in an rss response.

Show 3 more comments

1

Following the suggestion of the hugocsl, I decided to insert a <noscript> also in the head with the meta tag.

According to this specification HTML5.2, it is allowed to insert tag <noscript> within the head, according to the text related to the elements meta:

Contexts in which this element can be used:
If the http-equiv attribute is present but not in the encoding declaration state: in a noscript element that is a Child of a head element.

Free translation:

Contexts in which this element can be used:
If the attribute http-equiv is present but without a codification declaration (cyto: http-equiv="content-type"): within an element noscript child of an element head.

So it was like this:

<html>
   <head>
      <noscript>
        <meta http-equiv="refresh" content="5; url=index2.html">
      </noscript>
   </head>
   <body>
      <noscript>
         Seu navegador não tem suporte ao JavaScript ou ele está desabilitado!
         <br>
         Você será redirecionado em 5 segundos...
      </noscript>
      ... resto do conteúdo
   </body>
</html>

  • The interest is to see that the browser is smart enough to grab tags inside the noscript and render inside the body. At least in Chrome... Then look at the last image I updated in the other answer as it is in the browser

  • 1

    All right. vlw!!

Browser other questions tagged html5 redirecting

You are not signed in. Login or sign up in order to post.