Web Design Magazine | News, Tips, Blogs, Articles & Insights

Lightbox Best Practices for Web Design Teams

Written by Peter Devereaux | Oct 3, 2015 5:00:00 AM

Lightboxes are an excellent way for designers to showcase their visual content.

 

They are a perfect solution for websites that want or need to profile a gallery of images, offer their users a slideshow, or simply present content in a new and unique way. There are, of course, some important guidelines and best practices for Web design teams considering their use. Here are three to consider during your next implementation:

 

+ Responsive: Mobile users are going to visit your website, so if enabling them to view the content within your lightbox is important (and we're assuming it will be) make sure that your lightbox is responsive. Fortunately, there are numerous offerings available which satisfy this important criteria.

 

+ The Visible Close: One of the worst digital offenses a Web designer can make is making it difficult or impossible for a user to close out the lightbox experience. Include a very visible "close" command that will allow users to return to the parent/underlying page.

 

+ Distinct Design: Lightboxes should also be visually distinct from the background page. This can be done my making it smaller (or even filling the entire page), even using translucent shading for the inactive area can work as it obscures the background somewhat.