Creating Email Templates for Dark Mode: Marketing Cloud & MCAE
Development • Email Templates
‘Dark mode’ is becoming more and more prevalent in the technology space. In 2019, Apple added Dark Mode to its iOS 13 update. Meanwhile, market leaders such as Gmail and Outlook also added dark mode features to their email clients. How relevant is this to your email campaigns? Very! So why you might go to the effort of making anemail template for dark mode?
There are a few reasons and we’ll cover them in this blog. We’ll also provide dark mode inspiration in the form of a case study from one of our clients. If you’re keen to skip ahead, use the links below.
Firstly, allow us to cover the basics, what even is dark mode?
What is dark mode for email?
Dark mode inverts the typical screen colour scheme. The background becomes dark and the text becomes light. If your email design uses a light background with dark text, it is simply reversed to the opposite.
Dark mode is a display setting that users can choose to switch on or off, as it suits them. We see dark mode as an option for Apple and Android devices, social networking apps, and email clients.
Why do users like dark mode?
There are many touted benefits to dark mode including:
Light text on a dark background has higher contrast and reduces eye strain.
It’s more comfortable for reading in low light settings.
There is evidence that dark mode saves device energy, increasing battery life.
We’ll be upfront here and share that there are also arguments against some of the benefits above. Ultimately though, according to a recent study,81.9% of smartphone users use dark mode in 2022 and this number is sure to increase as dark mode becomes even more popular in years to come! So, whether the claims of positive health impacts and readability are fully accurate or not, the rate of adoption tells us marketers need to cater to dark mode regardless.
There’s no disputing the fact that dark mode can severely impact email design.
What looks great in light mode can change almost entirely in dark mode. Not because the layout or structure of the email HTML is altered. It is because a dark background against images with a white background looks odd.
This means that marketers must be designing email templates for dark mode. It’s now a best practice of great email marketing, whether you’re using Pardot (MCAE) or Marketing Cloud.
It is not a case of creating duplicate email templates. Nor is it completely reworking your existing email design. Dark mode-friendly means improving your current templates so they render in the best possible way for recipients.
Here’s how to ensure your emails display well in dark mode:
Use png images with transparent backgrounds
Images with white backgrounds will be highly visible and look clunky in dark mode:
The optimal format is PNG images with transparent backgrounds. Your images will look slick and modern in either display setting. Be sure to consider all images in your template including logos and social icons.
Optimise image styling
You can go one step further and add styling that will only be visible with dark mode enabled. Light translucent elements will show up well in dark mode. Adding a light translucent border to your image and text will make them stand out!
Add dark mode styling to your HTML
Dark mode settings are automatically applied to your email design. Whether you have prepared or not, your email will be seen in dark mode. But, there is a difference between an email forced into dark mode and an email that facilitates dark mode.
You can facilitate dark mode in the following ways:
Customise dark mode styling for @media ‘prefers-color-scheme: dark’. Here you can add CSS to show or hide content and change font colours. You should also include dark mode-only styles within the HTML itself.
Is dark mode the same across email clients?
That would be too easy.
As always, there are different quirks between the various email clients. Some fully invert colours whilst others partially invert. Some invert media files whereas others don’t.
This means that creating a basic dark mode email template requires substantial testing across all email clients. Luckily, comprehensive Litmusemail testing is available for Pardot (MCAE) on Plus & Enterprise plans. Testing is also available onMarketing Cloud accounts Enterprise plans.
Pro tip: Prioritise the email clients the majority of your prospects use are rendering perfectly. But don’t completely overlook those that are less often used.
Pardot & Marketing Cloud dark mode email templates
For some inspiration, here’s one of the custom templates we created for our client, Connor Group, in their Pardot account.
Need a hand with email templates for dark mode?
We get it. Editing your templates for dark mode is another to-do in your long list of tasks – and it’s fairly technical too. It’s why marketers often come to us forbespoke Pardot and Marketing Cloud email templates. Our specialist team of developers has been building them for years and is well versed in dark mode optimisation.
Need a hand getting the most out of your Pardot or Marketing Cloud account?
MarCloud is a team of certified Pardot, Marketing Cloud, and Salesforce specialists. We help businesses to unlock the potential of marketing automation.
Ready to save time, deliver more quality leads, and generate more revenue? Here's how we help.
Tom is a Salesforce Certified Pardot Consultant & Marketing Cloud Consultant and has a passion for how systems work. He's written blogs and other content for Pardot.com, regularly hosts webinars with Pardot and loves being involved with the wider Pardot community. He also uses (brackets) and ,commas, where (brackets) and ,commas, should not be used. A lot.
Depending on the scope of your activity now and into the future, it’s likely you’ll need an entire team focused solely on your automation activities. This is because there are many skills required.
Tom Ryan2022-12-16T06:31:40+00:00December 16th, 2022•17 minutes
As with any premium software, Salesforce Marketing Cloud comes with a learning curve. For busy in-house marketers, it can be challenging to learn the system and run efficient, successful campaigns. This is why Salesforce Marketing Cloud partners exist.
Salesforce Marketing Cloud Email Studio is capable of much more than you probably think. At MarCloud, we have personal favourite features that take client campaigns from standard to sophisticated.
Tom Ryan2022-09-27T04:54:29+01:00September 27th, 2022•23 minutes