Question

What general guidelines should I follow to degrade a JS-based web application gracefully? Are there such guidelines? Are there any public pages that make for good / bad examples? Are there any common pitfalls?

Answer 1

Create your application using progressive enhancement rather than graceful degradation. That means that first you should make your application work properly without Javascript whatsoever (so, for instance, you’d need all your links to have corresponding actions on the server). Then once that’s working, you can enhance your application by adding Javascript and AJAX on top of it.

This, obviously, applies to more than just AJAX calls, but to any Javascript at all. For instance, in one of my applications I wanted to provide the user with a way to choose a number from a range. To do so, I was going to create a slider widget using Javascript, so that the user can move the slider to the number they want. However, in order to have the page still work without Javascript, I started with a <select> containing all the possible values, and built my slider widget to start with / work on top of that <select>. That way, users with Javascript available/enabled would have a richer experience but users who don’t would still be able to fully use the application.

Resources:

• Progressive Enhancement with JavaScript
• Graceful degradation versus progressive enhancement