5 Responsive Email Design Best Practices to Start Off Your Day
Those who are running email campaigns understand the importance of sending out a well-composed email. Every element of the email message from headline to the content to the design must be optimized in order to increase the chances of recipients to perform the desired action.
One of the biggest developments in email marketing over the last years is responsive email design. This refers to how the sent message of an email campaign interacts with the screen resolution of devices in which the email is viewed.
Given that people can access their email inboxes using desktop, smartphones,and tablets – all of which have different screen resolutions of their own – email marketers need their messages to adapt and survive the screen size of the device. In fact, over half of emails are read using a mobile device and that figure will probably still increase in the coming years.
While most email marketing platform accommodate responsive email design into their campaigns, it doesn’t necessarily mean that the email will be optimized and observe the best practices of responsive design. A study by GetResponse on responsive email design showed that 42% of subscribers intend to delete emails that don’t display correctly on their smartphones.
For those who are getting their feet wet with email marketing, whether it’s to increase subscribers or get your list to purchase something from you, here are tips on how you can improve the responsive design of your emails.
Mobile first: Start with the small screen in mind
Normally, email marketers drop elements into their email campaigns and templates when designing it for desktop viewing. Doing it this way, you may find yourself adding more than enough elements onto your emails that the email becomes cluttered, tiny or bulky when viewed on mobile due smaller screen sizes.
If using responsive design to switch rows to columns for instance 4 elements per row to 2 per row, the email becomes twice as long. You will find yourself designing your email vertically for smartphones as opposed to broader desktop viewing. Therefore, if you want to further maximize your campaign performance and optimize your email for engagement, you should design your email for mobile (first).
It is advisable to use experienced developers to ensure the complete responsiveness of designs. For example, working with a reputable design agency with access to skilled and experienced Ukrainian developers is an affordable and effective solution for ensuring a responsive design that is user-friendly.
When designing your email for mobile, you need to keep things simple. Don’t add elements on your email for the sake of filling up the empty space. In fact, less elements in your email message, increases chance your list will be able to see the most important call to action of your email and act upon it.
Make text readable and pimp your font size
The message of your email is of utmost importance, which is why you should make sure that your recipients will be able to read it. Choosing the font for the email should be simple enough – the clean look of sans-serif (or the font that is in line with your branding) with 18px size will get it done. Bumping the font-size for mobile is a good way to keep your emails readable. The font color must also be in contrast with the email background for increased readability.
Copywriting techniques that make mobile sense
Emails that rely on images such as e-commerce sites or fashion will need strong and punchy copywriting to draw the attention of people to the most important offers of your message. Since there are still email services that automatically disable the loading of images from the emails these should be in real text, not images only. If you go for a fluid design this also allows wrapping of the text.
Placing the best offer or at least the gist of it above the fold (the visible part of the screen after the mail fully loads), possibly in text form should give your recipients a good idea on what the email contains. Check your headline, right! Even if you primarily use text on your emails, you still need to apply other copywriting techniques that will persuade people into clicking through to your offer .
Create compelling calls to action
Design a eye-catching button that links to a desired landing page on your site to lead recipients down your conversion funnel. Superhero call to actions stand out. I believe in improving by testing, but at least start of with a contrasting button color with plenty of whitespace to avoid cluster bomb link clicks (due to fat fingers). Make use of empty whitespace to maximize the chances of it getting clicked on.
Test your design
Since an email program is normally continuous, you should track how your (responsive) email design performs. For campaigns to produce higher conversions and activity, it might be worth it to change your mobile design around or take any of over a 150 A/B email split testing ideas. Just making it mobile isn’t enough. Refer to the data provided by the email marketing platform and see how many of the recipients clicked on the links – and converted, but this time split by device as well.
- 5 Responsive Email Design Best Practices to Start Off Your Day - January 14, 2015
- Selling Your Sign-up Isn’t Enough - May 11, 2011
1 Comment
by bodecco
Thanks a lot for it! I had no idea that that 42% of subscribers intend to delete emails that don’t display correctly on their smartphones! I’m using GetResponse and I wanna do everything to create better and responsive emails!
A study by GetResponse on responsive email design showed