CSS

Gmail HTML Email Development: Why Your CSS Is Not Working (and More) 

In the ever-changing world of email marketing, understanding the ins and outs of Gmail is paramount. We probably don’t have to tell you that a lot of people use Gmail… but we will. According to Sinch Mailjet’s new report, The path to email engagement 2024, 71% of consumers in its global survey said they have … Continue reading “Gmail HTML Email Development: Why Your CSS Is Not Working (and More) “

Let it Snow: How to Use CSS Animations in Holiday Emails

The holidays and little surprises go together like hot cocoa and marshmallows. Looking for a way to add a little extra joy to your holiday email campaigns? We’ve got the perfect inbox stocking-stuffer. It’s been five years since our friend Jay Oram of ActionRocket showed us how to create animated falling snowflakes in an HTML … Continue reading “Let it Snow: How to Use CSS Animations in Holiday Emails”

Looking for an Email Renderer? Here’s What You Need to Know

As human beings, we all see the world differently, right? The way you interpret a story, a song, or a painting will be different from your friend’s interpretation. While email clients are far from human – they are a little bit like that too. Gmail, Outlook, Apple Mail, AOL, and Yahoo Mail – they all … Continue reading “Looking for an Email Renderer? Here’s What You Need to Know”

Notes from the Dev: Using CSS Variables in an Interactive Wordle Email 

Interactive emails are showstoppers that really help you stand out in the inbox. But they’re not easy to pull off unless you’ve got some serious email coding skills. In this episode of Notes from the Dev: Video Edition, we’ve got just the guy (or bloke) for the job. Jay Oram of the digital agency ActionRocket … Continue reading “Notes from the Dev: Using CSS Variables in an Interactive Wordle Email “

Conditional CSS for Email: What Developers Need to Know

An HTML email that renders perfectly in every client is a developer’s frustratingly elusive white whale. While many email clients have improved support for certain features over the years, there are still a lot of differences that make it impossible to create an email that looks exactly the same across every device and client. But … Continue reading “Conditional CSS for Email: What Developers Need to Know”

Notes from the Dev: How to Use Faux Absolute Positioning in Email

Here’s a tight spot that email developers will be very familiar with. You get an email campaign mockup from a designer and in order to make it both functional and accessible, you need to use overlapping elements. As developers, it’s our job to make the email look as close to the proposed design as possible. … Continue reading “Notes from the Dev: How to Use Faux Absolute Positioning in Email”

How to Develop a Responsive HTML Email in 3 Steps

You’ve created a great HTML email layout. At least, it looks good on your computer. But what if your email subscribers open your email marketing campaign or email newsletter on a mobile device?  Chances are, if you haven’t coded your email layout in a mobile-responsive way, your message will be garbled on your subscriber’s screen. … Continue reading “How to Develop a Responsive HTML Email in 3 Steps”

How to Use CSS Animations in HTML Email Design

Your team wants the next email campaign you code to stand out from the crowd, and they’ve asked you for an upgrade on simple static images. Now it’s your move on how to implement animated emails. After all, you can choose from so many different options, like animated GIFs or CSS animations. We’ve talked about … Continue reading “How to Use CSS Animations in HTML Email Design”

The Best Email Development Tools for Fast and Flexible Coding

In the sometimes perplexing and confusing world of email marketing, the email developer is like a hero with superpowers who swoops in to save the day.  But of course, Batman has a utility belt and a Batcave full of stuff while Ironman’s got an endless supply of technology at his disposal. The right email development … Continue reading “The Best Email Development Tools for Fast and Flexible Coding”

Email Coding 101: How to Use HTML, CSS, and MJML

Cookie-cutter email marketing is easy. The downside, however, is that doing things the easy way means a lot of other people are doing it that way too. You’re here because you want to do more with email coding. You have ideas. You want to take things further. You’re ready to learn some code and try … Continue reading “Email Coding 101: How to Use HTML, CSS, and MJML”

Web vs. Email Development: The 11 Biggest Coding Differences

“It’s just HTML. How hard could it be?” Those are the famous last words of many web developers who’ve been asked to code an email campaign only to discover that, when it comes to web vs. email development, there are some major differences. If all your experience is in building websites, knowing those differences will … Continue reading “Web vs. Email Development: The 11 Biggest Coding Differences”

Interactive Emails: 5 Exciting Ideas and Examples to Try

It’s tough to imagine, but there was a time when you couldn’t do much with email besides delivering plain text. So much has changed since the invention of email, and the marketing medium continues to present new methods for reaching subscribers in innovative ways. Interactive emails are just one example of how email has evolved … Continue reading “Interactive Emails: 5 Exciting Ideas and Examples to Try”

How We Created Our Interactive Scrolling Halloween Email

We sent a scrolling Halloween email featuring a person on a journey to deliver an email. This article goes into the nuts and bolts of creating this email. 

Which Code Should I Include in Every Email?

Learn how to build email code properly to help ensure your email displays correctly on every device and client. 

CSS Background Images Now Supported in Outlook.com

Using background images in email is easier now that Outlook.com and Office 365 Outlook (OWA) has started to support CSS background images. 

How to Build an Interactive Quiz in Email

Learn how you can build interactive games, carousels and product filters in email using an interactive quiz technique. 

CSS Targeting for AOL Mail

If your design needs some tweaking in Aol Mail, here are two techniques you can use to target your fixes just for this email client. 

The New Yahoo! Mail and How to Target It

Yahoo! Mail just released an update. Learn what’s changed and how to target the Yahoo! Mail email client in your designs. 

Gmail Announces Support for Embedded Styles and Media Queries

Gmail has long been a thorn in the side of email developers everywhere.
This client’s lack of support for embedded CSS (in the <head> of an email) has
been the main reason that all styles must be inlined before sending.

No longer! Gmail is about to make a major update to how their email client handles code. Read on to find out what changes will be made and how it might affect your emails.

Tutorial: CSS Fixed Positioning in Interactive Email

This article shows off a fun example that we created and shows how you
can create your own interactive email that takes advantage of fixed
positioning.