One of the evil of AJAX sites is that if the user has javascript turned off, the site stops functioning all together. Since I use NoScript extension all the time on Firefox, I really hate sites which don't even tell you that javascript needs to be turned on for the site's functionality to work and when it takes just a <noscript> tag to display a message to the user about js bit:
<noscript>
<div>This site requires javascript to be turned on...blah blah blah.</div>
</noscript>
You can get a bit more enterprising with the noscript tag, for instance what if you don't want the user to even access the page w.o. javascript turned on? Well, in that case you can put noscript tag in the head section and do a meta refresh:
<head>
...
<noscript>
<meta equiv="Refresh" content="0; URL=nojs.html"></noscript>
...
</head>
Ok, what if you don't want to redirect the user but hide all the elements on the page except the no js error message? You can achieve that too by using CSS:
Step 1) Add this div within the body where you want the error message to show up in case the js is turned off:
<div class="ns">
Ouch! No JS
</div>
Step 2) Hide the "ns" div by default:
.ns{display:none;}
Step 3) Hide all the elements on the page and display ns div if js is turned off:
<noscript>
<style type="text/css">
* {visibility:hidden;}
.ns {visibility:visible;margin:0px auto;width:60%;display:block}
</style>
</noscript>
I am using meta within noscript within head to solve the js-disabled problem and will continue to use it even though it is not XHTML conforming. In a strict XHTML 1.0 document, (1) the "noscript" element must directly contain at least one block-level element (such as "p", "h1", "ol", "table"), and (2) the "meta" element may not be directly contained in a "noscript" element.
ReplyDeleteChanged my site according to your info. Now non-JS/AJAX viewers should be able to view it without too much of a problem.
ReplyDelete