Getting some Gmail attention

Tuesday, January 29th, 2008

Last year Gmail asked their users to contribute to a collaborative video featuring the Gmail 'M'. This year they are doing something similar with their story videos. These are pretty cool, a smart idea well executed.

Here at the Email Standards Project we're not above borrowing a good idea, especially if it could help get some attention from Google! We're going to put together our own video from photos you guys send in. Here's the plan:

Project Gmail Grimace

Step 1. Make a face: We want to collect as many as possible head shots of web designers showing the face they make when trying to get their emails to render properly in Gmail. We know that Gmail has a few issues, and we've all made some faces out of frustration. So grab a camera, a webcam, a set of crayons or whatever, and capture that moment when you really can't take it any more.

Step 2. Join the Flickr group: We've setup a Flickr group Project Gmail Grimace that is open to all. You should jump over and join the group, all free.

Step 3. Post your photo: Upload your photo to your own Flickr account, and go to the photo's page. Click the "Send to Group" button between the photo title and the photo. Then choose the "Project Gmail Grimace" group.

That's it! We'll start collecting photos and when we have a reasonable number, cut them together somehow and make a nice video message to hopefully attract some attention from the right people at Google. I'm sure that among all you Email Standards Project supporters there is plenty of talent who could help us do that. This is just a fun way to keep the momentum going and make ourselves heard. Everyone can participate - even if you don't have a Flickr account, send us your photos directly.

Project Gmail Grimace is go!

Posted in Email Standards | Comments Off

Hotmail Converts HTML to ASCII

Tuesday, January 15th, 2008

Some recent tests have lead to a discovery about how Windows Live Hotmail (Hotmail) processes and delivers HTML in emails. Following are the results of my exploration, covering the conversion, delivery and rendering process using our own acid test.

Because webmail isn’t a self-contained application, and can be accessed via most common web browsers, this post discusses cross-browser performance rather than cross-client performance. Specifically because browser performance is the variable in the findings.

The Conversion: HTML-to-ASCII

The first thing Hotmail does is convert all non-number/letter characters in the HTML to hex-formatted ASCII characters. So:

<h1>H1 headline (34px/1em)</h1>

Becomes:
\x3ch1\x3eH1 headline \x2834px\x2f1em\x29\x3c\x2fh1\x3e

And the source code is printed exactly the same (byte-for-byte) irrespective of the browser.

This has an impact on how emails render—not in every browser, just Safari and Microsoft’s own Internet Explorer. Regarding the latter, my guess is that this has something to do with an IE security vulnerability identified in the CVE dictionary, but of course I can’t say for sure. Why Safari doesn’t render the ASCII characters is also a mystery.

The Delivery: JavaScript innerHTML Function

Most popular webmail clients rely heavily on Javascript to print messages into HTML-based GUIs, and Hotmail is no exception. After Hotmail converts the HTML to ASCII characters, it prints the converted markup using the Javascript innerHTML function:

<script>document.getElementById("MsgContainer").innerHTML='[markup here]';</script>

And there is no alternative because scripting must be enabled to even log in to Hotmail.

The Rendering

While the markup prints the same across the board, IE and Safari renders the markup differently. Following are screen shots from Firefox/Netscape (same screenshot), Opera and Safari/IE (same screenshot):

Firefox 2 and Netscape 9

Opera 9

Safari 3 and IE 7

Notice how while Safari/IE do render the HTML in ASCII they do not render the CSS in ASCII. Yet if you view the converted message source you can clearly see that both the HTML and CSS have both been converted the same way. This is what I find especially perplexing.

I had considered that the meta character encoding or DOCTYPE may be different from one browser to the next, but as it turns out Hotmail delivers the same DOCTYPE and encoding across the board. There are some variables with browser-specific classes on the body and even a unique Javascript for Firefox; however, as far as I can tell they simply impact Hotmail design/functionality.

Conclusion

My research concludes that this issue is something which we can neither prepare for or remedy with special markup techniques. If you happen to be someone who understands how to force IE or Safari to render ASCII text, please feel free to share your comments below. In the interim, awareness is the key.

Posted in Email Standards | Comments Off