We've written before about the importance of responsive design for email. With over 40% of emails being opened on mobile and 80% of mobile users saying they'll delete an email if it doesn't look good on opening, it's pretty evident that mobile can't be ignored, even in the table-ladden pain in the butt that is email.
There are two main methods of creating responsive emails (other than hand-coding each one individually): templates and frameworks. Both offer the advantages of making your content available to audiences on a number of different platforms and clients, but take very different approaches.
Templates: Attack of the Clones
Templates are by far the most popular approach, with many options out there to choose from. They're quick to implement, require little technical know-how to set up and can lead to decent results with minimal effort. Because templates only have to accommodate a single layout, they're not very flexible, but do their one job fairly well.
One-off templates have many limitations. Templates, by nature of their construction, don't necessarily allow for a lot of customization. As a result, their lock-in cost is fairly high (good luck trying to turn your two-column template into three), and cookie-cutter templates tend to make everybody's emails look the same. The numerous tradeoffs involved with using templates are why we chose frameworks as our current responsive method of choice.
Frameworks: A New Hope
"Framework" is a rather broad term, and one which people often used somewhat ambiguously. As we define them, frameworks are collections of reusable code and design patterns that give users a solid, tested base on which to build. Ideally, frameworks should speed up the initial coding of a design without forcing the user to use one particular layout or visual style.
In addition to laying out what a framework is, it's pretty important to establish what a framework isn't. A framework isn't "design in a box" or a quick fix. You can't just bolt one on top of an existing design and expect responsive, pretty results. Frameworks also don't have to completely depart from your current style (though they're a good way to get a fresh start). A good framework should be flexible enough that you can recreate (or come close to) an existing layout or visual style.
Why Frameworks are Right for Us
While frameworks require more up-front work than simply modifying a template, we feel strongly that they're the right approach. We've invested a lot of time and effort into what we see as a long-term play. Consistent code structure and styling will make modifying our layouts easier in the long run.
Not only does consistent code style make jumping into a framework easier, but basing it on a framework's functional principles, rather than an opinionated style guide, makes its code much more intuitive. This intuitive consistency makes it much easier to collaborate on our code, even when we bring in new team members. On top of that, when we want to experiment with new layouts, we know that we have a solid base behavior and consistent rendering on all clients, instead of having to reinvent the grid every time.
Building Our Own Framework
Ready to fully buy into the idea of building our emails on a framework, we excitedly rushed to the internet, only to find that … well … there aren't any responsive email frameworks that live up to our expectations. We wanted something that was fully responsive (obviously), easy to understand, flexible to build with and looked great on the latest, greatest retina screen iOS devices, without sacrificing support for our email subscribers who use Microsoft Outlook (or other, ahem, limited email clients).
Disappointed yet determined, we decided to build our own, and are all the happier for it. We're a group of passionate experts who live, breathe and design responsive. We have a strong track record of building and supporting great open source frameworks. Building on top of our previous success in responsive emails, we're excited to announce our brand new, super-duper responsive email framework, affectionately known as Ink, which launches soon (like soon).
Don't Just Build — Create
Ink is the first responsive email framework of its kind, and will make it easier than ever to build beautiful, functional emails that look great on any client (even Outlook). This framework is a bit more work to build a layout on top of Ink than to just drop your content into a pre-made template, but Ink offers a level of flexibility and code consistency that is unmatched by any template. Ink lets you focus on designing the best experience for your users and creating meaningful, engaging content, instead of spending all your time perfecting your low-level implementation details.