The Dark Side of Web Design
The majority of sites on the ’Net have light-colored backgrounds, as it can improve readability for the end-user and helps designers differentiate on-page content with the use of contrasting colors. This is a perfectly good strategy – if you like to play it safe.
If you'd rather push the envelope, it might be time to consider taking a walk on the dark side of Web design. By spicing things up with a darker design, you can set your digital property apart from the competition. A dark background can prove to be more memorable with your audience and can even be leveraged to showcase your products better when executed correctly. On the other hand, a poorly designed dark site could do just the opposite, appearing too busy and even end up pushing away your audience.
So before taking a walk on the dark side, make sure to take into consideration the unique design challenges that a darker background brings. Start by taking a look at a few companies who have implemented a dark design without impacting the usability or performance of their digital property:
This beauty company stays true to its brand’s colors of black and white by featuring a black background paired with white font for excellent readability. And although some e-commerce stores feature a dark background on their landing pages, not many actually carry the darkness throughout their entire sites like Smashbox does. Even the company’s product listing pages feature a black background with products highlighted in clean white boxes.
2. Taco Bell
The company that asks its customers to think outside the bun thinks outside the box when it comes to site design. By using a dark background on its landing page, Taco Bell ensures that visitors are drawn directly to its featured attention-grabbing images.
3. Whole Foods
Whole Food’s site may be lighter than the two previous examples, but it still pushes the rules of Web design by using an image-rich background. In fact, this theme is carried throughout the entire site. Because of this, the company highlights all content in a light-colored box so that it does not have to compete with the background for attention.
The Renaissance Hotel website takes a unique design approach, especially for the hospitality industry. Not only is the site’s background dark, but also full of images that enable visitors to discover unique things about the company’s properties. Instead of focusing on the bookings like typical hotel sites, Renaissance makes its site more of a discovery platform for the end-user.
This Norwegian e-commerce site not only does a great job at highlighting its products against a dark background, but it also excels at keeping its dark design simple. The important product information is easy to find and read, and the product prices are even highlighted in yellow, which makes them extremely visible to visitors.