Email Design Tip of the Week: Gmail takes two steps forward and one step back

The benefits of continued testing should never be forgotten. While testing a number of email campaigns in Gmail we discovered that support has been recently added for the CSS background-repeat property and the HTML cellpadding and cellspacing attributes. While this doesn’t amount to a fundamental shift in standards support, it is still a step in the right direction. Sadly, it’s not all sunshine and rainbows since Gmail appears to be suffering from the same lack of support for paragraph tags that affects Yahoo Mail.

Let’s begin with the good news.

Support for the CSS background-repeat property arrives
Previously, any background images that were included in your email would always repeat (tile) in both the horizontal and vertical directions. This happened even if you used the CSS background-repeat property to restrict the image repetition in just the horizontal/vertical direction or specified the background image not to repeat at all.

Thankfully, support for the background-repeat property has been added. The previous workaround to combat this issue was to create background images that were much taller than their container elements. This resulted in increased file sizes for images and led you to hope that the content placed in your email would never exceed the height of the image and expose the repetition. The support for this property will allow you to be more efficient when cropping background images, reducing file size and unpredictability.

Please Note: The “background-image” CSS property is still not supported in Gmail, so the HTML “background” attribute must be used to assign a background image.

Code Sample
<td background=”bgimage.jpg” style=”background-repeat: no-repeat;”>
<td background=”bgimage.jpg” style=”background-repeat: repeat-x;”>
<td background=”bgimage.jpg” style=”background-repeat: repeat-y;”> 

Support for HTML cellpadding and cellspacing returns
When the Newer version of Gmail was released, support for HTML cellpadding and cellspacing went out the window. While this change didn’t affect everyone, it still caused spacing problems for email marketers using these traditional HTML techniques. This situation has improved and the Newer version has joined the Older in supporting these foundational HTML attributes.

Now for the bad news…

Support for HTML paragraph tags is lacking
The Newer version of Gmail does not support the use of HTML paragraph tags <p>. Paragraph tags are used primarily to create space between sections of text. If two sections of text are each contained within paragraph tags the space that normally appears between the paragraphs will be removed. In order to avoid this, break tags <br> can be used. Two break tags in a row will create approximately the same amount of space between text sections as a paragraph tag.

Code Sample

This:
First section of text.<br><br>Second section of text.

Will produce the same result as this:
<p>First section of text.</p>
<p>Second section of text.</p>

This week Google officially removed the “beta” distinction from Gmail. While this may signal that Gmail is ready for prime time, don’t expect email rendering to stay the same. As time passes, support for various HTML attributes and CSS properties will constantly change. Remember to stay vigilant in your testing efforts. We promise to do the same and we’ll let you know when the next shift occurs in the email rendering landscape.

Looking for an efficient way in ExactTarget to test the display and rendering of your emails across a multitude of email clients?
Try Inbox Preview powered by Pivotal Veracity. This tool allows you to preview emails in multiple desktop, web, and mobile email clients prior to sending your message. Learn More.


Tim Siukola
Manager, Campaign Solutions
ExactTarget Campaign Solutions Team