Particletree · The Hows and Whys of Degradable Ajax

It’s been a long time since I turned Javascript off. This is a good article about building gracefully degrading Ajax-enabled web applications. Basically, make sure you have at the core of your application a regular web-page, minus any scripting or onclick events. Then, build your Ajax features back in from there.

Particletree · The Hows and Whys of Degradable Ajax

How to Approach Degradable Ajax

The general strategy here is to start by creating a page that works like a normal site—processing information on page loads and refreshes. Then, if JavaScript is enabled, we have our scripts bypass this normal functionality and replace it with sweet Ajax functionality.

Now, creating a degradable Ajax site is a bit different from a creating a site with unlimited Ajax potential. Here are some strategies I’ve come up with to help you build a degradable Ajax page.

JavaScript: Start with JavaScript turned off. Doing this forces you to make sure you structure your page to work without JavaScript enabled. This does not mean that you can’t add slick Ajax animations in later, but it does keep you focused on the goal. It also means that we are temporarily removing “onclick” from our toolbox.

Markup: If you design a project with no JavaScript from the start (and therefore no “onclick”), you will realize the only elements that perform an action and are “clickable” places for user interaction are the <a> elements and the <input type="submit"/> elements. What you are sacrificing then, is the ability to make divs and other common elements clickable. I have, however, noticed that most of your general web 2.0 effects can be accomplished no problem with just these two elements. It’s sort of like in CSS when you have to make sure an element doesn’t have a fixed width AND left or right padding to insure it doesn’t create problems with browsers that don’t follow the box model properly. It’s not hard, just requires a little extra creative problem solving effort.

Noscript: And let’s not forget that when you’re creating an interface, there’s a W3C ordained element meant specifically for allowing users access to content that wouldn’t be available if a browser has scripting disabled.


Sorry, comments are closed for this post.