Two Types of JavaScript
The scripts written with JavaScript can be broken up into two separate groups - .those that just enhance the web page and those that provide essential functionality that the web page can't do without.
It can sometimes be hard to tell the difference between these two groups if you think only of the situation where JavaScript is enabled in the browser. It is when you consider the situation where JavaScript is disabled that the difference between these two groups of JavaScript becomes obvious.
With scripts that simply enhance the web page all that you need to do to make your web page fully accessible without JavaScript is to have the JavaScript written in an unobtrusive way so that when JavaScript is not available everything related to the enhancement that JavaScript provides simply disappears ant the person accessing the page without JavaScript has nothing to tell them that the page even has JavaScript in it unless they view the source of the page.
With scripts that provide essential functionality the situation with regard to what happens with JavaScript turned off is completely different. Since the functionality being provided is essential for the page to work that functionality needs to be provided in some other way when JavaScript is not available. Almost certainly this alternative will require that the web page be reloaded so that server side processing can be run to provide the essential processing that the JavaScript would otherwise provide. In some instances a JavaScript that can do everything within the one page may require dozens of page reloads in order to provide the equivalent essential processing using a server side script.
Where you are intending to use JavaScript to provide essential processing you can build your page in either of two ways - you can write and test the JavaScript version first and then add the server side equivalent processing as a second step or you can write the server side version first and then add the JavaScript version. One reason for recommending the second of these alternatives is that once the server side version has been written the functionality works for everyone and the JavaScript version becomes a nice to have improvement that can if necessary have its implementation delayed. If you write the JavaScript version first then you must add the server side equivalent processing before you implement if you don't want your page to be broken for those without JavaScript.
One "essential functionality" JavaScript that I was actually asked to write some time ago was a script for a Tarot site where the 78 card backs are displayed on the screen and the visitor has to select ten cards. The request was for me to write a JavaScript to detect not only which ten cards were selected but also the order that they were selected in. The JavaScript I wrote basically copied the card identifiers into ten hidden fields that would then be submitted to the server once the requisite ten cards had been selected. As this script would be broken for anyone without JavaScript I also supplied a PHP version where the page automatically reloaded as each card was selected with the PHP recording the selections into the hidden form fields. The original request was just for the JavaScript but I insisted on providing the code that would allow it to work without JavaScript by reloading the page ten times simply because I didn't want to see that script implemented in a way that would be broken for some visitors.
Scripts that enhance a web page can be further subdivided into two groups depending on whether or not the web page appearance will change if the script is unavailable.
An animation script is an example of a script where the appearance of the web page will change if JavaScript is not available. Those with JavaScript enables see the animated version of the appropriate part of the web page while those without JavaScript either see a static version of the same information or do not see it at all (where the information is not essential to the page but merely a nice to have addition such as advertising).
Perhaps the most common of the scripts that enhance a web page but which have no impact at all on how the page looks when JavaScript is not available are form field validation scripts. This type of script simply enhances your visitor's experience of your web page when they have JavaScript enabled without them necessarily even knowing that it is there. What a form field validation script written in JavaScript does is to perform a partial validation of the information that they input into the form and advises of any obvious errors so that they can be corrected before the form is submitted. All that happens if the script is turned off is that this partial validation doesn't run and your visitor has to submit the form and have the page reload in order to find out about any errors at all instead of just those that can't be tested for with JavaScript. In this instance the JavaScript is not substituting for any of the server side processing as all of the server side validations are still needed whether JavaScript is enabled or not. This differs from an "Essential Functionality" JavaScript in that a JavaScript that performs essential functionality actually substitutes for server side processing and so if you could guarantee that all of your visitors will have JavaScript enabled (as may be possible to do on an intranet) you could omit the server side equivalent processing and the script would still provide all of the same functionality.
Where it becomes important to distinguish between these different types of script is in deciding how or if you are going to add server side processing. In the case of an "Essential Functionality" script it is not necessary that the page necessarily functions in the same way with JavaScript enabled and without so long as there is a way to achieve the same end result regardless of whether or not JavaScript is enabled. In the case of enhancement scripts, any server side processing is needed regardless of the presence or absence of the JavaScript and so the issue of what to do to cater for when JavaScript is disabled does not arise.
It can sometimes be hard to tell the difference between these two groups if you think only of the situation where JavaScript is enabled in the browser. It is when you consider the situation where JavaScript is disabled that the difference between these two groups of JavaScript becomes obvious.
With scripts that simply enhance the web page all that you need to do to make your web page fully accessible without JavaScript is to have the JavaScript written in an unobtrusive way so that when JavaScript is not available everything related to the enhancement that JavaScript provides simply disappears ant the person accessing the page without JavaScript has nothing to tell them that the page even has JavaScript in it unless they view the source of the page.
With scripts that provide essential functionality the situation with regard to what happens with JavaScript turned off is completely different. Since the functionality being provided is essential for the page to work that functionality needs to be provided in some other way when JavaScript is not available. Almost certainly this alternative will require that the web page be reloaded so that server side processing can be run to provide the essential processing that the JavaScript would otherwise provide. In some instances a JavaScript that can do everything within the one page may require dozens of page reloads in order to provide the equivalent essential processing using a server side script.
Where you are intending to use JavaScript to provide essential processing you can build your page in either of two ways - you can write and test the JavaScript version first and then add the server side equivalent processing as a second step or you can write the server side version first and then add the JavaScript version. One reason for recommending the second of these alternatives is that once the server side version has been written the functionality works for everyone and the JavaScript version becomes a nice to have improvement that can if necessary have its implementation delayed. If you write the JavaScript version first then you must add the server side equivalent processing before you implement if you don't want your page to be broken for those without JavaScript.
One "essential functionality" JavaScript that I was actually asked to write some time ago was a script for a Tarot site where the 78 card backs are displayed on the screen and the visitor has to select ten cards. The request was for me to write a JavaScript to detect not only which ten cards were selected but also the order that they were selected in. The JavaScript I wrote basically copied the card identifiers into ten hidden fields that would then be submitted to the server once the requisite ten cards had been selected. As this script would be broken for anyone without JavaScript I also supplied a PHP version where the page automatically reloaded as each card was selected with the PHP recording the selections into the hidden form fields. The original request was just for the JavaScript but I insisted on providing the code that would allow it to work without JavaScript by reloading the page ten times simply because I didn't want to see that script implemented in a way that would be broken for some visitors.
Scripts that enhance a web page can be further subdivided into two groups depending on whether or not the web page appearance will change if the script is unavailable.
An animation script is an example of a script where the appearance of the web page will change if JavaScript is not available. Those with JavaScript enables see the animated version of the appropriate part of the web page while those without JavaScript either see a static version of the same information or do not see it at all (where the information is not essential to the page but merely a nice to have addition such as advertising).
Perhaps the most common of the scripts that enhance a web page but which have no impact at all on how the page looks when JavaScript is not available are form field validation scripts. This type of script simply enhances your visitor's experience of your web page when they have JavaScript enabled without them necessarily even knowing that it is there. What a form field validation script written in JavaScript does is to perform a partial validation of the information that they input into the form and advises of any obvious errors so that they can be corrected before the form is submitted. All that happens if the script is turned off is that this partial validation doesn't run and your visitor has to submit the form and have the page reload in order to find out about any errors at all instead of just those that can't be tested for with JavaScript. In this instance the JavaScript is not substituting for any of the server side processing as all of the server side validations are still needed whether JavaScript is enabled or not. This differs from an "Essential Functionality" JavaScript in that a JavaScript that performs essential functionality actually substitutes for server side processing and so if you could guarantee that all of your visitors will have JavaScript enabled (as may be possible to do on an intranet) you could omit the server side equivalent processing and the script would still provide all of the same functionality.
Where it becomes important to distinguish between these different types of script is in deciding how or if you are going to add server side processing. In the case of an "Essential Functionality" script it is not necessary that the page necessarily functions in the same way with JavaScript enabled and without so long as there is a way to achieve the same end result regardless of whether or not JavaScript is enabled. In the case of enhancement scripts, any server side processing is needed regardless of the presence or absence of the JavaScript and so the issue of what to do to cater for when JavaScript is disabled does not arise.
