HEML is an open source markup language for building responsive email that displays well across many different client devices. Anyone who’s tried to code responsive HTML for email knows what a tedious process that is.

That’s where HEML comes in. You just focus on creating simple markup. HEML renders it into responsive HTML that handles the quirks, bugs, and limitations of different email clients.

Compared to working in raw HTML, or even working in some drag and drop editors, HEML enables you to work at a higher conceptual level and be more productive. Yet if you have experience working with HTML, HEML will feel very familiar.

That simplicity is one of the reasons that HEML’s been making a great impression in the email and developer community. It has over 3500 stars on GitHub at the time of writing.

For the past couple months, I’ve been using HEML in several of my own projects. It’s really fun to use.

But as they say, it’s better to show than to tell—so I recorded a quick video walk-through of how to build a HEML email from scratch in just a few minutes. And as a bonus, I’ll show you how to turn the HEML output into a SparkPost template.

To recap, in this video, we:

  • Created a nice looking email newsletter in about 100 lines
  • Controlled layouts including images and side-by-side text blocks
  • Put in a fancy footer with a background image
  • Sent the mail and checked it looked good on Gmail
  • Learned some basics of working with HEML

It’s really that easy. If you’d like to look under the hood (err, bonnet), I posted a copy of the template I created in this video to GitHub.

I hope this video walkthrough has been helpful. Let me know what you think on Twitter—or leave comments on the video itself!

Steve

P.S. Want to learn more about HEML? Avi Goldman, HEML’s creator, recently shared the how and why of the HEML open-source project.