By Winfield Salyards, Marketing Coordinator at Heinz Marketing
I recently had the chance to oversee the execution of my first, very large email campaign for one of our clients. Through the process I learned a huge amount about best practices on email (and landing page) production and the review process and was asked to compile my findings. This is what I found.
My first suggestion is to use multiple screens whenever you can. It’s easier and allows for more accuracy and speed.
To begin working on an email, start by gathering all the required pieces: copy documents, image assets, URLs (including UTMs when necessary) and anything else related to the production.
If there is an older email that is the same or similar format, clone that email and work off that for the new email you are creating.
When you begin to compile the components, start with the copy – it will give you the best idea of the final layout and will help shape it down the line.
If you can, paste the email copy directly into the HTML framework to help keep the formatting consistent.
This is the basic format for HTML tags and end tags: <tagname>Content goes here…</tagname>
Key HTML Tags
- <h1> — this is a heading tag. In HTML headings are numbered from 1 to 6 in descending order of importance with 1 being the most important.
- <p> — this the paragraph tag. This is primarily where you place email copy.
- <a> — this is the HTML Link tag the complete tag should look like this:
- <a href=”https://www.heinzmarketing.com”>This is a link</a>
- <br /> — this is the break tag, it goes within a paragraph to add a line break and doesn’t need an end tag. It can also be used to add additional spaces in between paragraphs.
- <b> — Bold text
- <strong> — Important text (same as <b> but with added importance)
- <i> — Italic text
- <em> — Emphasized text (same as <i> but with added importance)
- <img> — this is an image tag
- <ul> — this defines an unordered/bullet point list
- <ol> — this defines an ordered/numbered list
- <li> — this defines a list item and goes within the framework of <ul> or <ol>. It looks like this:
When inserting images make sure you are defining the correct resource link within the <img> framework.
Use this link to get code for a background image that shows up in Outlook: https://backgrounds.cm/
Don’t forget to update this! The email preheader is summary text that follows the subject line when an email is viewed in the inbox. It is what many mobile, desktop, and web email clients show readers to give them an idea of what’s inside the message before they open it. If left blank, copy will automatically be pulled in and may not make sense or display correctly.
Text Only Emails
Many email systems will let you modify the text version of the email. This is what will show up for someone not using HTML when reading an email. Always remember to modify the formatting so it reads in a similar way to the HTML version. Also, remember to paste the resource links underneath where the hyperlink is in the HTML version.
When running an A/B test be sure:
- You are testing only one thing at a time, against a control.
- Your test metric is the correct one for what you are testing.
- You keep the test time and sample size consistent.
When starting to review your own email, make sure you know where your strengths and weaknesses are– i.e. your blind spots.
Read through the email for any typos or issues with easily missed formatting errors.
Check the size dimensions for images placed in the email. If you need to make changes make sure to note whether it is a background image or an embedded image. Remember Microsoft Outlook does not support CSS and therefore emails will look different in Gmail vs. Outlook vs. another client.
Make sure to send the email to yourself first so you can see how it looks and catch the first round of errors. Check all links, images, formatting, and compare your text to the provided copy to ensure the cleanest possible version is sent to your extended team for review.
Consider using an Email Review Checklist like the one below to review each part of the email:
Email Review Checklist
- Subject Line Copy – Ensure each email version has the accurate subject line associated with it and check for typos to catch any errors.
- Email Preheader Copy – Ensure each email version has the accurate preheader copy and check for typos to catch any errors.
- Email Body Copy – Double-check by cross-referencing the copy from the email copy doc with the copy in the marketing platform to catch any errors.
- CTA Buttons – Double-check by clicking all the buttons in the test emails and ensure they take you to the right page.
- Within Copy – Double-check by clicking all the hyperlinked text in the test emails and ensure they take you to the right page.
- Images – Double-check by clicking each image in the test emails and ensure they take you to the right page.
Always do a final scan of the email to make sure it’s visually appealing (spacing between paragraphs, image dimensions, colors and shades, etc.).
I learned a lot and hope these steps and tips will help you in your next campaign. What tips would you share?