Great minds think alike! I’ve been working on this blog post for the past few days but have had it top of mine for a while now. Today, a post from Litmus on Twitter caught my eye:  they published a similar blog post yesterday titled What is an Email Template?  I highly recommend the read and changed my own blog post slightly to walk you through how and why we took a Litmus template and converted it for our client, The College Program. We’re also introducing two follow-up posts. The first will take a traditional HTML campaign and convert it to a template HTML format. The second uses formatted content boxes and WYSIWYG editor for our client to update on their own.

Email templates have always existed within email service providers and outside vendors. Streamline is the word I would use to describe the trend taking place with email templates. This is happening for a couple of reasons: 1) the industry is making it easy for companies to follow best practices with mobile rendering and readability and 2) using a template saves on time and budget while ensuring brand and code consistency.

Choosing the Template:

The College Program is a small company with a tight budget. Their audience is comprised of high school student-athletes and their parents looking for assistance with finding the right college based on a their individual profile. The template I chose, Awesome, Co (see below), is HTML and came from the Litmus template catalog. This template offered quick, bite size chunks of information and was exactly what The College Program needed based on what we’ve learned about their audience through previous Litmus Advanced Analytic tests.

Awesome, Co.

Converting the Template:

I started with the style guide for The College Program, mainly for colors and font. The Director, Tim Twellman, provided me with a variety of facts and snippets of information to include as content. Using a subscription to FlatIcon, I selected relative icons that fit the message and changed the color of the icon to match the branding of The College Program and colors within the email. The header image remained from their previous email template and is sized to optimize mobile rendering, but the background is a solid color to render properly for desktop.  Note: basic HTML knowledge was required to edit this particular template.

Testing is Vital!

Because this template came from Litmus, one might think that it’s already been tested. Change is ongoing within this industry and you still need to test to make sure the campaign looks the best it can on all devices. Plus, changes were made to the code. Using Litmus Builder (as shown below), I am able to edit the existing HTML, images and conduct a rendering test within the same window.

Litmus_Screen

The Results:

With this new template, the client has seen an increase in mobile viewing (above 65%) and an increase in Skimming (engaging between 2 – 8 seconds). Reading stayed the same (engaging 8+ seconds) at 27%. This makes sense based on the email content.

In regards to saving time and consistency, we were able to save 3 hours per campaign. Yes 3 hours! Part of that was in drafting content and placement within the email campaign but the other was sourcing images because we are working with more specific parameters.

You might have noticed I mentioned Litmus quite a bit, not because we’re promoting them but because they’re a partner in every step of our email: email strategy, design and development – whether bespoke or template. Currently most of the email marketing program for The College Program is managed by us, but if that was to change, with a little bit of HTML knowledge, their team would be able to update this template on their own.