JavaScript Alternative

WAI Guideline 6 instructs Web designers to "ensure that pages featuring new technologies transform gracefully." In this context, new technologies refers to scripts, applets or other programmatic elements that turn a static Web page into a dynamic document. To transform gracefully means that a Web site's essential content will still be conveyed to users even if the new technology fails to function. This is especially important for people with disabilities, who often utilize non-standard hardware and software to access the Web. For instance, someone who is blind might use a text-only Web browser that does not execute JavaScript routines. If key portions of a Web page are displayed using JavaScript, this individual will not be able to access that content.

Whenever a script or applet is used to produce some effect on a Web document, an alternative method of conveying the same information must also be provided. This alternative will likely be comprised of standard HTML, text and images that can be accessed by a wide range of browsers. Web designers must carefully consider how to create these alternatives so they communicate the same message as the script or applet. Though an accessible alternative may not be as flashy as the original, it is essential to include it. Otherwise, many users may encounter nothing but a blank page if a script or applet does not work on their browsers. It is a simple matter to provide an alternative to a JavaScript routine by including a pair of "noscript" tags immediately after the JavaScript code. In most cases, the JavaScript routine will be executed by the user's browser and the noscript alternative will be ignored. But for the minority of visitors whose browsers do not recognize JavaScript, the HTML code contained between the noscript tags will be rendered instead.

  <script language = "JavaScript" type = "text/JavaScript">
    Content conveyed using JavaScript
  </script>

  <noscript>
    Same content conveyed without JavaScript
  </noscript>

For the most part, Access Art avoids new technologies that might present accessibility barriers to users. However, the EyeSpy™ image enlargement system described on the Keyboard Access page does utilize JavaScript. In order to ensure that this feature works even in browsers that do not support JavaScript, a script-free alternative is provided. The lines of JavaScript code shown below activate the EyeSpy™ viewer.

  <script language = "JavaScript" type = "text/JavaScript">
    eyespyviewer();
  </script>

Immediately afterward, a noscript tag provides an accessible alternative for visitors whose browsers do not support JavaScript. In this simplified example, an ordinary image is displayed, along with a link that leads to a separate page where visitors can use the image enlargement system without JavaScript.

  <noscript>
    <img src = "filename" alt = "description">
    <a href = "pagename">Image Enlargement</a>
  </noscript>