10 Tips for HTML Email Lists, Templates, and Campaigns

Developing a good-looking email campaign should be easy, right? You’d be amazed at how backwards the process is. This post assumes you have the technical and creative chops to hosting the email service yourself, rather than choosing a paid service like constant contact or mailchimp. Where’s the fun in that?!

From choosing the right host to archaic css support, here are some tips to help you remedy the malaise of maligned markup and hosting services:

  1. Start with a plan. You need to know five things:
    1. how many people you plan on reaching
    2. how frequently you will be emailing them
    3. what features you would like (html vs plaintext, images, etc.)
    4. the duration of your campaign
    5. your budget
  2. Find email list software that does everything you need it to do and is easy to use. Generally, they have demo sites where you can test out their features. Some even integrate with popular CMSes, like Drupal, WordPress, and Joomla. Try several of them out until you find something that you like and that is either offered by your host, or that can easily be installed. Choosing software with good documentation and a large, nerdy user base is typically a good bet.
  3. If you are planning on sending a lot of emails, find a host that allows it. Hosts typically set a throttling rate to govern the number of emails that can be sent per hour and per day. Defaults on these figures are usually low, but can often be raised after contacting customer support. Do some research beforehand and you’ll be okay.
  4. Make sure the email list software you are using – as well as your host – aren’t blacklisted by major mail servers like gmail, yahoo, etc. Similarly, make sure your host’s filtering/spam settings are either disabled or allow for large quantities of outgoing mail with your keywords.
  5. Keep the design simple. Most mail clients and online email service providers allow for minimal use of css and html. They vary drastically in their support (you can find more info here: http://www.email-standards.org/ ), but here are some quick pointers:
    1. Use tables for optimum control over content alignment. Some email clients don’t render floating elements properly and certainly don’t degrade elegantly. You can avoid tabular layouts altogether if you keep your design simple with a single column of text.
    2. Avoid the default line length; in other words, your text shouldn’t  run as wide as the window. There are two reasons for this:
      1. It is harder to read
      2. It won’t grab the reader’s attention to begin with – it looks like most junk they get in their inboxes. Even if they do start reading it, make it easier by limiting the width of a text block to 35-55 characters, either by setting a css width on your containing element, or by using deprecated methods like setting the width attribute in a table.
    3. Use inline css on each element that you want to configure
    4. Counter-intuitively, don’t depend on the “cascade” in body css – in other words, if you want all of your text to be styled with font-family: verdana, you might need to place that on each element
    5. Related to the previous point, avoid using css in the body element; some mail engines strip all html that is outside of body, including body.
    6. Avoid images as CSS backgrounds – instead, use image elements and get creative; a well designed image can create a fake page-corners, fades, and other common html graphics techniques. (a great example is the Organizing for America Campaign)
  6. Design for your audience. If you don’t know who that is, do some research. There’s nothing wrong with designing as broadly as possible – but with clear guides. If you know people who have difficulty reading small text will be receiving your email, ensure the text is large enough and with sufficient contrast. Don’t make it gaudily large, around 12-16px in many common webfonts generally does the trick. Images can’t be read by screen readers without alt attributes, so always include them. Title attributes are helpful as well, for mouseovers.
  7. Make sure the email has a clear goal and that it is easy to achieve; use image and text links to guide the reader to an actionable task. Generally, these links should point to a landing page on your site from which you can collect referral information.
  8. Make sure your content is engaging. From the images to the copy, everything should be designed to appeal to the reader’s senses and sensibilities. Knowing your audience is crucial for this step, so do some research if you haven’t already.
  9. Test, test, test. If you don’t have accounts on the major email services, sign up for them. I would advise keeping track of these usernames/passwords in a safe place (http://keepass.info), for future testing purposes. Avoid filling out personal information other than what is required by law. While I don’t condone creating false aliases, I also don’t condone data-mining, as commonly practiced by google/gmail. Tread carefully and wisely. Also, download and/or purchase major email clients (thunderbird, outlook, eudora, etc.), configure them with the appropriate server settings, and test there too.
  10. Finally: know the law. The European Union and a few states require opt-in/out clauses and privacy policies to be provided at the time of sign-up and linked in every transmission. Unless you’re living in China, North Korea, or other places where access to information is limited (among other things), the internet is boundless – you can’t plan on never getting a hit from the EU, California, Minnesota, Nevada, or other places where laws exist to protect privacy over the web. While it’s unlikely that problems will arise, they can be avoided altogether by including these things. The best way to protect yourself is to know the law and plan for future problems. I’m by no means a lawyer, but I have taken a course in internet/information law. If you’re uncertain, you should probably set up a consultation meeting with a bar-certified professional specializing in this area. A great online resource is http://www.epic.org You can sign-up for their feeds to stay on top of current electronic privacy legislation, cases, and so on.

There are certainly more techniques and considerations, but these should help get you started if you’re uncertain or new to managing and designing email lists. While I strongly condone pushing browser standards forward, the state of email rendering is even less homogeneous – and emails translate into business and money. While it’s great to support and use standards, the burden of implementing standards compliant emails shouldn’t be on the client. Designers & developers need better support from corporations. Full stop, end of transmission.

Leave a Reply