[searchbar]

How Knak Does Email: Using MJML to Improve Responsiveness

Responsive emails are designed to look good across any platform, on any device, whether it’s a mobile phone, tablet, or desktop.

Creating incredible emails is job #1 at Knak, so to make sure our emails look amazing no matter where they’re being read, we recently began using MJML.

MJML, short for Mailjet Markup Language, was designed to simplify the process of coding a responsive email. Basically, it allows for an intermediate markup language before rendering to HTML, effectively providing a way for developers to write high-level code for responsive emails more efficiently.

We were drawn to MJML for a couple of reasons:

  1. It’s open-source
  2. It’s component-based

MJML is Open-Source

HTML for the web is fairly standard and predictable. There’s an agreed-upon way to develop, and all web browsers more or less follow that standard.

With email, it’s a bit like the wild west. Emails render differently in Outlook, Gmail, Apple Mail, and every other email client, and every time someone releases a new version, the rules change and the framework needs to be updated.

These discrepancies have given rise to a host of niche email developers who know the workarounds and have developed coding techniques to make emails render properly. Unfortunately, the rest of the community has to develop that code on their own, making the email creation process labor intensive and potentially error prone.

The beauty of MJML is that it’s open-source under the MIT license so everyone can work together to make the framework better. Instead of one developer trying to figure out the new code requirements, a host of great email developers – MJML currently has contributions from almost 80 developers – use their collective knowledge to find workarounds and incorporate them into the framework.

Also, unlike the GPL license, the MIT license allows developers to use MJML in other applications without having to make the whole application open-source. This means that even if you integrate MJML into a different product, you can still contribute to the open source format and help improve on it.1

MJML is Component-Based

MJML is component based, which means we can create our own custom components for MJML at any time and slot them neatly into the rest of the framework. This is great news for our dev team since it helps us leverage our components library and code more efficiently. We’re currently using MJML to support these components for all major email clients:

  • Section
  • Column
  • Button
  • Text
  • Image
  • Social
  • Divider

We’ve also put our own adapted components in place to help meet the wide range of client needs that Knak supports, including a custom button component that outputs differently depending on the Marketing Automation platform being used.
As we move forward with MJML, we plan to add more of our own custom components to allow our clients to create very progressive emails.

You can find detailed support for each component on their FAQ site.

Stop Worrying about Responsiveness

MJML is well-situated to help scale email development into the future. Since we began using it, we’ve been able to leverage the lessons learned from many years of previous development while contributing our own expertise to the MJML community.

It’s been a game changer for Knak over the last several months, and we’re happy to continue offering our clients a way to build beautiful, responsive emails that look amazing no matter where they’re being read.

If you’d like to find out how Knak is implementing MJML into our emails, get in touch! We’re happy to share what we’ve learned and show you how we’re using it to deliver a best-in-class email creation experience.

Jack is Knak’s email development specialist and full stack developer. He works on the development team to bring innovative features that help improve the email creation process for Knak clients. In his spare time Jack loves skiing, biking, running, and exploring in the mountains.

Most Popular

Here’s what you need to know about designing emails for dark mode

What is dark mode? Dark mode is a setting available in most popular email platforms that partially or fully inverts the colours in your emails to give them a “dark” appearance. According to Android Authority,…

Knak ranks 107th among Canada’s Top Growing Companies

Knak is excited to announce that we’ve ranked 107th on Report on Business’ list of Canada’s Top Growing Companies of 2021. The Globe and Mail’s ROB ranks Canadian companies on three-year revenue growth. Knak earned…

Apple’s Mail Privacy Protection is dropping soon. Here are the four things marketers really need to do.

Each September, Apple holds one of its now-iconic events to announce new products and iOS feature updates. I’m a big fan and I never miss it. This year, though, “the event” will include news marketers…