Emails and Template Generation

We are always sending a lot of emails. It's just part of marketing job I have where I work. The person in charge of creating the emails will be leaving soon so I will have to work directly with the copywriter and social media persons. I built most of the email templates that we are using now but to limit the amount of time I would need to be involved with each email I have decided to build a template generator!

To start out, html email creation is a beast! For the most part, we have to code like it's still the 90s. You can just check out a few of these articles to see what it's like:

Creating a Simple Responsive HTML Email

About HTML Email

How to Code HTML Email Newsletters

Mobile devices are closer to HTML5 use than any of the desktop clients but we can't rely on just one segment of the market. If you can pull stats and find that all your users are opening emails on a specific device then you can afford to only build emails for that device. Otherwise, you have to build emails like the rest of us hope for the best!

For starters, don't bother with margins or padding as some of the larger mail clients ignore those. Also, don't rely on styles in the header. This is the 1990s so we need to declare each style inline! Some clients may not even recognize a closed break or horizontal line tag.

To overcome the diversity in email rendering, and to also avoid tables to keep my sanity, I found that I can rely on borders. Not everything I want displays correctly on every device but for the most part I haven't had much trouble using borders for things they aren't supposed to be like padding and margins.

On to the email generator!

We have very few email layouts we are currently using. Our standard headers are full-width banner or logo with links centered in the header. In the body we usually have a mix of centered paragraphs with headers, images floating with text on the right and some buttons, and also some centered buttons and links. I setup a simple page where my copywriter can begin from the top selecting how he wants the template built. Once all of the selections are, the template will put all of the code together and it is ready to be copied into our email system.

I've placed plenty of comments marking which areas are off-limits and which areas need image and text replacements so it should be simple to use. Thankfully our copywriter works extensively with web copy so he is used to seeing code and working around it (though we do have plans to train him more in HTML and CSS).

Maybe someday I will put this template builder out for others to use but maybe we can hope that the email world will catch up before 2020. Until then, we can all marvel at Litmus and how they could achieve background video in an email.