My dream HTML email editor…does it exist?

One of the things I have to do for my job at C3 on a regular basis is produce our monthly e-newsletter. Contrary to what the bloggers want you to believe, email is not dead. Way more folks subscribe to C3’s content via email as compared to Facebook, Twitter and RSS feeds combined. By a very wide margin.

It took a while, but I finally have a template that seems to be working well for us:

I’ve tested the template in Outlook (2003 and 2007), Gmail, AOL, Yahoo and Apple Mail and it looks just like the screen shot above, or close enough.

We use Convio for our email marketing, and unfortunately their email WYSIWYG editor…well…sucks. For starters, it only works in Internet Explorer. It’s difficult to tweak, the default styles don’t work well for email, and the preview window often doesn’t reflect what the email will look like in the client.

Like many, I build my emails in a separate HTML editor (usually Dreamweaver CS4 because it’s the only editor I have with a decent live preview), copy/paste the code into Convio’s window, add any needed conditionals (personalization and the like), send out tests to see what the email really looks like in an email application, note what’s wrong…rinse, repeat.

Designing an email that looks good requires you to throw out everything you may know about modern web design. Go back to nested tables (but not too many…you have to keep the code light and not get bounced as spam if there’s not enough content vs. code) and only use inline CSS styles.

There are HTML editors of all different shapes and sizes. What I want is an application that has the look & feel of Panic’s Coda, but is specifically designed for email. So in a perfect world it should:

• Work easily with HTML tables and only nest tables as much as is absolutely necessary, keeping the code as clean and small as possible.
• Default to inserting inline CSS, allowing you to save styles or email-friendly code snippets for later use. So if you have a line of text and select “bold blue headline” the software would automatically throw in something like <h2 style=”font-style:bold;color:blue;”>Line of text</h2> around the line of text. I’d want it to still respect the cascade, so if I put the same styles in the <td> tag that contains the <h2>, the software should automatically remove the redundant style from the <h2> tag. Less code the better.
• Automatically insert images with absolute links, uploading as needed (http://domain.com/images/location instead of ../images/location)
• This is key: preview for the leading email clients. Select “View in Outlook 2007″ would simulate what the email would look like in Outlook 2007 without actually loading the email application. I’ve been using Campaign Monitor to test new templates, but there’s a small per-test cost and it’s time consuming. At $5 per test, I certainly don’t want to do multiple tests on every email we send out, although I know I probably should. Otherwise, it’s a royal pain to load 5 different windows and 3 different applications to test emails.

In other words, I need a HTML editor that’s smart enough to be dumb when it needs to be.