Designing a website for both javascript script support and not support

Question

Okay i know that it's important for your website to work fine with javascript disabled.

In my opinion one way to start thinking about how to design such websites is to detect javascript at the homepage and if it's not enabled redirect to another version of website that does not javascript code and works with pure html (like gmail)

Another method that i have in mind is that for example think of a X (close button) on a dialog box on a webpage. What if pressing the X without any javascript interference lead to sending a request to the server and in the server side we hide that dialog next time we are rendering the page, And also we bind a javascript function to onclick of the link and in case of the javascript enabled it will hide the dialog instantly.

What do you think of this? How would you design a website to support both?

Answer 1

One way to deal with this is to :

• First, create the site, without any javascript
• Then, when every works, add javascript enhancements where suitable

This way, if JS is disabled, the "first" version of the site still works.

You can do exactly the same with CSS, naturally -- there is even one "CSS Naked Day" each day, showing what websites look like without CSS ^^

One example ?

• You have a standard HTML form, that POSTs data to your server when submitted, and the re-creation of the page by the server displays a message like "thanks for subscriving"
• You then add some JS + Ajax stuff : instead of reloading the whole page while submitting the form, you do an Ajax request, that only send the data ; and, in return, it displays "thanks for subscribing" without reloading the page

In this case, if javascript is disabled, the first "standard" way of doing things still works.

This is (part of) what is called Progressive enhancement