When is e-mail like a bad website?

Nokia sent a friend an HTML e-mail message. I’ve broken it into five screen shots, because it won’t fit on one:

  1. Nokia “e-mail” part 1
  2. Nokia “e-mail” part 2
  3. Nokia “e-mail” part 3
  4. Nokia “e-mail” part 4
  5. Nokia “e-mail” part 5

A word about the fonts. These are not my default settings. They are controlled by Nokia, on the assumption that 9px Arial is universally legible and attractive.

A word about the layout: I can reconfigure it by changing the width of my e-mail client’s message window, but no matter how I play with the width, I never get the layout the sender intended.

Nokia is trying to cram a bad web page—the kind of web page that is all graphics and almost no textual content—into a container that can’t hold it. It’s like pouring wine into a sieve. I’m not saying the graphic designers who created this message lack talent; from what I can tell, they are gifted indeed, and able to do nice work under what must be harsh production deadlines.

I’m not saying the layout is broken for everyone, or that there couldn’t possibly be an MF Doom fan who also digs Fall Out Boy. Clearly the layout must work correctly in some applications; doubtless, too, there must be some users who enjoy getting craploads of musician photos in their e-mail in-box. Nokia wouldn’t do this if it didn’t work for somebody. Responding to this post by saying, “Funny, it looks okay in my e-mail client” will miss the point that e-mail, as a medium, really doesn’t want to carry all this freight.

Related posts

Eight points for better e-mail relationships

Okay, so under the right circumstances, when people have requested it, e-mail can be a platform for design. Here are eight ways to make it work better (and avoid pissing off people who hate HTML mail).

E-mail is not a platform for design

ASCII means never having to say you’re sorry.

[tags]HTML mail, e-mail, marketing, internet marketing, design[/tags]

53 thoughts on “When is e-mail like a bad website?”

  1. So the message could be: by all means use images, but understand there are incredible risks that your message won’t get through as intended; conversely, if you use text, you’re almost guaranteed that What You Write Is What They Get.

  2. What are you talking about? It is totally readable! However, they should have used Flash, with anti-aliased 7px fonts.

    =)

  3. All I can say is wow. I would love to know what Nokia’s testing methodology is for HTML e-mails. In which clients does that actually render correctly?

  4. Hey, I noticed that there’s a link at the top of this mail saying “if you can’t see this email, click here”. Can you post that link here so we can see what they intended it to look like.

    I completely agree with you. Now whilst my email client can handle this kind of HTML email I often have to clean out quite rigorously due to huge filesizes. When I “opt in” I do expect a little consideration from brands in the weight of the mails they send me. I want to be informed – not have my inbox and hard drive filled.

  5. Granted the emails are forwarded to you (which will always render differently) – your point still stands 100%. In fact, this is another aspect as to why HTML emails aren’t very usable. The ability to hit the forward button to a friend and have an email that is still legible land in their inbox. As you can see here – it gets chopped up quite nicely.

  6. What we all should be learning from this, is how to capitalize on our clients need to communicate. Here is the business model.

    1. Promote awesomely hip HTML email with sweet images of all the products Nokia needs to pimp. “Look, Apple is even building HTML e-mail into Mac OS X, and the are the all the rage with iPod toting teens and twenty-somethings. If you do *not* get on board, your going to miss the next big thing, like IM or BBS.

    2. Exclude from the budget any money for up front research or after the fact evaluation of the campaign. Then be sure to go just enough over budget so as to prevent the suggestion of incorporating research and evaluation in the next campaign.

    3. Broadcast the broken messages to every e-mail address in the clients databse, accidentally, whether they opt-in or not. Rely on the fact that most people get enough corporate junk to count it as spam rather than hold the sender accountable.

    4. Squeal with glee all the way to the bank.

    HTML e-mail just needs to fade away. Will pursuing web standards really help this situation, or just make the junk mail look better?

    I get at least one well designed credit card appeal in the mail a day, and a few pieces of poorly designed coupon riddled mailed as well. Guess what, its all junk — spam — and it all goes in the recycle bin and, based on the quality of the paper fiber, into a landfill.

    So I guess the upside of spam and HTML email is that its eco-friendly. Unless the environment in question is the bandwidth of the internet and the time I spend sorting and setting up filters.

    Sigh.

  7. I follow these HTML email posts with heightened interest because emails are my bread and butter. I don’t like doing them, but the company I work for pays me an above average amount of money to do so. While I would rather not be in it for the money, I have bills…

    I find that forwarding HTML emails tends to be fairly problematic in terms of maintaining the original document. Sending emails to friends via Entourage’s and Mail.app’s “Redirect” features seems to be the best way to stay faithful to original email designs. I’m not sure what client you’re using, Jeffrey, but this just be a byproduct of a rendering problem with forwarded messages? Just wondering.

    As an aside, I think to vilify these emails is to overlook the larger problem — not all clients are created equal. We have the technology — to make them better, faster, and stronger. As I’m sure you’re well aware, it happens that technology is the very set of standards you’ve worked so long to get people to be aware of and adopt. The Safari/Firefox/Opera/IE rendering inequities pale in comparison to the support (or lack thereof ) of HTML emails. Why aren’t email software and webmail providers being pressured to be more on board with honoring said standards? Aren’t we letting them off the hook a little bit here? If all clients WERE created equal, and allowed for CSS/HTML to properly render, we could make emails that degraded gracefully and this discussion would be moot.

    Until then, the powers that be have a proverbial gun to my head — I HAVE to make table-based, image heavy emails because they generate revenue, like it or not. Corporate inertia is slow, and in direct mail there are a lot of ethical gray areas, and lastly—I’m a little fish in a big pond. Just had to get that out of the way for the folks who will say I should be fighting for the adoption of better practices from within.

  8. will said:

    Hey, I noticed that there’s a link at the top of this mail saying “if you can’t see this email, click here”. Can you post that link here so we can see what they intended it to look like.

    Right you are! http://tinyurl.com/2pptdk.

    When I “opt in” I do expect a little consideration from brands in the weight of the mails they send me. I want to be informed – not have my inbox and hard drive filled.

    That’s my thinking as well, and it’s why I recommended that marketers provide a sample before asking people to opt in (Suggestion No. 3).

  9. The fault either lies with the creators of this email, or your email client. This doesn’t prove HTML in email is wrong. HTML/CSS support in web browsers of the early 90’s was sketchy at best, but you didn’t see people writing off the medium.

  10. Woah! Now I’ve seen it in it’s entirity – that is heavy. And I don’t mean that in a “back to the future” kind of way.

    I do find it all the more hilarious that even the page itself states at the top, “If you are still having problems viewing this message, please click here for additional help.”

  11. The fault either lies with the creators of this email, or your email client.

    Dude, the broken formatting is beside the point. The point is, they’ve crammed twenty pounds of spaghetti into a five pound bag.

  12. It’s like designing a vehicle appropriate for the road, but instead driving it on the sidewalk.

  13. Email clients? They are so nice and sweet.

    How about mail on a Blackberry?

    I just go this from a company called Emma. (Ijust read them. No business what so ever).

    The fact is that the mobile device crowd, while still a fairly small slice of the overall email viewing audience, is growing. Use of Blackberries and similar handhelds continues to rise, and research by the NPD Group showed that as of last September, 6% of people viewed their email on mobile phones – up from 3% just six months earlier.

    That’s tough for Email designers!

    So what do they suggest? Exactly – plain text!

    Back to square one.

  14. All I can say is wow. I would love to know what Nokia’s testing methodology is for HTML e-mails. In which clients does that actually render correctly?

    My guess would be Outlook Express. Not because it is better, but because its probably the only one they tested on, since it is the e-mail client that ships with 90% of PCs.

  15. Isn’t part of the problem here that pursuing HTML email standards by lobbying for better email client support is not as reasonable as asking browser makers to embrace standards?

    For a browser, it seems pretty obvious (while you guys who started the movement might say not so obvious) that a big part of the browser’s purpose is to render web pages, and that consistency and standards will improve the situation for everybody.

    Isn’t asking those who build email clients to build in what are essentially web standards kind of like asking people who make cars to follow the standards used in building houses? They are not building houses; they’re building cars.

    I could take this metaphor way too far and get into RVs and mobile homes and everything else, but the point is, the web standards movement has been largely successful. Why not enjoy the fruits of that labor by using that

  16. I’m sitting here thinking what comes next? Say email one day does support precise control over design via standards. What would we be asked to try when this richer style of email becomes boring, common, and therefore doesn’t hit click-through rates? Would we be asked to start embedding applications in email? Or two-page emails? Micro-sites? When I first began following these posts regarding email design, I too was at first thinking how could we live without it. It’s such a common request by clients, it helps pay the bills, etc. Three days later, I am starting to feel like email is better left for quick conversations, designed with less information, and more importantly less clutter. There has to be a better way to market to people aside from email and the tools currently on hand… it just hasn’t been figured out yet. Or if it has I don’t know about it.

  17. Dude, the broken formatting is beside the point. The point is, they’ve crammed twenty pounds of spaghetti into a five pound bag.

    So rather than building a better bag you suggest we stop eating?

    I get a number of HTML newsletters from T-shirt sites that are very heavy in HTML and imagery, but I look past it because the emails work. I receive a big list of thumbnails for all of their new T’s, which has just a bit more impact than a list of linked ‘click here to see blah‘. People respond to the pretty pictures, such is life.

  18. @MBJ: Wasn’t the “web” started by DARPA as a communications medium? Email and HTML grew out of that, with HTML born out of a need for more sophisticated control over electronic documents. You are trying to delineate email as if to say it’s strictly for text and always should be — how would you react if someone said the same about HTML? You’d probably laugh at them. That, in turn, is like saying that all traditional mail messages should only consist of 8.5×11 letters typed on typewriters and folded into thirds. You’re not allowing any room for non-traditional formats or CYMK ink (metaphorically speaking) in a medium prized for its flexibility.

    Maybe an extension of this argument really should be us asking ourselves whether or not we need a novel method/standard/software/something for deliverable multimedia content? That seems to be the directions this debate is headed (that or the luddite email-is-for-text-only direction). We have enough languages and frameworks to around, why shouldn’t we make do with something that we already have, that works, like HTML?

  19. Nice example Jeff!

    One thing I did not think of when reading the previous posts on the subject was the reply/forward problems with “designed” messages. How do I qoute part of this message (say the little bit about MF Doom) and forward that with any degree of success?

    Trying to implement any kind of standardization into email-clients is going to be many times worse than for browsers simple by the sheer number of clients. Back in the bad old days we had two major browser-families to infuence. How many email-clients are there? 50? 100?

    Outlook is in no way as dominating as InternetExplorer. Many big companies use systems like LotusNotes, FirstClass and other similar integrated systems similar to M$ Exchange. Many people use any number of webmail-clients, Thunderbird, Outlook, AppleMail…

    The second big problem with standardizing html-email is that I guess none of these developers see htm-rendering as their highest priority. The have so much to do trying, among other things, to get threading, sorting and spam-filters right first.

  20. I always get a chuckle out of those “‘Click here’ if you can’t see this email.” I see that a lot. I get all my email as plain text. In the case of this email, because I don’t view HTML emails, all I’d get is that link at the top — which of course wouldn’t be a link at all because I don’t get HTML emails. Pretty dumb. People do stuff because they know they should, but they have no freaking idea why and thus implement poorly at best.

  21. In which clients does that actually render correctly?

    It renders correctly in Apple’s free built-in Mail app.

    I, however, use Eudora because of its far better filtering options. When you receive thousands of messages a day, you need very good filtering to see the ones that matter to you, and Eudora delivers that.

    Eudora has a wretched interface, it’s not a Universal binary and never will be, and its HTML mail rendering is known to be near-useless and will never be improved, what with Qualcomm unloading the product under the guise of “releasing it as open source.”

    If I cared even remotely about HTML mail, I would have stopped using Eudora years ago. But what this user actually cares about is message management. And Eudora, for all its hideous pus-leaking warts, does message management better than any other app I’ve tried.

  22. Yep, thats bad – doesnt help the email professionals cause at all. It makes me cringe just the same as when I see tabled, framed websites full of micro-nonsense, I mean Frontpage sites.

  23. At Campaign Monitor we try to help people avoid making these kinds of mistakes in their email design – our mad scientist Mark Wyner has a great series of Extreme Email Makeovers that go through common mistakes and suggests ways to make more standards based, accessible and readable designs.

    I remember when a lot of websites were just sliced up jpgs in tables too – we are at least getting past that point now, email is just lagging behind.

  24. I’m with you on the Eudora thing, Jeffrey. So many things that it get right from an interface perspective (like option clicking on anything in a mailbox view to group all like items together). Allowing you to selectively pick which emails to delete off a POP server is another capability that I’ve not seen equaled in any other GUI-based client.

    I had dumped it in favor of T-bird because Eudora seemed to be choking on my IMAP bpxes. Turns out, I think it was my old Webhost. T-bird overheats my aging G4 Powerbook so much, I’m ready to try out Eudora again.

    I would like the Penelope project (the so-called open sourcing and integration with T-bird) to work out, but I’m not going to hold my breath.

  25. The company I work for sends out HTML emails all the time. Want to know why there’s no simplifying them for the various email clients? They’re all tested as if they were web pages, in IE/Firefox/Netscape etc – nobody is tasked with checking them in actual email clients. It’s totally absurd. ‘Looks good in IE? Okay, blast it out!” And what’s more > who the heck collects data on how people receive them? We should start sending screenshots back to these companies showing how the majority of opt-in subscribers are getting horridly broken and therefore worthless marketing material that promptly gets dumped into the trash.

  26. You are certainly correct about the original intent of the www not being about presentation and design. I actually had conceded that in my post, but I clumsily managed to cut off my last couple of paragraphs as I posted it somehow (doh!).

    I think you are right that perhaps the next question is about some sort of new vehicle.

    But it still seems to me that presenting HTML in browsers works pretty well and that RSS and email can be used to update “subscribers” and let them know to check out the new content with one click. If it’s something I’ve subscribed to, surely I care enough to click over to the web page (I do it all the time).

    I’m not necessarily saying all email clients have to be all text all the time. I just think that rather than asking the email client to serve as a pseudo-replacement for a browser it could just work in tandem with a browser.

  27. I can see a need for HTML in e-mail, just like I can see why some people want to listen to their music or surf the innertubes on a cell phone. Technology is going in so many directions that it’s getting more difficult to set standards.

  28. Anyone who has ever had a Match.com account (where I met my wife — yes it works for some people), will tell you there is huge value in receiving an HTML message with pictures of the latest matches they’ve found for you. There is utility in HTML email, but maybe not a lot of art. Likewise, there is utility in asphalt and not a lot of art. I agree that for personal email HTML is usually overkill.

  29. I think the arguments on both sides are pretty valid. I can’t stand developing HTML emails for my company, especially because most of them are simply sliced jpegs. Too many people are focused on “branding” and marketing, instead of quality content.

    @Derek — I think you’re exactly right. When the images ARE the content then they are paramount to design. As long as the email has a method to give you the information in text-only if you so desire (text descriptions and links to external page).

    I’d like to see well-designed emails with minimal HTML usage. Perhaps HTML could be used to show a company logo, and to make links clickable in HTML clients, but the content is king, as they say, and if an email (HTML or plaintext) fails to deliver the message then it serves no purpose.

  30. Let’s acknowledge that there are basically two discrete user-oriented issues here:

    a) Old-skool techies who hate HTML mail for (valid) technical reasons
    b) Regular folk who receive broken emails and don’t know why

    The (a) users should be a non-issue, as far as their personal experience is concerned. MIME standards have been around for a long time (RFC1341 appeared in 1992, in fact). They’ve obviously developed since, but the basic implementation still works – you put all the different formats in one message and let the client/agent decide. Any user in segment (a) should be able to figure out how to make their email client display the text part of a MIME message only. Anything else – discard it.

    Any decent email campaign should include a well-written, concise plain text version. It’s the closest thing we have to ‘degrading gracefully’. And frankly it’s actually pretty graceful.

    As for the (b) users, well they don’t care or know if an email is HTML or rich text or plain text, any more than they know whether a website is standards-compliant or not. All they know is that on their screen, the email looks broken. In all likelihood, they delete it, and in all likelihood, whoever commissioned the broken email doesn’t know and/or doesn’t care. Because those users are perceived to represent a tiny, dare I say it, disposable fraction of the audience. It’s simple ROI – if the amount it costs to get that design working “for everyone” doesn’t outweigh the amount they’ll gain from the increased exposure, then there’s no point in doing it.

    For a second, put yourselves into the heads of the marketers and understand something about email marketing – permissible, I mean: it’s a numbers game. If you have the subscriptions, it costs very little to send out 500,000 messages. You can’t think in terms of the ridiculously low response or conversion rates, think in terms of cost-per-lead (or cost per desired response). To the business person, it makes no more sense to spend the time to make an email message universally compatible than it does to include a braille version of a direct marketing mail piece.

    Of course, none of that makes it “right” and it doesn’t mean that as designers/developers, we can’t sit down and (try to) educate the business people, or quietly make the email as compatible as possible, or indeed follow the previously-posted guidelines. Good luck doing that if you are given that Nokia mockup to code though.

    (By the way, the old chestnut of ‘know your audience’ comes in here. Most likely the Nokia recipient FOB/MF Doom fans are not using Lotus Notes; in the same vein, if your audience is hardcore techies then you’d better send it in plain text (or as an RSS feed), as the comments here over the past few days prove.)

    The wailing about bandwidth, I don’t buy. We’re quite happy to waste acres of bandwidth on YouTube and iTunes, the impact of legitimately-sent HTML emails is negligible. They don’t include the images in the email, they’re called up remotely. Or – increasingly – they aren’t called up at all.

    Which brings me to the conclusion – HTML email in the form we know it is not going to be around much longer. Images are blocked by default in all the big web-based mail clients as well as in the newer Outlooks and Outlook Expresses. Alt attributes do show up; but in the MS products they are all prefaced with “Right-click here to download pictures. To help protect your privacy, Outlook prevented automatic download of this picture from the internet”, effectively making them disappear. These are the default settings, and (say it with me!) most users do not change the default settings. I know I don’t; if the email makes no sense without images then I’ll move on. It’s at this point that I fall into the (b) group, by the way. When that group becomes significant enough to affect the bottom line, you’ll slowly see the shift away from things like the Nokia email.

    So images in HTML emails are going the way of the dinosaur, as they can no longer be relied upon to communicate the message (or indeed the other thing for which images have been (ab)used – tracking who opened them, when and how many times).

    HTML emails won’t be going away any time soon, if at all, but their form will change. The successful ones will use the medium to its effective limits; that is to say, simple accessible layouts, obvious links, appropriate text treatment, sensible use of colour and – last but not least – compelling copy. I’m not sure, but I think that’s progress?

  31. I vote we, as a profession, eschew HTML e-mail in favor of attaching a single PDF or Word document. Or perhaps one giant 64-color GIF. That will show ‘em.

  32. This only proves that, HTML emails, like web sites, can be created with different degrees of skill or effectiveness.

    I fail to see Mr. Zeldman’s point (other than trying to – indirectly- vilify HTML email). Would Mr. Zelman write an entry on “nice” HTML emails he might receive?

  33. Would Mr. Zelman write an entry on “nice” HTML emails he might receive?

    Probably not, since Mr. Zeldman opts to receive plain text mail and knowingly uses a mail client whose HTML mail capabilities are contemptible.

  34. On the one hand, I see the point of those who hate receiving HTML e-mail: it’s plain irritating to deal with rendering errors and extra weight if you don’t want it.

    From a marketing perspective, though, the HTML e-mail (when done well, if that’s even possible) has the right idea: it brings the user closer to styled content without requiring any extra action by the user.

    After looking for a few months, I just landed my first job out of school (marketing webmaster, if you’re curious). While the big three career sites (Hot Jobs, Monster, and Career Builder) were ultimately frustrating, one of the best features shared by all three was a periodic HTML e-mail with job recommendations. A plain-text e-mail would have made the content less readable. A plain-text e-mail with a link to a site that actually had what I wanted would have been irritating.

    That’s just talking about information that I was incredibly devoted to obtaining. What if we’re dealing with marketing campaigns (let’s say the type that users willingly participate in by allowing their information to be distributed)? There are lots of users who will not bother with following a link to the content. There are users who will not take the plain-text e-mail as seriously because it looks like any old plain-text e-mail.

    So I understand the desire to keep e-mail lean. I certainly don’t like getting unsolicited e-leviathans in my inbox. But I also don’t see any chance of HTML e-mail campaigns dying any time soon.

  35. The different email programs use their own proprietary ways of rendering HTML. Some of them add their own code to your code. When forwarded to another recipient using another email client, the HTML email gets all mucked up. I think if you “indent” quoted messages from forwarded emails, it exacerbates the problem.

    Proprietary HTML email rendering engines aren’t as common in webmail clients (duh, since they use the browser) but you’ll always see this on desktop apps (Lotus, Eudora, Apple Mail, Outlook 2007, etc).

    It’s not that those companies are evil, and *want* things rendered wrong. It’s just because back when they first built their programs, that was all they could use—hacked together code for displaying “Rich Text.”

    This is more an issue of old email applications than HTML email design.

    The way most email marketers/designers can try to deal with this is they include a separate (albeit rarely used) “forward this to a friend” link.

Comments are closed.