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

The Different Types of Webinar Emails and Why They Matter to Your Campaign

Webinars are one of the most engaging and effective demand generation strategies in the digital marketing toolkit. They can drive engagement with your products, inform your audience of important trends, and even teach new skills….

3 (Really Easy) Ways to Translate Content in Knak

As a marketer, you know that having a rock-solid localization strategy can do incredible things for your brand. You also know that executing on it is often a herculean feat that involves different stakeholders, contributors,…

Spotlight: AI-Powered Translations

Implementing a localization strategy is hard. In fact, language is one of the biggest barriers for organizations looking to tap into new markets. Think about the last time you visited a non-English speaking country and…