Kelly Groover June 7, 2021 You’ve decided to create a company newsletter. Awesome!
Now what?
If you’re wondering what’s next, don’t worry. We’ve curated a list of tips from our design team to help you raft a winning email newsletter. We’ll cover everything from CTA tricks to ADA compliance.
Let’s jump in.
The Basics
When it comes to any email design – one-off, lead nurtures, or a newsletter – there are certain universal best practices to incorporate, like:
- It should be responsive. Your template will display differently across various email clients and devices. Designing with this in mind ensures the content is visible for all users.
- It needs to target your end-user or persona. This is pretty standard for everything you do within the realm of inbound marketing. No one will want to read a newsletter about motorcycle repair if they don’t like them.
- It should be easy to navigate with a clear visual hierarchy. If your email has too much going on, it may open slow. It also may be confusing for the reader to determine the sequential order or importance of content.
- It must have clear calls to action. Email marketing is a prime opportunity to convert users. That is if you include a CTA that is easy on the eyes and to the point!
- It 100% should be ADA compliant. It’s 2021. Web content that’s not accessible to all shouldn’t even be considered anymore!
So, How Do You Achieve Email Newsletter Best Practices?
With specific guidance, of course! There are certain categories to consider to create a responsive, targeted, clear, and compliant newsletter. We’ll dive into each.
Dimensions: Remember how we said your email newsletter should be visible for users across different devices and email providers? With the following sizes, it will be:
- Artboard: 720-740px wide
- Content Background: 600px wide max
- Text: 540-560px wide
Typography: Typography refers to the font in your newsletter. Web fonts are only supported about 50% of the time and mostly just in mobile. It is recommended to use a web-safe font to ensure consistency across all email clients. Fonts like Arial, Times New Roman, Verdana, Georgia, and Tahoma are all considered web-safe. Because font styles vary widely, there is no steadfast rule on font sizes. There are some general guidelines, though:
- Headline Copy: 24px+
- Body Copy: 15-18px
- CTA Copy: 15-18px
- Disclaimer Copy: 12px
Please note: Web fonts aren’t supported at all if you’re using a drag and drop template.
Images: We all know graphics can make an email pop. Be careful, though, especially when placing text over images. Some email clients will outright block your graphics. If that happens, it’s wise to have specific alt text in case images don’t display correctly. Additionally, don’t go too big or overly ornate with images as it can slow down how quickly someone can open your email.
CTAs: Emails can have two kinds of CTAs: links and buttons. When styling hyperlinks within blocks of body text, underlining the specific keyword or phrase is always preferable (also ADA compliant). It’s clear, easily understood, and accessible. If you go the route of a button, ensure it has a defined shape or border, a different color from their surroundings, and have readable text. Be sure also to include contrast between the text and the background. And, pro tip: Rounded edges on button CTAs get better conversions!
ADA Compliance: ADA Compliance refers to the accessibility of your email to readers of all kinds. You want to ensure every subscriber can read and understand your content and design, regardless of whether they have a disability. Doing so involves three crucial elements: contrast ratio, underlining links (mentioned above), and alt text:
- The contrast ratio between text and the text’s background should be at least 4.5 to 1. If your font is at least 24 px or 19 px bold, the minimum drops to 3 to 1 (though, worth noting that this is a little fuzzy because numbered sizes aren’t always reflective of the visual size type). Again, be especially careful of text over images.
- Alt text describes what’s happening in an image. Always use alt text for any images, including non-important decorative images, as it lets the visually impaired get the whole idea of the email. You should also use alt text throughout your website and social media platforms!
What Modules Should You Include in an Email Newsletter?
Now that you have some tips in mind, what should you apply them to? Email newsletters should strive to have a variety of components, but most importantly:
- Your logo, either in the header or footer, or both
- The date
- “View in browser link”
- Address and contact information
- Social icons
- Unsubscribe link
- Copyright information
- The content of your email with anchor links and CTAS
- Icons and imagery (if it’s relevant to the look and feel of your newsletter)
If you don’t know what style of newsletter to create or what to put it in, many of our clients have had success with these design modules:
- Full-width text
- Email signature and headshot
- 50/50 text/image split
- Two-column text/image
- Quote
- Icons with text
- Event listing
- Question/Answer
What Are Some Helpful Tools When Designing Your Email Newsletter?
For starters, this blog! But even we need some resources to check our work regarding contrast ratio, fonts, and more. Try using:
- Contrast Checker
- Contrast Ratio
- A11y accessibility check for text color on background image
- Google Fonts
- Adobe Typekit
- MyFonts
- FontSpring
Digital & Social Articles on Business 2 Community
(69)
