HTML version of an e-mail message can be difficult to design as there are so many different e-mail client and operating system combinations – and they have a way to display HTML. And there is really no way you can know which client is used by readers to see messages.

If your reader has a Hotmail address you can usually be sure that you will read the message through the Hotmail web client. But what about readers, private e-mail addresses? Will they use Microsoft Outlook? Will this be Outlook 2000, Outlook 2003, or Outlook 2007? Or do you use Lotus Notes? What if your TLD email was forwarded to a Yahoo Account? And is he using a Mac or a PC?

Because you do not really know the answers to these questions, it's important that you always make plans more accessible to email campaigns.

Cascading Style Sheets (CSS) enables you to make e-mails extremely graphically and seductive. Unfortunately, it still has limited support for r css for many e-mail clients and different platforms. One of the biggest CSS offenders in Outlook 2007; and as the results show that up to 75% of e-mail readers use Outlook, you can not simply ignore their sorting errors.

Unfortunately, Outlook 2007 does not support floating elements that are widely used in CSS to accommodate objects. The basis for using a desktop based layout is to design e-mail campaigns. Think about web design around 2000. If you are a new designer and have never been to the tables, you can get a lot of information from W3C.

While Outlook 2007 supports the property, it recommends using it to attach the style sheet. At least 50% of readers turn off images, which means that the linked items will not be linked – this also includes the external style sheet. In addition, Gmail, Live Mail, and Hotmail do not support linked items, so it's a good idea not to use them anyway. Instead, define all of your styles in your message and do not rely on the external style sheet of your email messages.

Where in the message you have to specify that styles are another story. The live mailbox looks for the style sheet, Hotmail looks for the style sheet under the tag. Outlook 2003, Outlook 2007, AOL, Yahoo, Entourage, and Thunderbird accept placement, but Gmail does not accept anything.

The best option is to use online style tags. In-line style simply means that the style of each element should be individually defined. Instead of defining the style sheet in your mind, such as: 19459004

or something like this:

</p> <style type="text/css" media="screen"> <p><!-- p {"urn:schemas-microsoft-com:office:smarttags" /> georgia, serif; font size: X-small;} hr {color: # ff9900; height: 1px} a: jump {color: # ff0000; text-decoration: none} -&gt; </style>

specifies each element individually, such as:

This is the text of this paragraph.

When specifying these items, remember that not all CSS properties are supported on all e-mail clients. If you want to send a permanent message to all readers, regardless of how you read your emails, limit yourself to the CSS properties:

. background-color

. crossing

. color

. font-size

. font-style

. font-variant

. font-weight

. letter-spacing

. line-height

. padding

. table layout

. text-align

. text-decoration

. text-indent

. Text Transformation

These properties are supported for both Macs and PCs in


. Entourage

. Gmail

. Live Mail

. Outlook 2003

. Outlook 2007

. Thunderbird

. Yahoo

The properties to be avoided include:

. background image

. background position

. background-repeat

. border-collapse

. border-spacing

. bottom

. inscription-side

. clear

. clip

. cursor

. direction

. display

. empty cells

. float

. font-family

. height

. left

. list-style-image

. list-style-position

. list-style-type

. difference

. opacity

. Overflow

. position

. right

. to the beginning

. vertical-align

. visibility

. white-space

. width

. word space

. z-index

And now with worse news: Lotus Notes and Eudora have terrible CSS support and there are still many widely accepted CSS properties. And as more and more readers have access to emails on PDAs and other handheld devices, you will never be 100% sure how and where to read the message. Therefore, we recommend always using Multipart-Mime messages and always include a link to the text version within the html version of the message.

*** Would you like to keep these tips in hand?

Leave a Reply

Your email address will not be published. Required fields are marked *