Foundation for Emails 2.1: Supercharge Your Workflow

wrote this on in . 24 reactions

Foundation for Emails 2.1 Update Graphic

Foundation for Emails 2 has already changed the email workflow for thousands of people with a revamped CSS codebase, Inky markup to ditch tables, and a powerful workflow to stay D.R.Y. It makes coding HTML emails, well, easy. Today we are releasing Foundation for Emails 2.1 which further optimizes your workflow and speeds up coding. There are a couple new Inky components and more ZURB Stack magic to simplify your HTML email development and make you an email pro.

Beefing Up the ZURB Stack

Testing is a very necessary but time consuming process. Tools like Litmus exist to speed testing up so you can test many devices and email clients at once, but you still have to zip your images and send your email to Litmus for testing. But, what if you don't use an email service provider? How would you send the email to Litmus? Not to mention your images still need to be hosted.

To solve these problems, Foundation for Emails 2.1 introduces loads of helpful new features. The ZURB stack can now tie into your existing Litmus account and with a single command inline your code, optimize it (compress your HTML and images) and send it off to Litmus for testing. If you have an Amazon S3 account, the ZURB stack will replace your images with hosted ones so that they can be tested on Litmus. Foundation for Emails 2.1 helps you save even more time testing and preparing your emails so you can spend more time improving your product. Whether you have no email workflow or want to upgrade your existing one, Foundation for Emails has your back.

Huge, huge shoutout to Dan Van Brunt, @iDVB on GitHub and Twitter for setting this up and getting it across the line for this release! Give him a shoutout!

Just want to say thanks again for allowing me to help contribute foundations for email. I loved working with ink in the past so being able shape future of email development is pretty awesome.
- Dan Van Brunt

Expanding Inky's Features

Everyone we've talked to has had wonderful things to say about Inky and Foundation for Emails 2. Coding a responsive email template in ten minutes is no longer wishful thinking, but full blown reality! Foundation for Emails 2.1 brings two much needed new Inky components that speed up coding even more.

New Spacer Inky component: Vertical spacing between email clients is not as simple as it sounds, in fact, it's consistently inconsistent. Versions of Outlook don't respect margin and padding the same and <br>'s are different all over the place. Plus who wants to see <br><br><br> all over the place?

The new <spacer> component takes care of this. It works the same on all devices and email clients saving you time and headaches down the road!

The size is the height in pixels of vertical spacing you need.

Thanks to Antonin Cezard, @acezard on GitHub for the Pull Request to add this into Inky!

At first I had a custom jade+gulp workflow but when I saw you released V2 I switched to your stack. This type of tool is too hard to maintain alone so, glad to contribute in a long lasting project. I definitely look forward to make some more PR's in the future.
- Antonin Cezard

New Wrapper Inky component: The <wrapper> component was also added to allow the creation of full width rows, targeting elements in section and adding background colors. These new components save you time not only coding but also in testing.

Making beautiful fluid width headers is now a reality:

All the starter templates have been refreshed with these new components.

In addition to developing the framework, the Foundation team has spent the last several months crafting our ZURB Responsive Email Masterclass. It's loaded with everything we've learned on responsive email design and development so our students can approach any email design challenge. We're continuing to add content to the course so our students keep up with the latest best practices, techniques and workflows.

The Big Picture

We're super excited about the reception that Foundation for Emails and Inky have gotten, and want to talk a little bit about where they are going. We see a future where Inky becomes the standard for how emails get written, anywhere and everywhere. This involves integration into all of the different environments where people are sending emails (the much-requested rails integration is coming soon), and making it easy to extend Inky so that everyone can build their own custom open source and proprietary email components.

Email development should be just as simple as web development, where you can easily integrate open source components, extend those components with your own custom styles, and create your own custom pluggable elements. Just like a company builds up a library of custom, pluggable modules of code and components, they should be able to create a set of custom, pluggable inky tags that make generating brand-coherent, beautiful emails as easy as can be.

We're starting the discussion of what that should look like today: Please join the conversation in the Foundation Forum

See all the updates

Cantelope img
What's Underneath Matters: How MeUndies Increased Mobile Conversion by 40%
17 Web Design Trends That Will Take Over 2017
Container queries 2
Foundation & CSS Grid: Think Beyond the Page