Switching from plain text to HTML emails

Recently, I switched my WordPress News mailing-list from plain text to HTML. There were a couple of reasons for that:

  • I use a lot of links, and these were breaking up even a simple text layout, and I figured HTML email would increase the readability of the whole thing.
  • With HTML emails, because you're seeing normal link text, it doesn't look so bad when you're tracking clicks, which you are of course doing to improve your newsletter.
  • HTML email plain looks better, and gives a better opportunity to brand yourself.

In the process of switching to HTML, I've learned a couple of things. I must say the first thing I've learned is that people don't really seem to mind getting HTML email, I've had 1 serious complaint and about 5 dozen positive reactions of people saying this hugely improved the newsletter.

The funny thing is that the 1 serious complaint taught me something new: my newsletter wasn't showing up very nicely in Yahoo! Mail, and the guy was right on to complain to me. Turns out, a lot of web based email readers don't like external style sheets. The solution is simple: use only inline styles.

Now that might seem like a lot of work, but it isn't because of this great tool called Premailer. That absolutely great tool allows you to make up your newsletter in HTML, and then it parses it and moves it all to inline styles. In the same process, it'll also created a decently looking text version!

So I based my design on one of these templates provided by Campaign Monitor, and got my buddy Christian to design this header image for me:

Mailing List Header

So what I've done now that I've got a finished template is perhaps a bit geeky, but I love it: I've set up a special WordPress blog, with the email template as it's template. I've reversed the post order in it, which you can do by simply doing this:

// Reverse post order
query_posts($query_string . "&order=ASC");
while (have_posts()) : the_post();

And now I can use my favorite external editor, MarsEdit, to write posts for my mailing list. I tag each post with it's edition number, and when I've got enough stuff for a new edition, I open up that tags page, save the HTML, put it through Premailer and then copy the parsed HTML from Premailer into my Aweber broadcast. As Premailer also provides the plain text version, I copy that in too, and I'm done!

By the way people have asked me why I use Aweber, and to be honest I haven't tried anything else. This is what most pro's I know use, it's pretty cheap, it's very good, and it gives me everything I need, so why go look somewhere else?

All in all, this has been a pretty smooth experience, and my newsletter has gotten better from it, so I would advice any of you who sent out text only emails to start doing HTML too!

Related posts

  1. Annoyances and weird stuff
  2. Conditional WordPress widgets with rich editable text
  3. 10 Checks to the Perfect WordPress theme
  4. WordPress Newsletter
  5. WordPress Hosting Parties Reviewed

Want more WordPress tips?

You should subscribe to my WordPress Newsletter, as you'll get a whole lot more WordPress tips and tricks there! Also, subscribe to this blog right now with RSS, or daily or weekly emails!

13 Comments to “Switching from plain text to HTML emails”

  1. Sint Smeding

    Sint Smeding Oct 10th, 2008 at 11:19

    Hi Joost, thanks for writing this post, following my suggestion when you said on Twitter you gained a lot of new experience while switching to HTML mails. Or maybe you already thought of sharing this knowledge with us. Great!

    I totally agree that inline styles work the best when mailing out HTML, this matches my experience. I expected you to give some specific code-advice, but the Premailer-tool is even better.
    If you use a mailing system that works with templates and a custom body part that is edited with a WYSIWYG-editor, you could also parse your template once with Premailer since the content of your mailing will then probably just contain some paragraph-tags and floating images, which shouldn't be a problem in most e-mail clients.

    The idea of formatting the newsletter automatically from website content saves a lot of time. I don't use Wordpress myself, but the concept works with any CMS of course, maybe with some custom coding.

  2. Henri

    Henri Oct 10th, 2008 at 11:40

    It's better to use old HTML without CSS. MS Outlook 2007 use the MS Word render for HTML mails. No support for background, positions, etc. Therefore, use simple tables, that works fine.

  3. Hilmy

    Hilmy Oct 10th, 2008 at 13:08

    I did a simple split test, half of my list receiving plain text and the other half HTML. Open rate was around 5 times higher for HTML. Of course this is not true for every list and/or niches.

  4. Rob

    Rob Oct 10th, 2008 at 14:34

    Not all the inline stylesheets are supported. it is also easy to send an email in plain text and HTML. In that case the emailclient can choose the option it supports.

  5. Joost de Valk

    Joost de Valk Oct 10th, 2008 at 14:59 Delicious Digg StumbleUpon Twitter

    @Sint: thx for the suggestion!

    @Henri: I use a table layout, as far as i've seen, this works pretty well :)

    @Hilmy: measuring open rates is almost impossible on text mail, so that is probably not a fair test.

    @Rob: I ALWAYS send plain text too, doing only HTML would be very bad.

  6. simon renaud

    simon renaud Oct 11th, 2008 at 02:28

    aweber is nice but ill check this one for sure

  7. Alex W.

    Alex W. Oct 12th, 2008 at 01:54

    Thank you for your interesting post. Another thing that you might find helpful is a service like MailChimp's Inbox Inspector which gives you screenshots of your HTML emails in a number of actual desktop and web email programs as well as running those emails through actual spam filters. It's a fee-based service (I think $29 for 3 Inspections), but I found it useful. And other places, such as Campaign Monitor, which you mentioned, offer such services for free (which I haven't tried, though.)

    Just another resource out there for those of us who want to be able to reach those who have requested emails from us. :-)

    Cheers,

    Alex

  8. Sint Smeding

    Sint Smeding Oct 13th, 2008 at 09:43

    @Rob/Joost: Measuring plain text open rates is indeed impossible. Stats for HTML are also not quite accurate, because lots of e-mail clients block images from being viewed unless the user permits them being loaded explicitly.

    You could split your link tracking of text and html, but the figures won't tell much when you don't have exact opening statistics about the two versions. I choose not to track links in my plain text versions at all and display the actual link in plain text e-mails. Most clients support HTML mails anyway and using 'real' links looks better and people rather click on a link they can recognize than a link that leads to a strange tracking domain.

  9. Roger

    Roger Oct 14th, 2008 at 23:53

    Thanks for good reading. I will consider to start sending html emails too. Its quite a while since my last attempt, but your recommendation to aWeber gives me a good feeling :)

    Thanks

  10. Michael Visser

    Michael Visser Oct 16th, 2008 at 12:44

    Hey Joost,

    Part of my role as a Front End Web Developer is to build e-mail templates for use in digital newsletter publications, the #1 tip I can give others building their first e-mail template to be compatible with popular mail clients (Outlook 2007, Thunderbird) as well as web clients (gmail, Live, Yahoo) is to lose any X/HTML disciplines and use rigid table layouts. It sucks but with Office 2007 and gmail among others imposing crazy styling restrictions the results of table-based layouts are consistent across all clients.

  11. Jon

    Jon Oct 17th, 2008 at 10:29

    Hi Joost

    As a subscriber, I'd also give a thumbs-up to the new HTML email format.

    Do you use anything to check your emails against spam-filters before sending it out. Or does anyone know of a good (preferably free!) service that will check and warn you if anything in your email is likely to trigger the spam filters?

    Cheers, Jon

  12. Joost de Valk

    Joost de Valk Oct 17th, 2008 at 10:30 Delicious Digg StumbleUpon Twitter

    @Jon: Aweber will automatically run a spamassassin report on your email when you create it, one of it's many awesome features.

  13. Jon

    Jon Oct 17th, 2008 at 10:33

    Thanks for the speedy reply, Joost!

    I've just started using Aweber and haven't discovered all its features yet, so that's saved me from searching elsewhere. Thanks!

    Cheers, Jon

Leave a Reply

Joost de Valk a.k.a. Yoast Want an avatar too?
Go to gravatar.com and upload your preferred avatar.

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="">

1 Trackbacks and Pingbacks

  1. Link-Love de 11/10/2008 | Wordpress Themes
Pepperjam
Free Google Traffic
Directory Journal
SEO Book Tools
SearchEngineWatch
Hosting by:
Hosted by MediaTemple Grid Services