The Bottom Line: Accessible, Degradable Content
The aim of any web producer, designer or developer is to create content that is accessible to thewidest range of audience. However, this has to be carefully balanced with design, interactivityand beauty. Using the theories set out in this article, designers, developers and web producerswill have the knowledge and understanding to use jQuery for DOM scripting in an accessibleand degradable way; maintaining content that is beautiful, functional AND accessible.
2. Unobtrusive DOM Scripting?
In an ideal world, websites would have dynamic functionality AND effects that degrade well.What does this mean? It would mean finding a way to include, say, a snazzy Javascript Web 2.0animated sliding news ticker widget in a web page, while still ensuring that it fails gracefully if avisitor’s browser can’t (or won’t) run Javascripts.The theory behind this technique is quite simple: the ultimate aim is to use Javascript for non-invasive, “behavioural” elements of the page. Javascript is used to add or enhance interactivityand effects. The primary rules for DOM scripting follow.
Rule #1: Separate Javascript Functionality
Separate Javascript functionality into a “behavioural layer,” so that it is separate from andindependent of (X)HTML and CSS. (X)HTML is the markup, CSS the presentation andJavascript the behavioural layer. This means storing ALL Javascript code in external script filesand building pages that
do not rely on Javascript to be usable.
For a demonstration, check out the following code snippets:
Bad markup:
Never include Javascript events as inline attributes. This practice should be completely wipedfrom your mind.view plaincopy to clipboardprint? 1.
<a onclick="doSomething()" href="#">Click!</a>
Good markup:
All Javascript behaviours should be included in external script files and linked to the documentwith a <script> tag in the head of the page. So, the anchor tag would appear like this:
Add a Comment
This document has made it onto the Rising list!