This week we’re focusing on email rendering in Gmail. Gmail, like other web-based email clients, is constantly evolving. These updates continually change the way HTML emails are rendered. Not only do email designers need to pay special attention to Gmail, they need to be aware that their Gmail subscribers may be seeing one of two different versions of Gmail. Depending which browser and version you are using, scroll to the bottom of your account and select the “older version” link to test that version of Gmail. To revert back to the newest version, select the “newer version” link in the top right section of the account. Below are some great tips to consider when building your email campaign in order to create the best experience possible for Gmail subscribers.
Image Blocking - Alt Tags
Images are blocked by default in Gmail. Gmail does display stylized “alt” tags, so add those to your design when it makes sense to help create brand synergy.
CSS
In both versions of Gmail, CSS must be applied inline. External or embedded CSS in the head of the HTML will be stripped out.
CSS Borders
The newer version of Gmail has difficulty rendering CSS borders in IE8. Occasionally, 1-2 pixels of white space will be added to the left or right side of the content enclosed within the border. This issue affects some designs more than others, so if you have a particular element that depends on symmetry, test both old and new Gmail versions to ensure your design renders properly. If CSS borders are giving you trouble, you may want to consider using a background color combined with a spacer .gif to create the same look.
Background Images
Background images are supported in both versions of Gmail. However, the “background-image” CSS property is not supported, so the HTML “background” attribute must be used to assign a background image. Previously, there were issues using the CSS property “background-repeat”, but that property is also now currently supported.
Gmail Themes
Gmail introduced the concept of “themes” this year, which allow the user to select different combinations of background colors, text and link colors to personalize their inbox. Some combinations may render light text on a light background, or dark text on a dark background. The bottom line: you must specify background, text, and link colors in your HTML, or they may be changed in accordance with your subscriber’s Gmail Theme.
Testing
Always be sure to test in major web browsers like Internet Explorer and Firefox, and remember that there are both newer and older versions of Gmail. Gmail is a great client to test first when finishing your campaign, as it exposes rendering problems and is unforgiving of any HTML syntax errors.
Personally, I love using Gmail — it has great features including shared docs, calendars, folder organization tools and other interactive capabilities, so let's make sure our subscribers continue to have a great experience in Gmail. Portions of this blog, Design Tip of the Week: Email Rendering in Gmail, and more information on email rendering can be found in our whitepaper "Email Marketing Design: The New Essentials”.
Beyond Deliverability: Consumer Choice & Control
Addressing Email Security Concerns
Technology Solution
Best Buy


I'm vegetarian. At this point, some of you will stop reading because you are baffled by people like me. No hamburgers? No hot dogs? No Beef Stroganauf (yeah I don't have any idea how to spell that)? Nope.
I had signed up for newsletters and fan clubs. I got the coupons from online retails and bookstores. I even thought that I sent a decent amount of email in a given day. But, I had a lot to learn.
