Problem 
When composing and previewing an Email in the SiteOrganic Email Newsletter engine, the message may look the way you intended.  However, when you send yourself a preview and view the message in an Email software platform such as Outlook, Yahoo, Hotmail (Windows Live Mail), etc., the message does not look the same.  Fonts, layouts, and other styles may be changed.

Cause 
SiteOrganic Websites are created using a standards-based design approach.  This means that the Website uses Cascading Style Sheets (CSS) to govern the visual layout and appearance of text, links, images, and other interface elements.  The same CSS that applies visual appearance traits to your Website is used when editing your Email messages.  However, when other software is used to view your Email messages, support for CSS and standards-based design may vary.  This creates a disparity in the appearance of your message.

Solution 
There is no one method that can ensure visual parity across all Email programs.  However, we generally recommend using a table-based layout with inline styles when creating your Email messages.  All text should be contained within one or more tables, and font definitions, colors, etc. should be explicitly defined within the HTML code.

This method is far more tedious and "heavy" than using CSS, but in the current state of software, it is the most reliable approach.

Additional Reading
We encourage you to read other online articles about good Email design, including these links (NOTE: sources are not affiliated or endorsed by Edge Media, Inc.):

• http://www.campaignmonitor.com/blog/archives/2007/04/a_guide_to_css_support_in_emai_2.html
• http://www.email-marketing-reports.com/format/html-css/
• http://www.sitepoint.com/blogs/2007/01/10/microsoft-breaks-html-email-rendering-in-outlook/

Article ID: 45, Visibility: Public, Status: Published, Created On: 4/21/2007, Modified: 4/21/2007, Last Reviewed: 7/21/2010