Cascading style sheets and email display

HTML version of an e-mail message may be difficult to design because 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 will use readers to see messages.

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

Because you do not know the answers to these questions, it's important that you always make the plan more accessible to e-mail campaigns.

Cascading Style Sheets (CSS) allows e-mail messages to be extremely graphical and tempting. 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 when placing CSS objects. This is why the desktop based layout is used when designing e-mail campaigns. Think about web design around 2000. If you are a new designer and never deal with the tables, you can get plenty of information about W3C.

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

Where in the message you have to define the styles of 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 solution is to use in-line style tags. In-line style simply means that the style of each element should be individually defined. Instead of refining the style sheet in your mind, such as: 19459004

or something like this:

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

specifying each item individually, for example:

</p> <p x-small color> This is the text of this paragraph. </ p>

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 every reader, regardless of how you read your emails, limit yourself to the CSS properties:

. background color

. border

. color

. font size

. font

. font version

. font weight

. letter center

. line height

. cushioning

. table layout

. text alignment

. text decoration

. text block

. 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

. boundary distance

. lower

. caption page

. pure

. clip

. cursor

. direction

. appears in

. empty cells

. floating

. font family

. height

. left

. list-style-image

. list-style-position

. list-style type

. margin

. opacity

. overflow

. position

. right

. top

. vertical alignment

. visibility

. white space

. width

. spacing

. 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, I suggest you always use Multipart-Mime messages and always include a link to the text version in the html version of the message.

*** Do you want to keep these tips?

Source by Karen Scharf

Leave a Reply

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