JQUERY

J…What?

JQuery is something that I encounter everyday when I surf the web, but know very little about. As an aspiring web designer, I need to educate myself about the techniques used to create websites. JQuery is a form Javascript technique used to create interesting and interactive websites.

The Pros

Jquery is a simpler, faster way to write javascript. The file size is small, it supports css one to three selectors and works crossbrowser with Firefox, Internet Explorer, Safari, Opera, and Chrome. The best part is that jquery has plug ins that add cool effects to your websites.

The Cons

Although adding some JQuery to your site sounds awesome, there are some things to take into account when designing. Even though jquery is crossbroswer there are some known problems with some older browsers that some people still use. Such as Mozilla Firefox 1.0x, Internet Explorer 1.0-5.x, Safari 1.0-2.0, Opera 1.0-9.x and Konqueror. For people who use Internet Explorer, which a lot of people still do, when a website uses jquery, it converts relative urls into absolute links and in 5.5 the use of simple classes fail.

Plug Ins

Jquery plug ins are pre-scripted code that can be customized or used as is to enhance a website.

Autotab is a jQuery plugin that provides auto-tabbing and filtering on text fields in a form. Once the maximum number of characters has been reached within a defined text fields, the focus is automatically set to the defined target of the element.

Auto tab is a great tool to use in a site that requires forms, since a lot of paperwork is now being done paperless and online, more people also order products online and sign up for services. All of these things require forms. Having an auto tab feature benefits the user when filling out information by making it quicker when it tabs down, and provides reassurance knowing they typed the correct amount of numbers for a SSN, address or telephone number.

Galleriffic is a jQuery plugin for rendering fast-performing photo galleries.

This plug in a site could be helpful to a user who may be searching for a photo or product and is looking at many images at once and wants to quickly view a larger version of this image. This plug in allows the user to view a larger version of the photo without having to open a new window or cover up the other thumbnail photos.

Featured Content Slider Using jQuery UI

This plug in is a technique to show off featured items, articles or information in a site. It’s a good way to save space on a site while still being user friendly. Because of the layout the user can easily identify that it is a featured section of a site and is user friendly by working as another form of navigation through the site.

Sausage is a jQuery UI widget for contextual pagination. It complements long or infinite-scrolling pages by keeping the user informed of her location within the document.

This can benefit users who are reading long pieces of information or articles. This Plug in basically shows a scroll meter next to the scroll bar showing the reader when they will get to new sections of information. This is user friendly because it lets the reader know where they are on the page. It also breaks up the information into sections to make it seem like less information.

Arbor is a graph visualization library built with web workers and jQuery. Rather than trying to be an all-encompassing framework, arbor provides an efficient, force-directed layout algorithm plus abstractions for graph organization and screen refresh handling.

I personally like this plug in because it reminds me of the visual thesaurus which I constantly use because it is fun, interactive and serves the purpose I need it to. Although I can’t exactly think of another use for this plug in other than the visual thesaurus I am referencing. It can be a fun interactive tool that serves it purpose it the right conditions.

Website

Of the five jquery plug ins, the one I think is the most useful is the featured content slider. A site that utilizes this technique is NBC. NBC has a lot of information to show on their site because they are a news station and are a network for a lot of hit tv shows. Although the NBC site isn’t exactly the most exciting site with crazy Jquery techniques they do use one that is very beneficial to them to maximize the space on their site and show their featured content within every page. I think they do a good job with organizing their information and displaying the types of information that visitors to their site would be searching for. Such as featuring their hit shows in a content slider above the fold.

nbc features
the biggest loser page on nbc

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: