MJML

MJML

MJML

The Pros and Cons of MJML

Kristina Lauren

September 19, 2023

While email marketing still remains one of the most effective ways to reach customers, designing HTML emails that look great on all devices and browsers can be a daunting task. Fortunately, in the last few years, MJML has swooped in and changed the game. MJML is a markup language that makes it easy to design beautiful, responsive emails. It’s simple to learn, easy to use, and it’s quickly becoming one of the top go-to tools for email marketing. But if you’re still weighing the usefulness of MJML, here are some pros and cons to help you decide if it’s the right markup language for you.

What are the pros of using MJML?

1. It’s easy to get started with MJML

The idea of learning a new markup language may seem somewhat intimidating or at least time-consuming, especially for those who have never tried coding, but MJML is extremely easy to learn. In fact, it’s so easy that you can likely pick it up in under an hour as a total beginner or in even less time if you’re already familiar with HTML. This is because MJML uses very simple syntax and the documentation isn’t overly technical, making it straightforward for those who just want to start coding their first email right away. For example, if you want to create a button in MJML, you would use the component <mj-button>, specify your text, fonts, and colors with some inline CSS, if necessary, and you’re done. You can even generate social media icons for the most popular platforms when you use the <mj-social> and <mj-social-element> components. If you’re interested in a step-by-step tutorial on building a complete email in MJML, check out one of our previous blog posts.

2. Saves time

MJML being easy to use goes hand in hand with the language being a huge time saver. Coding emails with HTML can unfortunately involve a lot of complications, and using HTML alone to code emails will require extra work  for styling and responsiveness. Since external CSS and JavaScript don’t work in most clients, you may find yourself writing a lot of HTML code just to create something simple—if you’ve ever tried to code an email with just HTML, you already know how crazy nesting tables can get. Naturally, the more code you have, the more likely things are to get a little messy, which leaves the door open for silly mistakes to be made. With MJML, however, you can avoid many of the pitfalls that come with HTML email coding. MJML was created to provide responsive email design, which means less complicated code, and MJML is constantly updated to keep up with the latest email client changes.

3. Excellent documentation

Nothing is worse than trying to learn a new programming language without the proper tools or guide. Fortunately, Mailjet, the creator of MJML, went to great lengths to ensure the most important aspects of coding are covered. On the official MJML website, you can find a detailed guide on how to create basic email elements, like sections, buttons, and images, as well as community components. The latter is put together by other MJML users who have contributed to the MJML framework. Some of these contributions include code for creating charts or QR codes and new community components are constantly being added. We also explain many of the MJML components in-depth in our MJML cheatsheet.

4. MJML is open source

This means that MJML has been specifically designed to be accessed, modified, and distributed by anyone for any purpose. This collaborative model allows people from all over to use their expertise and creativity to consistently improve MJML, helping both new and experienced users benefit. MJML has a standard collection of components, but as mentioned previously, users can create their own components and share them with the wider community. You’ll find step-by-step instructions here on how to make your own custom components when you’re ready.

5. There are multiple ways to use MJML

When it comes to actually coding with MJML, you’re not constrained to any one platform.

Here are a few ways that you can use or install MJML:

  • https://mjml.io/try-it-live - Using MJML’s online editor, you can code directly within your browser.

  • Download the MJML app – this is a desktop app, so you’ll be able to use it without internet access and it comes with a live preview function.

  • Node.js – For those a little more experienced with web development, you can install MJML using npm.

  • Atom Plugin – Includes error-spotting and a live preview feature like the MJML app.

  • Visual Studio Code plugin – Ability to send emails with Nodemailer or Mailjet.

  • Sublime Text Plugin – Simply highlights MJML code.

  • Gulp plugin - Allows you to use your engine to render HTML if you have custom components linked.

Check out the MJML community page for more useful tools, libraries, and plugins.