How to deal with the limitations (for now):
- Use the Foundation for Emails to build your templates. It will save you from dealing with all the tables you need for layout.
- Stick with single column layouts and large fonts. Otherwise, your content won't be readable in mobile clients.
- Text links are much easier than buttons. Litmus has a good guide to bulletproof email buttons if you can't live without them.
- Use a CSS Inliner so you can use CSS in a reasonable way while building and then inline the styles when you're done.
- Use Litmus to quickly test your email in all the major email clients
One positive for the limitations on email is that you don't have crazy experiences happening in your inbox. Not to say that there aren't some simple improvements that could be made.
I see the weakened capabilities of HTML email as strength for the web. If we had as much power in developing HTML email as we do with standards-compliant web browsers, we would see even more bloated and unusable design. The limitations of HTML email serve as a bulwark against recreating websites in email clients, which would have significant implications for what works well on the web (URLs, universality).
I say all of this as an implementor, having gone through the difficult process of designing responsive email templates, and having dealt with cross-client compatibility issues. I’ve coded with tables and inline styles. I hope HTML email never catches up to web standards, because it isn’t the web.
You mean you don't like doing layout using nested tables?
Good article! I just don't understand how Microsoft just doesn't get it when it comes to html/css rendering in Outlook, IE and even Edge. It's absolutely confounding.
I'm also wondering if the effort to make html emails is even worth the time and effort put into it. I've taken up to 8 hours to do a simple email just because the client insisted on using a custom webfont. The hoops you have to jump through to get it to degrade in Outlook is ridiculous.
Outlook won't even resize images via height/width attributes, it's a mess.