Text 14 Nov 2 notes Lightboxes (You’re Doing It Wrong)

Do you remember your first lightbox experience? Me neither, and yet, they’re on just about every website you visit these days. Not this one though; and I’d like to explain why that is and why this design pattern probably doesn’t belong on your website either.

Lightboxes as we have come to know them have been popularized on the web since 2004 and in that time over 50 varieties and plug-ins have come to be. Predecessors of the lightbox, modal windows have been with us for much longer in many of the applications we use on a daily basis. Before going any further, I’d like to make an extremely important distinction between these two terms. Modal windows serve to focus the user’s attention on content which has a clear relation to a given interaction. Within the context of the web, the two most common—and correct—uses include login windows (when clicking a link that leads to restricted content) and alerts (such as inactivity notifications on banking sites). Lightboxes, on the other hand, seek to augment existing content, often by enlarging images or playing back videos. While both seek to focus a user’s attention to a single piece of content, a lightbox doesn’t really tell the user anything they didn’t already know. Worse still, lightboxes abruptly exit the user from their current browsing mindset.

The most common platform for the lightbox is the portfolio site. This is an obvious and ultimately boring way to display your content! In the end, this shows an insecurity on your part to proudly show off your work at its best and a gross disrespect for your audience now that you’ve begun to force additional clicks upon them. Since the invention of the scroll wheel 15 years ago, scrolling has been, is, and will continue to be an easier mode of interaction than clicking.

And so I issue this plea to today’s web design community: before you download the latest and trendiest jQuery plug-in, first consider the content design, usability and overall architecture of your site!

  1. experimentsbykevin posted this

Design crafted by Prashanth Kamalakanthan. Powered by Tumblr.