When to use jQuery on your site (jQuery Mini-series Part 1 of 3)

Use jQuery to Enhance Site UI, Display, or Interaction

jQuery is an excellent tool for improving your site’s interface. It’s also helpful to target and change specific CSS and HTML elements quickly. [1]

I tend to use it mostly for UI (user interface) enhancements or when there is a semi-dynamic event in the display, after the page has loaded.

Examples uses include:

  • User feedback in messages
  • Tool tips (in-context user guidance)
  • Enhanced image/gallery display
  • Tabs for quick access to hidden information
  • As a style sheet switcher (helpful with accessibility)
  • Form enhancements and client-side feedback
  • Menu enhancements
  • Data entry such as a date picker
  • Table and data sorting
  • Media players
  • Content flagging
  • Tagging (better input methods)
  • Loading additional content without a page refresh
  • Dynamic Charts
  • Content Carousels (albums, photos, headline news stories)


Do Not Use jQuery as the Primary Driver for Site UI, Display, or Interaction

jQuery should not be used as the primary driver of your site’s display and not as a cornerstone of any primary functionality for your site.

In other words, sure, enhance your web sites e-commerce process with jQuery, but have it:

  1. degrade gracefully,
  2. making sure people may still go through the e-commerce process,
  3. even if jQuery fails completely.

Simple uses can have big impact

When consider the rendering of display effects such as rounded corners and color gradients, consider CSS instead.

Know your jQuery Patterns

The following URL provides an excellent set of “patterns” for using jQuery to improve your site’s interface:


[1] Page 377. Pro Drupal Development, Second Edition by John K. VanDyk

Share or Comment via Twitter