Planning your email newsletter takes time and planning. You want to provide relevant, useful content to your subscribers in a well-designed email message.
A message that encourages your subscribers to open it, read it, and take action.
So how do you get started?
Last week, I found Campaign Monitor’s The Really Good Email Design Checklist infographic and thought it did an excellent job explaining how to design an email that focuses on your audience.
The infographic provides helpful email design tips for:
I was glad to see the tips for sketching your layout, following brand guidelines, and adding alternate text for images.
Check out the infographic for more details, or if you prefer, read the text version of the infographic.
Email Newsletter Checklist
Before diving into design, use these tactics to create open-inducing emails.
- Subject Line
- Is it personal and engaging?
- Add an emoji, if appropriate
- Spell check your subject line
- Optimize length for preview pane and email clients
- Preheader Text
- Keep it short
- Add context to your subject line
- Choose to display in the body of the email or just the preview pane
- Use data you have to personalize different areas of your email: Subject line, preheader, body copy, images, etc.
- Dynamic Content
- Change sections of your email to make it more relevant for segments of your subscribers
Before you get going, it’s a good best practice to sketch out the layout of your email.
- Email layout
- Briefly sketch a mockup of your email
- Use a one-column layout
- Use space to create chunks of content
- Use the inverted pyramid model to guide reader to a call to action
- Create hierarchy by checking weight and size of the most important elements
- Email width
- Adhere to email max widths of 600-640 pixels (recommended)
- User experience (UX)
- Place content based on engagement
- Ensure your purpose is defined
- Navigate users to the email goal
You are headed into the home stretch! Now let’s play with shapes and colors.
- Find imagery relevant to contents
- Choose images that contrast text
- Use a balance of text and imagery
- Optimize file sizes for quick load times
- Use SVG for icons and logos, if possible
- Use alt text to add context to images
- Keep images crisp by using image attributes
- Use a static image with a play button
- Use an animated GIF
- Use HTMl5 to embed a video
- Alternate option for video
- Only animate what you need to keep file sizes under control
- Keep file size under 1MB or smaller if possible
- Follow brand guidelines
- Always spell check and look for typos prior to sending
- Consider how your message will be perceived to avoid issues
- White Space
- Add ample whitespace around elements to encourage click-throughs
- Give CTA text padding: standard 20px
The finish line is in sight! Time to put on the final touches.
- Web fonts and fallbacks
- Use web fonts whenever possible
- Set web-safe fallbacks for unsupportive email clients
- Mobile Optimization
- Use a mobile-friendly template
- Use a clear and easy Calls to Action (CTA) button
- Make sure your images aren’t too small or hard to see
- Increase the size of body copy if it’s small on desktop emails (16px is a good size for mobile)
- Calls to Action (CTA)
- Copy: be specific and benefit focused
- Size: keep buttons big enough for easy clickability on mobile
- Design: choose an accent color to stand out, use padding, and size mobile friendly
- Placement: pay attention to the placement to encourage click-throughs
- Language: the button is there for viewers to take action, so an active verb is typically used to help them take that action
- Add UTM tracking as needed
- Check every link to ensure it goes where it should (desktop and mobile)
- Style hyperlink tag with active, hover, link, and visited states
- Keep an eye on dates, email addresses, and telephone numbers that might get turned into links
- Link to social networks as appropriate
- Include any required legal verbiage
- Include support links as appropriate
- Include referral or F2F links as needed
- Include an unsubscribe link
- Include the physical mailing address of the business
- Include a reminder of why they are getting the email (Because you subscribe to XYZ blog)
Any tips you would add? Share them in the comments.