Hiding Scripts from Older Browsers
- Very old browsers don’t understand JavaScript. There are very few such browsers in use today, but two factors force us to continue to consider environments that may not be able to cope with our JavaScript code.
- Firstly, all modern browsers allow users to control whether JavaScript code will be run. In many cases, users will not have any say over their company policy, and may not even know that their work machine has had JavaScript disabled.
- Secondly, not all of your visitors will be using browsers that can make any use of JavaScript. Braille displays, screen readers and other non-visual browsers have little use for many JavaScript tricks. In addition, search engines like Google will ignore any JavaScript you use on your pages, potentially hiding important content and causing your pages to remain unindexed.
- Browsers that don’t support JavaScript are supposed to ignore anything between the opening and closing script tags. However, many break this rule and will attempt to render your code as HTML, with potentially embarrassing consequences.
- However, we can use the fact that <!– denotes a single line comment in JavaScript but a multi-line comment in HTML to ensure that our code is seen by a JavaScript-savvy browser, but ignored as commented-out HTML by anything else:
<script>
<!– hide from older browsers
… your code
// stop hiding code –> </script>
o This prevents older browsers from displaying the code, but what if we want to replace this with some comment. For example, let’s say we had a bit of code that displayed the time of day and greeted our user by name. Without JavaScript and using the method above, there would simply be a blank on the page where the greeting should have been.
o We can use the <noscript> tag to cause our code to “fail gracefully” where JavaScript has been disabled or is unavailable. The contents of this element will be ignored where JavaScript is understood, and displayed anywhere else.
For example:
<noscript>
<h1>Welcome to our site!</h1>
</noscript>
<script>
<!– hide from older browsers
… code to customise header
// stop hiding code –>
</script>
Project
o Open your previous project file, and save it under the name chapter_8.html.
o Add two lines to your code to ensure that it will not confuse older browsers or browsers where the user has disabled JavaScript.
o Add a noscript element to explain what your JavaScript does.
It is generally considered “bad form” to instruct your user to “upgrade to a better browser”, as this can insult many people
who use assistive devices – consider this form of advice to be similar to the advice that tells a blind person “to get some
glasses”.
o Instead where possible you should use the noscript element to provide content that adequately replaces the scripted content
with a suitable replacement. For example, if you use your JavaScript to build a navigation panel on your page, the noscript element should contain a plain HTML list that does the same job.
Recent Comments