Ecommerce News Hubb
Advertisement Banner
  • Home
  • E-commerce News
  • E-commerce Marketing
  • Contact
No Result
View All Result
  • Home
  • E-commerce News
  • E-commerce Marketing
  • Contact
No Result
View All Result
Wellnessnewshubb
No Result
View All Result
Home E-commerce Marketing

How to Design Emails for Dark Mode

admin by admin
December 5, 2022
in E-commerce Marketing


Dark mode is a reverse color scheme that turns light-colored elements on a screen dark and vice versa. It is available in most operating systems, applications, and social media sites.

I use dark mode for almost everything, including email and text messages. Dark mode adoption is reportedly as high as 82% on mobile devices.

Dark mode is available in most operating systems, applications, and social sites.

Dark Mode Benefits

  • Improved reading experience. The dark background reduces the blue light and screen glare.
  • Better at night. The black background lessens eye strain when reading in low-light environments.
  • Saves battery power. Dark mode can reduce energy usage by up to 63%.
  • Improves email accessibility. While the light mode is suitable for most people, dark mode helps folks with visual impairments.
  • Better for your health. Some folks who use dark mode report reduced eye strain, less dry eyes, decreased migraines or tension headaches, and improved sleep.

A drawback of dark mode is visibility in bright light conditions. While helpful in low light, dark mode can make reading texts more challenging outside on a sunny day.

Design Tips

Dark mode should be the focus of your email design and development plan.

Surprisingly, an email that does not render well in dark mode can trigger spam filters and reduce your sender’s reputation.

Here are some pointers to keep in mind when designing email for dark mode.

  • Use PNG images. JPGs have faster load times due to their smaller file size. But they may not be as clear, and they don’t support transparent backgrounds. PNGs weigh more and have slower loading times. But they are more defined and of higher quality. Plus, PNGs support transparency, which is critical for dark mode.
Screenshot comparing a JPG image to a PNG image of cherries.

Using PNG images in dark-mode email helps ensure clarity and background transparency.

  • Increase image padding. Images that are not transparent should have proper padding around the cropped area.
Image comparing two written versions of Practical Ecommerce — one that is cropped too tight and the other cropped corrently.

Ensure that images that are not transparent have enough padding to remain legible.

  • Add outlines or drop shadows. Put a white border around your darker letters to make them easier to see in dark mode.
Image of the words

Make letters pop in dark mode by adding a white border to the text. Image: Email on Acid.

  • Use off-white. Many email clients target true black (#000000) and white (#FFFFFF) to automatically invert or modify the rendering. However, off-white (#FEFFFF) could be the right choice to avoid a drastic color change. This alteration might not be noticeable to the human eye, but it’s evident to email service providers.
  • Limit the number of colors. The more colors, the more variations, and the more issues you’ll likely encounter.

Testing

There is an excellent email community on Twitter — #emailgeeks — that help make your dark-mode dreams a reality. Here are dark-mode testing resources as cited by the community:

  • Accessibility Contract Checker by WebAIM,
  • Color Inverter and Opposite Color by Invert Colors,
  • Dark Mode Simulator by Proofjump,
  • Email Client Previews and Rendering by Litmus.

Dark Mode on Mobile

Apple iOS

  • Go to Settings, then tap “Display & Brightness.”
  • Select “Dark” to turn on Dark mode.

Android

  • Open your device’s Settings app.
  • Select “Accessibility.”
  • Under “Color and motion,” turn on the Dark theme.

Dark mode isn’t going anywhere, so always design for it. Test often and accept that your designs will be susceptible to changes in email rendering. The result is a better experience for recipients and higher opens and clicks for marketers.





Source link

Previous Post

How To Sell on Amazon in 2023: Your 7 Step Guide

Next Post

Is Selling Marijuana and Alcohol Online Worth It?

Next Post

Is Selling Marijuana and Alcohol Online Worth It?

Recommended

Homes Smell Better with Pura

2 months ago

The Easiest Way to Sell Online (2022)

5 months ago

What Is It, and How Does It Work?

3 weeks ago

18 Free Courses on Social Media Marketing

3 months ago

First Steps to Sustainable Ecommerce

4 weeks ago

Q&A: Executive Recruiter on State of Ecommerce Employment

2 months ago

© 2022 Ecommerce News Hubb All rights reserved.

Use of these names, logos, and brands does not imply endorsement unless specified. By using this site, you agree to the Privacy Policy and Terms & Conditions.

Navigate Site

  • Home
  • E-commerce News
  • E-commerce Marketing
  • Contact

Newsletter Sign Up.

No Result
View All Result
  • Home
  • E-commerce News
  • E-commerce Marketing
  • Contact

© 2022 Ecommerce News Hubb All rights reserved.

Our Spring Sale Has Started

You can see how this popup was set up in our step-by-step guide: https://wppopupmaker.com/guides/auto-opening-announcement-popups/