Accessites.org
Everything is a Progressive Enhancement

Mention progressive enhancement as it pertains to web development and many people are going to immediately think of proper and accessible methods of adding JavaScript to a web page. In reality, though, everything is a progressive enhancement. From the addition of styles, imagery, and aesthetic touches, to layout, links, to the aforementioned scripting, even the content can play a role in this category. All of it can enhance a web site, and all of it must be applied progressively. Let’s explore this further…

Most readers here will agree that a basic web site consisting of valid markup used properly — semantically — is a reasonably accessible medium right out of the box. Until, that is, we start adding to it. It is then that we sometimes inadvertently start making a good thing less so. To better understand this, let’s dissect a few typical site enhancements and how we make sure they are progressive:

Content

The styling of the content will fall under styling, so this item relates to the actual content itself. Remember it’s already marked up properly so this item is hard to get wrong, but some do. Content must be readable (again, I’m not talking about line lengths, contrast, or any of these style related issues). It must be readable in that the words used must be understood by your audience. Thus, progressively enhancing raw content is a simple matter of using the proper level of grammar for your readers, adding a glossary if this isn’t entirely possible, and spell checking your text. You don’t have to be an [insert your language here] major. I’ve been on some sites that while fundamentally accessible, were loaded with poorly written content chock full of grammatical and spelling issues. An analogy for a site like this would be a dry well: sure, I can drop my bucket into it, it’s accessible, but I can’t get anything of value out of it.

Styles

A lot of accessible sites suffer in this area. Not to say they lack style, that’s not the point I’m trying to make, but the makers apply styles either excessively in inappropriate ways or in such a way that doesn’t enhance the site but rather degrades it. Too wide or too narrow (layout), too light or too dark (tone or contrast), too small or too large (text). To avoid this malady, look at the site without styles, then think about all that you’re adding. Considerations need to be made along the way. Don’t get me wrong, you can apply high style and still enhance, there’s just a few things that need to be considered then avoided… detailed in the “too this and thats” above.

Images

Imagery is another type of enhancement. One that falls into both of the categories above — the imagery can be content or style. It doesn’t make a difference to me whether either is applied as an embedded image or a background, both can be used to these ends successfully if done right (I don’t subscribe to the popular rule that all decorative images should be backgrounds). What is important is that any content imagery is suitably backed up so as to convey the image’s content value. Otherwise the image isn’t a universally accessible enhancement. The consideration used in content images can also be extended to decorative images in that they should be [file]-sized in such a way that enhances the site, instead of creating a too-long-to-download bandwidth hog. I once visited a site that had four very small images used as supporting decoration. It would have been a nice and progressive enhancement if the images were sized before being embedded, but they weren’t. These image were over a megabyte each. It’s was a simple rather sparse web page with four megabytes of decorative imagery. Not a progressive enhancement.

Scripts

This is the obvious one everyone thinks of, and I will reiterate its implications here with a simple rule: Unless the script is guaranteed to be supported server-side, the same script language must be used to add the enhancement to the page. And if it cannot be supported by the user, make sure that the site’s primarily usability and accessibility is intact. In other words, it you want to add a bit of JavaScript functionality to a web page, use JavaScript to do so, and don’t rely on said script — or noscript element — to make the site usable and accessible. Not everyone’s equipment who can a respond to a JavaScript call, can use the script (see Tommy’s article to better understand this).

The Point

What I hope to convey is that if everything is thought of as a progressive enhancement, a solidly applied embellishment if you wish, then the chance of adding this stuff smartly increases. If we save this type of thinking for the cool scripting phase, it’s easier to overlook some of the more fundamental steps that need to be considered along the way.

Filed under Our Articles —

Bookmarking Links » del.icio.us | Digg | blogmarks | Ma.gnolia | StumbleUpon | Technorati | Help |

These posts may be related:

Graceful Degradation & Progressive Enhancement »

Confirming a Web Site’s Accessibility »

Lotus from the Mud »