HTML Email?

Really mass email is or probably should be a dying breed in 2010. Take for example, Costco mass email, it comes way, way to often to my inbox, and very rarely do I even bother to look at it anymore. However, if it wasn’t effective, I would guess they wouldn’t do it. I also have to admit I do occasionally look through it.

Mass HTML email is different than Spam, at some point I did subscribe to it…. I guess and it is really cheap to do it. I give an estimate to a guy who wanted to send out a large post card to a local city (around 6,000 homes) a few weeks ago, and the bid if I remember correctly was around $6k. Between the mail house fee (which was nominal), postage (which was half), printing, and design time, it was way to expensive. So compared to sending out a mass email to 6,000 people which would really only cost a 1/2 days work, sending out mass email is quite cheap.

All in all I think that we are at the end of days for B&H wishbooks (the 1000’s of pages of every single tech item in the world) or Sears Wishbooks. They are to expensive to mail. In fact really for family birthdays and such, I don’t even send presents except through Amazon. Out side of paying my taxes I don’t think I have sent many personal letters either. So perhaps, the dying beast isn’t HTML mass email but instead business postcards.

How to format

First let’s think of email clients, the nicest mail client I have seen is Apple’s own mail. It is quite nice, also the iPhone mail client is way ahead of my old Blackberry…. I keep trying to convince my co-worker to get a Droid so I can play with his, but I will have to reserve judgement on that one. Anyhow the simple rules are all the CSS rules (not CSS as a whole just the rule set BTW.) that you have learned you will want to throw that out the window. Avoid DIV tags, use lots of tables, and remember use inline styles.

The Rules

Example picture
I this week just formatted a design for a client which went out, and that brought to my mind the need to create some rules.

  • First I always do set the font declaration at the top of the page (See the screen shot above) - That is usually the only real property that I do set at the top.
  • Add in td tags or p tags inline styles e.g. - style=”_rules_” .
  • You can make it look beautiful but it takes time.
  • As always I usually prefer to get the final images, and copy from the clients up front if not it takes a lot more time.
    Really those simple rules seem to render the design correct most of the time. I also prefer when sending a email to give people a way to click a link to view it on a webpage, as well as it is always smart to also send a plain text version of the email.

How to test

On a mac it is really simple to test how the mail will look. When previewing the document just hit CMD I or File -> Mail the Contents of this page and that should load the message in your mail client. I always try to test the email in 3 locations - #1 Apple mail (I like to see it perfect), #2 web based Gmail (probably the most picky in terms of font colors, and such), and #3 in Outlook (which I figure will be what most people look at it in). All in all that should cover most people and how they will see it, without having to go crazy with testing.