Tuesday, December 28, 2010

10:00 PM
With the past years rise of web 2.0, javascript frameworks have developed and made it easy for the average webmaster to make his site more dynamic. One of those frameworks, jQuery, has become extremely popular due to its ease of use and its incredibly light weight. Following are ten jQuery scripts to improve your site’s interface.



Thickbox
Focus on some content, image or webform, through a modal window.
When to use it? When don’t want your user to leave the page and give him more informations, show a bigger version of an image, ask him informations in a form or display a login box.


Tabulations
Create tabbed views of content.
When to use it? When you want to save screen space, but still give quick access to the hidden information. It’s often used in widgets in WordPress premium themes.



Coda slider

Create a slider like the one you can see on Coda’s website.
When to use it? Just like in Coda’s case, this slider script is great to introduce a product or a service by sections. The user gets a quick overview with intuitive navigation.

WP Coda: A great WordPress theme that allows you to easily create a Coda-like website with WordPress.


Galleria

Galleria is a javascript image gallery written in jQuery. It loads the images one by one from an unordered list and displays thumbnails when each image is loaded.
When to use it? To show a set of pictures of an event, or to display images of a product.




jTip

Tooltip solution based on jQuery, flexible and customizable.
When to use it? This script is great to give in-context information or help to user, works well in webforms to make sure that users will fill it the right way. Be careful of not overusing tooltips as they can quickly become annoying if useless.

WordPress plugin (not jQuery)



Stylesheet switcher

Allow your website visitors to switch styles with a single click.
When to use it? When you want to let your user chose a different font size, let them chose a different stylesheet for a mobile phone or printing,  let them chose a more contrasted version of the colours. Stylesheet switcher can be of real help to improve the accessibility of your site.


jQuery Accordion menu

Create a dynamic accordion menu with jQuery.
When to use it?


Slider Gallery

Create a sliding gallery with your images/products.
When to use it? When you want the benefits of a normal sidebar menu, but do not have the space to list all options. When you only have two levels to show in the main navigation.




Form Validation

Validate your forms with this jQuery plugin to avoid receiving badly filled forms.
When to use it? In almost any form, it helps your less tech-saavy users to understand what they’ve done wrong by highlighting their mistakes.



jGrowl

Insert unobtrusive messages in y
our browser, just like Growl does in Mac OSX.
When to use it? If you call your user to action but don’t want him to leave the page, this can be a good way to confirm that his action has been registered. It can be for an e-commerce site when a user adds something to his cart as well as for confirming a message having been sent.

0 comments: