HTML Email Resources, compiled by http://clearbold.com
Last updated Feb 17, 2015 unless otherwise noted.
Lee Munroe's Things I've Learned About Email, For Web Designers and Developers is a comprehensive list.
I've referenced Ted's Cerberus templates for hybrid techniques. (5.12.2017)
I haven't actually used any of these, but here are some others: (^MR)
- Emailology
- HTML Email Boilerplate
- Ink: A Responsive Email Framework from Zurb
- If you've relied on Zurb Foundation for your web projects, they've now tackled email.
- Litmus added Comcast this year. I've found that hybrid mobile-first media queries require widths be set in min-width media queries to lock in full size layouts. (5.12.2017)
- I've also found inconsistent rendering of width + padding values in media queries compared to other clients. (5.12.2017)
- Bulletproof Email Background Images
- This technique (and tool to generate the necessary code) works, but Outlook 2007, 2010 and 2013 fall apart when you put two tables over the background image with
align=left&align=right, which is a popular technique for responsive email design.
- This technique (and tool to generate the necessary code) works, but Outlook 2007, 2010 and 2013 fall apart when you put two tables over the background image with
- Bulletproof Email Buttons
- Campaign Monitor
- ConstantContact
- We don't pay too much attention to ConstantContact. Last I looked a few years back, they did not support reusable templates or many of the great features offered by Campaign Monitor and MailChimp. ^MR
- MailChimp
- MX Toolbox
- If you're setting up email records to authorize delivery networks, MX Toolbox will validate those records & their syntax.
- How To Explain DKIM To Your Grandmother
- Campaign Monitor: Inliner
- We've relied on Campaign Monitor's CSS inlining for years, even in emails we hand off to blast via other services. ^MR
- Premailer
- Multi-Column Responsive Layouts (Campaign Monitor)
- I do things a bit differently here, converting my media query widths to 100% among other techniques. I'll try to get some examples posted. ^MR
- Responsive HTML Emails: a Different Strategy
- Fog Creek minimizes dependencies on media queries for their responsive email layout.
- Responsive Web Design Resources
- From Brad Frost's "This is Responsive".
- Linked links:
- This continues to trip me up. Linking a URL, such as clearbold.com, seems to immediately trigger spam filters. (^MR)
- Clearboldne.ws templates are in this repository. They'll need to be run through an inliner before sending. (See "Pre-flight - Inline CSS generators")
- The best time of day to send emails (infographic)
- Deployment Times
- Email Still Dominates Sharing
- Mobile vs Desktop (infographic)
- Litmus
- Litmus's virtual testing tools power those of many other platforms. For a while I've paid one-off fees to Campaign Monitor for access to email client screenshots. You get a lot more functionality working with Litmus directly, including the ability to live edit your code and refresh tests in supported email clients. (^MR)