Review of jQuery for Designers Beginner’s Guide book by Natalie MacLees

6 August 2012

jQuery has become – rightly or wrongly – the defacto JavaScript library for web designers and developers these days, so I jumped at a chance to review the jQuery for Designers Beginner’s Guide book by Natalie MacLees.

jQuery for Beginners book by Natalie MacLees

The book is aimed at web designers with little knowledge of JavaScript; you won’t learn to write your own jQuery plug-in from the book, but the following topics are covered (taken from Packt’s page about the jQuery for Designers book):

  1. Designer, Meet jQuery
  2. Enhancing Links
  3. Making a Better FAQ Page
  4. Building Custom Scrollbars
  5. Creating Custom Tooltips
  6. Building an Interactive Navigation Menu
  7. Navigating Asynchronously
  8. Showing Content in Lightboxes
  9. Creating Slideshows
  10. Featuring Content in Carousels and Sliders
  11. Creating an Interactive Data Grid
  12. Improving Forms

The good

jQuery for Designers Beginner’s Guide is in Packt’s ‘cookbook’ format, with each ‘recipe’ being fairly self-contained. For designers who aren’t familiar with JavaScript, never mind jQuery, the book provides an excellent, gentle introduction to what JavaScript is, how it interacts with CSS and HTML, and what you can do with it.

There are some more involved recipes towards the end of the book including building asynchronous navigation alongside the usual suspects for any jQuery book (i.e., slideshows and carousels). Recipes are well explained throughout, with plenty of screenshots to help orientate the reader as to how much progress they should have made since the last step, and any common pitfalls seem to be mentioned with a remedy.

The not-so-good

There are a few recipes that replicate things you could achieve with good old CSS these days. For example, one recipe (Adding Icons To Links in chapter 2), guides the reader through using jQuery to add a class to links to certain file types. So, if a link in the page was to a PDF, this jQuery snippet adds a class of pdf to the link. In theory, fine, but in practice, you can do that with CSS (related guide on

a[href$='.pdf'] {
background-image: url("images/icon_pdf.png")

That’s fine as a case study to demonstrate the relevant principles in jQuery, but could be misleading to less experienced web designers; a note to point out that it could also be achieved through CSS would have been a nice touch!

jQuery for Designers Beginner’s Guide:  overall

As a guide to jQuery for designers, jQuery for Designers Beginner’s Guide is a great introduction, with plenty of recipes for common tasks a web designer might need jQuery to do to enhance a website.

Other reviews of the jQuery Beginner’s Guide


I was gifted jQuery for Designers Beginner’s Guide book in exchange for the review.