Graceful degradation - when to consider

Question

When designing and building the UI for an application that uses AJAX, when do you consider graceful degradation (for users who have JavaScript disabled, or are using a screen re

Answer 1

Graceful degradation can describe two things:

1) It is a behaviour (normally a website or webapp) that allows the site to continue functioning when certain features are disabled (e.g. Javascript; CSS).

2) It is an approach that builds the application to work with bells and whistles turned on, and then afterwards fixes are bolted on to make it work without said noisemakers.

I assume you are asking whether or not to use the latter to achieve the former. I'd definitely suggest achieving 1), as anyone who browses with Javascript off (i.e. lots of people with a computing clue; those using text-based browsers; those using disability aids) will otherwise not be able to use your site.

As for how to do it, A List Apart have a great article on Progressive Enhancement which is worth looking at, where you build the site to work basically first, and then you add the AJAX etc afterwards. I prefer this approach because it gives the app a solid foundation to work on, with decent security and functionality from the word go. Future enhancements to it can be made at the basic level and then added into the AJAX layer; without the former, it's harder to add in gracefully degrading components to the app in the future.

Anyway, enjoy the article and if you want to know more about this stuff generally, A List Apart is a great site!

Answer 2

These days, Progressive Enhancement is generally preferred over Graceful Degradation - i.e. the exact opposite approach.

Answer 3

The method I'm employing so far is to write it so it works without javascript then add the javascript on top.

It's really the reverse of gracefully degradation, it's an emphasis on enhancing the page as your browser and settings allow.

Relevant article

Answer 4

Jeremy Keith sums up the argument for Progressive Enhancement with his Hijax article.

Typically, I use the following code to dynamically apply a class of "js" to the HTML element to target JS-enabled browsers

<script type="text/javascript">if(h=document.documentElement)h.className+=" js"</script>