Everyone likes to ‘jazz’ up their website, if done correctly it can add much to the user’s experience and with libraries such as jQuery so incredibly easy to use and integrate into a website it is becoming more popular all the time. However, there can be an over reliance on Javascript and this article will look at when to use Javascript, some ideas on what to implement using it and discuss fall-back options.
Why even Bother?
Why should we even worry about when and when not to use Javascript? It’s because, unlike server side languages like PHP, Javascript is client side, which means the user can turn Javascript off if they prefer. So you can never know if a user on your website has Javascript turned on or not. So anything that is vital on your website cannot be done purely in Javascript. Note that I say ”purely’. It’s very popular these days to provide an all singing, all dancing solution for those with javascript on, but give those without it a very usable solution.
When you can use it.
We all want to know when we can use it – after all it can really add an extra dimension to your websites!
Form Assistance
jQuery can be used in a number of ways to assist users when filling out forms. We all know that if forms are a pain, people just will often not bother but with the assistance of javascript we can add some important features such as:
- Immediate Validation – here the data can be validated as the user types it, meaning they are immediately informed of any mistakes.
- Pop Up Assistance – a popular edition to forms, when a user clicks to type in a certain field a small box fades into view with some helpful advice.
- Ajax Submission – using AJAX the user can submit the form without having to reload the page.
Modal Windows
Modal windows are fantastic for a number of reasons. They are typically used for image galleries – we’ve all seen the popular “Lightbox” in action and it provides a nice effect. They can also be used to notify users – error messages for example, being placed in the centre of the screen and not going away until a button is clicked is a sure fire way to get the user’s attention.
- Light Box – there are a number of popular ways to do this online, both with plain old javascript and also with libraries such as jQuery and Mootools. This is a very popular effect as I mentioned – and the great thing is if the user does not have javascript turned on they don’t lose any essential features.
- Error/Warning Messages – again very easy to use and implement and great to get the user’s attention. Of course you need to make sure if javascript is turned off the message is still shown.
Content Rotators
Javascript can be used to rotate through a number of items very easily and a fall-back for those without javascript is also pretty easy to implement.
Any Others?
If you’ve got any more ideas feel free to post them in the comments and I’ll hopefully do a follow up article soon.
Great stuff Jack! The piece of javascript which I use most often for content sliders/rotators is called the jQuery Cycle Plugin – it’s simple, but extremely powerful
I use jQeury Form Validation a lot. Especially Vanadium.
Great article. Sometimes jQuery eats up so much space, that it’s not worth including it for small effects. Always good to balance the decision.