How to make sure your CSS styles show in HTML Emails
Friday, May 2nd, 2008We create a lot of emails for people, brochures, newsletters, once-off invitations and more.
Usually these have a unique look and feel and require some kind of customisation, but with the world of html emails, consistency and display reliability is a hard thing to achieve thanks to the wide variety of archaic email clients being used.
This article here provides a handy little checklist of CSS items that are available to you, but it doesn’t not list the new hotmail “Live Mail” and as there are differences in the way CSS is handled we must press on.
The best article we’ve come across is written by the fantastic guys at Campaign Monitor right here. What are some of the main points we took away? We’ve distilled it way down for you anyway.
As with many things coded for cross-client compatibility the weakest link becomes the greatest determiner in what you can and can’t do in an email design. Especially as it’s extremely difficult, nigh impossible to segment your recipients based on what client they’re using. So, when it comes to sending through those shiny HTML emails Gmail and Outlook 2007 become those weak links that imform the way most of your design is hard-coded into the email. Question: So what do you do?
Answer: Table based inline css, and check the list of inline-options that you wish to use are supported (do what we did and printed off the Campaign Monitor’s article and stick it on your wall/foreheards).
Sure, you may have to spend a few more minutes adding code and feeling like a Neanderthal coder, but at least it’s going to deliver consistent brand integrity and professional results to your valued publics. Onward Ho!
~Rob
P.S. I just found this super article if you want a more comprehensive checklist when writing those HTML emails. It’s pretty old, but gives you good info on how to satisfy GMail and has some good practices in there. You know, just in case you had the itch for some helpful extra reading.
Brown Box has the expertise and service to help you maintain your customer relationships. It’s called MailBox - and many of our clients have great relationships with their customers from using it.