The Good, the Bad, & the Ugly
Why email design matters.
Agenda
• Things to Consider • 4 Email Design Commandments • HTML Email Design and Deliverability • Best Practices and Examples • How to Work Within Your Resources
A few things to think about…
• Would you read your email?
If you don’t enjoy reading through it, your email list won’t either.
• Are you proud of both content and the appearance?
Both factors are equally important in your campaigns success
• Does the email represent your brand well?
Do you take the same care with your email as you do other marketing efforts.
• Objective has a direct impact on how your email
should designed and laid out.
Newsletters are going to have different design strategies than eCommerce or Brand Campaigns. You can guide them towards your primary goal through design and layout.
4 Email Design Commandments
• Images are crucial
The biggest reason to use HTML emails is the ability to display images. Images help to convey brand messaging better than words and can excite and entice the reader and to engage with your company. Put thought into them.
• Make it Readable
Make the information "readable" and easy to digest, eye catching and worth their while. Emails are always better when they have a “conversational” tone.
• Formatting, Formatting, Formatting.
Put care into text formatting. There’s a reason you don’t see the text in an email center-aligned. Keep things consistent. Be tasteful.
• Place your Call-to-Action at the Top
There is probably a reason you sent this email, make that the first thing people see when they glance at it.
Email Design and Deliverability
• Every email client is different.
Developing HTML Web sites to be cross-browser functional requires knowing the limitations and nuances 3-4 dominant Web browsers, but when developing for email clients, that number is much greater. For Example: • Outlook • Gmail • Yahoo! • AOL • Hotmail • OSX Mail • Thunderbird • Eudora • Lotus Notes • the list keeps going, and the challenges keep growing.
• Let’s look at 2 examples - Gmail and Hotmail
Gmail - Design and Deliverability
• Doesn't display ANY images by default.
It needs to be activated by the reader to "include external images“ Very important if you are sending one large link embedded image
• Ignores all styles in tags.
It doesn't matter if they are in the or in the
• Ignores BODY background images.
When displaying external images, it does render traditional background images correctly, for example:
, as well as height and width.
• Adwords alert
Be careful as to the extent of the words you use as your competitors can serve Adwords alongside your email based on the keyword index.
Gmail Example
Hotmail - Design and Deliverability
• Ignores everything in the tags
This includes but will render |