Skip to main content
CSS is fun and cool and I like it.
Article

All About mailto: Links

You can make a garden variety anchor link (<a></a>) open up a new email. Let's take a little journey into this feature. It's pretty easy to use, but as with anything web, there are lots of things to consider.… Read article

Article

Choosing a Responsive Email Framework: MJML vs. Foundation for Emails

Implementing responsive email design can be a bit of a drag. Building responsive emails isn’t simple at all, it is like taking a time machine back to 2001 when we were all coding website layouts in tables using Dreamweaver and Fireworks.

But there's hope! We have tools available that can make building email much easier and more like coding a modern site. Let’s take a look at a couple of different frameworks that set out to simplify things for us.… Read article

Article

On Paid Newsletters: An Interview With Adam Roberts of SitePoint’s Versioning

You don’t often think of email as something you pay to get. If anything, most people would pay to get less of it. Of course, there are always emails you like to get and opt into on purpose. We have a newsletter right here on CSS-Tricks that we really try to make worth reading. It’s free, like the vast majority of email newsletters. We hope it helps a bit with engagement and we make it worth doing financially by showing … Read article

Article

Visual Email Builder Apps

I bet y'all know that apps like Campaign Monitor and MailChimp have visual email builders built right into them. You drag and drop different types of content right into a layout. You edit text right within the email. It's nice. It's a lot nicer than editing the quagmire of HTML underneath, anyway!

But not everybody needs all the rest of the features that those apps bring, like list management and the actual sending of the email. Perhaps you have an … Read article

Article

The Tools of an HTML Email Workflow

Last week's ShopTalk Show was all about HTML Email. It's such a fascinating subject, as technically it is front-end web development, but it almost feels like a bizarro alternate universe.

We have dozens of browsers to worry about, they have hundreds of clients to consider. We worry about whether fancy new APIs are supported, they worry about whether padding is supported. We have grid layout, they have.... grid layout?!

It's tempting to make the joke: "It's coding like it's 1999!"Read article

Article

Inky and Slinky

Inky is kinda like a preprocessor for HTML created by Zurb, specifically designed for responsive emails.

I'm sure a lot of us have hand-coded HTML emails (I do it regularly) and know that it's typically <table></table> soup. It's not even just the tables that are annoying, but the fact that there are so many of them nested to do even fairly simple things it's hard to keep straight.

Inky's appeal is pretty clear from the first demo in their docs:… Read article

Article

A Guide for SVG Support in Email

We’ve talked about SVG quite a bit here on CSS-Tricks, but one area we haven’t quite touched on is email. Now that browser support for SVG is all in the green, it would be easy to assume that we can start using SVG everywhere. However, if you’ve worked with email before, you may know that it often follows way behind the web as far as feature support. You know, kinda the way California looks at North Dakota with trends: … Read article

Article

Override Gmail’s Mobile Optimized Emails

Many emails are designed with a large screen in mind. Text that looks great on a large screen can be difficult to read on a mobile device, though. If Gmail deems that the font-size of any text in an email is too small to be legible, it will increase the size and flag the message. That’s pretty nice. What could have been illegible is made legible, eliminating the need to pinch and zoom our screens. It can also be a little frustrating.
icon-link icon-logo-star icon-search icon-star