Why Lightbox is Still an Important Design Element

Paul Schetelich

Lead Designer

One of the most important parts of website usability is how content is organized on a screen. When content is presented in a way that is enjoyable and user-friendly, you see improved rankings and traffic. This happens because people want to be on your website and find it helpful and useful. If the content is not organized appropriately, you will have the opposite effect.

A common way to present large content items is with modal windows. Modal windows work well for signup forms, search windows and large images. The benefit to them is that users don’t have to leave the current page they’re on to complete the action. Typically, modal windows require the user to do something before they can continue on with their browsing.

Lightbox is a Type of Modal Window

There are different types of modal windows, but lightbox is the most obvious and popular of the bunch. Lightbox is typically used to highlight videos and images in a larger size in the same tab. “Are you sure you want to leave the page?” is an example of a lightbox.

What makes a lightbox unique is that it fades out the rest of the screen so that the user is not distracted by anything in the background. The only thing to look at is the window, so the user has to make a decision right then and there. Perhaps its greatest asset is also its biggest downfall.

Why Lightboxes aren’t a Perfect Solution

Some web design experts suggest that lightboxes are no longer necessary because they are distracting for users. When a user is browsing a webpage, it’s highly frustrating to be shown a pop-up. Even if the user is not annoyed, they must still experience an interruption.

While this may be true to an extent, lightbox design remains a useful design element. In fact, we see it being used all the time on sites like Facebook and Twitter to display content. Perhaps the more important question is when lightboxes should and should not be used.

To better understand how to make the most of lightbox design, let’s review when you should and should not use the design element.

When to Say “Yes” to Lightboxes

A lightbox can be an excellent tool, but you need to know when to use it. Below are instances where you will benefit from showing your users a lightbox.

  • When you have large content. If you want to show content that is larger than the area allotted in your layout, you can use a lightbox. The best items to use in these instances are forms, videos and tables.

  • When you don’t want the user to load another page. It’s not always necessary to bring the user to another page, particularly if you think it may disrupt their journey. Lightboxes can deliver information in an appealing manner and keep the user engaged.

  • When the content is highly important. A lightbox forces the user to focus their attention on the content and nothing else. If you want to share something important and need the user’s full attention (i.e., a license agreement or login form), then a lightbox can be an effective way to share the info.

When to Say “No” to Lightboxes

Lightboxes are awesome when they are used in the right manner, but they can interfere with the user experience if they are used at the wrong time. Below are instances where you will want to choose another solution, such as a non-modal pop-up, an in-page solution or another page altogether.

  • When a user is already doing something else. There’s nothing more frustrating than being interrupted when you’re in the middle of doing something important. If you do interrupt a user, it will probably leave a bad impression on them. Instead, lightboxes should only be used as a direct result of the user doing something such as clicking a button.

  • When it’s important to see the background. Sometimes, users need to see what’s in the background to make a decision. If you can’t blur the content in the background, a lightbox isn’t the right option.

  • When you have a lot of information. If you’re trying to cram a bunch of information into a lightbox, it probably isn’t going to work. The purpose of a lightbox is to get users to focus on a particular task, so the information presented should be short and direct.

Wrapping it Up

Hopefully you have a better idea of when to use and not use lightbox design. It’s understandable that web designers have their reservations about lightboxes because they can create a disjointed user experience, and this can have a negative effect on the user experience as a whole. When used appropriately, however, lightboxes are a valuable design element that can keep users engaged and prevent them from unnecessarily leaving the page they're on. The key is knowing when to use them and when to use another solution.

 

About the Author: Paul Schetelich

Since the days of sidewalk chalk and finger paints, Paul has been creatively crafting the art of design. With a B.A. in Graphic Design from Monmouth University and a Masters from the Califano School of Art - Paul quickly moved up the ranks at SEMGeeks from Junior Designer to the Lead Designer. With 4+ years of experience in web design Paul is ready to conquer the digital atmosphere.

Talk With Our Team to learn more about this...

Comments?

We Love to Educate

Get our stellar design & marketing
tips sent right to your inbox.