We’re ramping up our emailing efforts and decided to start sending out HTML newsletters to customers. (We’ve always sent out plain-text emails but figured some minimal styling would help liven things up a bit.) So we designed a nice, simple email using clean code. The first one is this brief Basecamp Newsletter.
It took a while to get to this version though. First, we ran our simply styled email through Mailchimp Inbox Inspector (demo), a useful tool you can use to view HTML newsletters in a variety of email apps.
It came up perfect everywhere except Outlook 2007, Windows Live Mail, and Lotus Notes. Strangely, it looked fine in Outlook 2006 but busted in Outlook 2007.
The reason? As Campaign Monitor put it, Microsoft decided to take email design back 5 years.
As I type this post I still can’t believe it. I’m literally stunned. If you haven’t already heard, I’m talking about the recent news that Outlook 2007, released next month, will stop using Internet Explorer to render HTML emails and instead use the crippled Microsoft Word rendering engine.
First things first, you need to realize that Outlook enjoys a 75-80% share of the corporate email market, which is similar to Internet Explorer’s share of the browser market – they make the rules…The reality is that many of us are going to have to scale back our email templates to years past and stick with tables and inline CSS if we want consistent looking emails in Outlook and Windows Live Mail.
No background images, no float or position (tables only), really poor support for padding/margin, etc. For real!? It’s like a time warp to making web pages in 1999. But what can ya do when Outlook’s got a 75-80% share for corporate email?
So we dove into the world of bulletproof, “work anywhere” templates. You can find them at Campaign Monitor, MailChimp, or elsewhere.
But the code is real gobbledygook. Lots of this sorta thing:
span style="font-size:20px;font-weight:bold;color:#CC6600;font-family:arial;line-height:110%;"Totally drops the “beautiful code” limbo bar to the floor. Bummer.
What can be done to make this situation better? Check out these posts from Campaign Monitor that seek to improve the situation: Why we need standards support in HTML email and Help us form a baseline for standards support.
Phil Baines
on 20 Sep 07Man, it seems like Microsoft’s left hand doesn’t know what it’s ‘right’ hand is doing. The Outlook people obviously have no idea what they are doing!
sam
on 20 Sep 07i got it in windows live (personal) and lotus notes (work).
i liked the “look funny? click here to view it on the web” link.
that made good sense to me. i get stuff from adobe that’s undecipherable. which doesn’t really matter, because the fact that i gave them my addy to get a reader upgrade a year ago doesn’t mean that i care about most of the spam i get from them anyhow. (when permission marketing go awry!)
Coleman
on 20 Sep 07To keep code clean I wrote a script that replaces all class/id=”....” with the appropriate inline css before it sends everything out. I know it is dirty but it allows my email templates to be cleaner to develop. Only way to keep from going insane with HTML email I’ve found.
Eivind Uggedal
on 20 Sep 07I would select plain text email over HTML email any day. With a proper mono-spaced font and a efficient mail client it’s a wonderful communication format. I will probably be flamed to death over this, but those are my humble opinions.
Marc Bernard
on 20 Sep 07I’ll add another vote in favour of plain text email over HTML. Much easier to read, in my opinion.
Having said that, the decision to revert to the Word rendering seems crazy.
Mrad
on 20 Sep 07I’ve designed many html emails over the past few years and I figured out early that you have to “let go” of your web standards based ideas when coding. That is, if you wanna reach as broad and audience as possible (or really anyone for that matter).
Mayhaps we should jump into Jeffery Zeldman’s mindset and stop looking at email as a design platform.
Bob Warfield
on 20 Sep 07Outlook is the weak link in the Microsoft Office Suite. It’s no wonder Yahoo bought Zimbra. E-mail should be the first desktop app you move to the cloud. The question is what’s the right “way cool” app to do it?
Best,
BW
Joel Sanda
on 20 Sep 07I’ve got say I really prefer text email. I’m not surprised Microsoft did this and shame on them for break their functionality, but HTML in emails? That presupposes folks have an email client capable of rendering HTML and CSS (it’s not just HTML – it’s also CSS). What about those getting email via their Palm or cell phone or Blackberry?
Straight text works the best because everything supports it.
Frankly I’m a bit surprised 37 Signals would prefer HTML and CSS in emails – your products are so slick and streamlined it seems contrary for you to use something other than text in email. The comment functionality on this page only supports “Basic HTML” – not as much as you desire in your emails ;-)
ML
on 20 Sep 07We’ve been sending plain-text emails to our main mailing list for years and may very well continue to do so. It’s def a format that’s got a lot going for it. HTML emails jazz things up a bit though and that’s nice for a more product-oriented newsletter.
Jake
on 20 Sep 07@Matt: What made you choose Campaign Monitor over the other popular email services like myemma, mailchimp etc. ?
ML
on 20 Sep 07We’ve been using Campaign Monitor for a while now and think it’s great. Really thoughtful app with solid UI and flow. Def worth a look if you’ve never checked it out.
Scott Williams
on 20 Sep 07I wonder if MS did this because of the security issues with IE. Used to be that hardly a week would go by when there was some new vulnerability in Outlook because IE was running with elevated permissions in it. IE 7 was supposed to better at this, but maybe they just panicked and wen with Word. Still sucks though.
Does Live Mail use the same Word based engine?
Nate Klaiber
on 20 Sep 07The outlook thing is very frustrating, especially when you are trying to advance and move forward. I like your emails now, but wouldn’t mind the simple layout you proposed above.
I can understand testing to check old mailers, but to have to hack to support new mailers? Thats just ridiculous.
Jim
on 20 Sep 07Microsoft had to remove the reliance of Outlook on Internet Explorer because of all those Netscape peeps yelling about vendor “lock-in”.
Don’t be mad at Microsoft or the Office team. This is only the result of what everyone wanted.
(BTW, it’s amazing how people praise Apple for their integration of applications, yet people take legal action against Microsoft for similar practices).
Chris Peters
on 20 Sep 07Am I missing something here? I thought you could send multi-part emails that had both text and an HTML versions in the same message. Why are the text email people whining? Are these 37s emails not being sent as multi-part?
Jim
on 20 Sep 07I really was surprised to get that HTML email. I had gotten your text emails in the past and actually read them. When I receive an HTML email, especially one with images (since they don’t load by default in any of my mail clients), I instinctively hit the “spam” button.
pwb
on 20 Sep 07Had to laugh about this: “It came up perfect everywhere except Outlook 2007” even before reading this: “Outlook enjoys a 75-80% share of the corporate email market”.
“Outlook is the weak link in the Microsoft Office Suite. It’s no wonder Yahoo bought Zimbra. E-mail should be the first desktop app you move to the cloud.”
Couldn’t disagree more. Outlook (and Excel) are by far the most impressive pieces of Office. And email is one of the very few tasks that virtually requires the richness of a desktop app.
“it’s amazing how people praise Apple for their integration of applications, yet people take legal action against Microsoft for similar practices”
Not really. Some practices are only illegal when performed by a monopoly (in US law, at least).
JF
on 20 Sep 07Are these 37s emails not being sent as multi-part?
Yes they are sent as multi-part so there is a plain text version.
We’re just experimenting with HTML-based email right now. This is the first one we’ve ever sent. We may or may not continue to send HTML emails.
Tyler Karaszewski
on 20 Sep 07Wow, do people still use computers that render text like in that Outlook 2006 screenshot? That’s horrible.
Martin
on 20 Sep 07Last time I had to use Outlook (Outlook 2003), it completely f*cked up any attempt to do inline quoting. Like misattributing lines with no way to correct it.
I am not particulary impressed.
Wolf
on 20 Sep 07I was rather unimpressed by the cross-emailclientness of the Campaign Monitor templates. They try to use CSS (with the style tag) while you really can’t count on that.
The only way to get some results is inline styles, tables only, sometimes double stating of whatever you want to do (with an inline style and oldskool tags like align=”“)
Darren
on 20 Sep 07well the simple way around this would be to just use text formatting and the odd image.
I know the outlook 07 thing is a real backward move. I think it’s the Office guys throwing the toys out of the pram because they had IE taken away.
Mathew Patterson
on 20 Sep 07Wolf : I was rather unimpressed by the cross-emailclientness of the Campaign Monitor templates. They try to use CSS (with the style tag) while you really can’t count on that.
Thanks for the comment Wolf. At Campaign Monitor we are well aware that Gmail strips out style blocks. For our templates we made the decision to keep them easy to edit by not putting inline styles in to start with.
Instead, we recommend people take the template, make all the design changes they want, and then apply inline styles at the end. It saves having to change things 100 times if you swap colours for example.
Matt said First, we ran our simply styled email through Mailchimp Inbox Inspector (demo), a useful tool you can use to view HTML newsletters in a variety of email apps
It is a useful tool, and very soon we’ll be enabling you to do the same kind of testing right in Campaign Monitor.
Various people said just use plain text!.
All our emails go out in multipart, and 37Signals have a well designed plain text version, so you can always set your mail client to show that.
Everybody should have the choice of what to receive, and no matter what your personal preference is, some people do actually prefer a nicely formatted HTML email.
That’s why it is important for designers not to ignore HTML email, because it is not going away and if we don’t make some noise about standards support it won’t happen.
Joshua Go
on 20 Sep 07What a coincidence. I just spent the day changing HTML e-mails for a client and I thought I was doing something wrong.
It’s both encouraging and disheartening that 37signals is having the same issues; encouraging because it means I’m not crazy, and disheartening because there’s no easy solution, as I was hoping for in the back of my mind.
I will chime in with the echo chamber too: I absolutely adore plain text e-mails. Still, some of us have our reasons for sending out HTML e-mail, and these reasons all seem to boil down to market demands.
Geoff
on 21 Sep 07Re: plain text vs HTML: Our goal with our email newsletter is to engage our clients and prospects. I initially thought plain text would be the way to go, but after a few tests, we learned that the HTML brings far more traffic to our website. In our case, HTML wins the “engaging” competition hands down.
Cheshire Isaacs
on 21 Sep 07I’ve gone completely web standards for my emails. It means that Hotmail, Gmail, and AOL users (and some others) see basic HTML, but since I use h1s, etc., it still looks clean and hierarchically correct for those users. Also, I use a little display:none CSS trick so that a special message appears in email clients that don’t adhere to web standards: “If you can see this line, click here to see what this email should really look like.”
Ideal? Hardly. But for me, the bottom line was that I needed it to be easy for me to design my emails efficiently. All the inline CSS was killing me. Let’s just say I’m rewarding recipients who use better email clients.
@ the plain-text purists: sure, it’s cleaner, but you don’t get nearly the same level of reporting. You’re essentially shooting in the dark. And if you’re emailing for business, it really helps to know when you have (and haven’t) connected with your audience.
I also use Campaign Monitor and absolutely love the service. (I found out about it because of a Deck ad, btw.)
WTL
on 21 Sep 07That is great, David. I’ve added the site to my reading list.
Paul Farnell
on 21 Sep 07I wouldn’t usually plug my own company, but it’s such a perfect fit for this post. We’re Building of Basecamp workshop alumni and our Litmus service helps companies test their emails across different platforms.
MailChimp seems like a good service too, but if you’re in the market for testing emails I believe Litmus is also worth a look.
skylar
on 21 Sep 07I got the Basecamp newsletter and immediately scrolled to the bottom to hit “unsubscribe”. To my surprise there was no link! It wasn’t until a few seconds later I found it right at the top, which sounds like a good location but I’m so used to having this link at the bottom.
Marc
on 21 Sep 07I actually like the HTML newsletter you guys sent. It still has the cleaness, but with a little 37style and I like that. I use Outlook at work :(
Sharaf
on 21 Sep 07Your best bet would be to use basic HTML and tables for styling for emails, I know it is kind of going backwards, but this is the only way you can have your emails look the way you want in all email applications.
Plus, if you use CSS Gmail strips it out and so does other web-based email systems. So design your HTML email just as you did web sites in 1999 without the animated cliparts and it should work. Keep your HTML formating simple, so that you don’t end in the Junk Mail.
Then offer a link to a web version of the email online which can be in pure XHTML+CSS.
Martin Edic
on 21 Sep 07Personally I prefer a link in the email to a web page with the newsletter design- simple, works with every client, doesn’t clutter things up, creates an archive of back letters. Is that so complicated?
JF
on 21 Sep 07One of the big benefits of HTML newsletters, from a business perspective, is tracking. You can see which links are clicked, who clicked them, who opened the email, etc. You get a much richer report with an HTML email than you can with text-only.
Matt Lee
on 23 Sep 07Jason,
While I admit it’s less elegant, you could do that with plain text just as easily.
ie. For Campfire discounts visit http://37svn.com/cf/1/234567
Anonymous Coward
on 23 Sep 07Matt Lee: No you can’t.
You can track links using custom links as you’ve suggested, but you can’t track who’s opened the email and read the email without clicking links. HTML emails allow you to track who’s actually opened the email. You can’t do that with plain text emails.
James
on 24 Sep 07“(BTW, it’s amazing how people praise Apple for their integration of applications, yet people take legal action against Microsoft for similar practices).”
Actually works when Apple does it, Safari is very standard compliant and makes HTML email in Apple Mail effortless.
Word’s HTML engine is even more locked in than IE if you ask me
RobM
on 25 Sep 07I applaud Microsoft in taking this bold step to make it harder for marketing departments to fill up my inbox with HTML email.
I appreciate that not all people who send me HTML email are spammers, it’s just that the signal to noise ratio of HTML email is so low that I don’t even attempt to read it any more unless I know for a fact it’s something that I personally cannot do without (hint: that does not include any marketing mailshot).
RubyMail
on 25 Sep 07Apologies for the self-promotion, but for anyone reading this post and wondering if there’s an easier way, we have a full-service HTML email marketing solution at www.rubymail.com in which we do all of the work for you. No templates. We custom-code your Photoshop/Illustrator design in HTML/CSS, do all of the testing to ensure optimal display in all major email applications, send the campaign, and provide reporting.
Obviously we can’t get around the issues with Outlook, et al, but we have the experience to code around the hurdles wherever possible and implement your design in an optimal fashion.
Deutsch
on 27 Sep 07I used Outlook 2007 since it was beta and it was surprising that you couldn’t even use animated GIFs!
This discussion is closed.