This week I spent implementing email templates and I would say it was kinda painful...😥
I built a part of template using Mailchimp builder, but then I got stuck because Mailchimp provides you a dozen of styled views, but it doesn't provide a bit more complex layouts (would be nice to have an opportunity to insert a simple table). So I exported Mailchimp stuff and continued manually.
The main thing I learned is that we must develop email templates with mobile-first approach because many mail clients don't support media queries. With mobile-first approach, the user sees mobile view on their desktop mail client without media queries support which isn't as bad as desktop view on a mobile screen.
Smaller tips I would like to follow the next time I will have to work on email templates:
- use tables to build complex layouts;
- use the most common CSS properties without any shortenings;
- use inline styles where it's possible (at least text font styles);
- use IDs instead of classes, it was easier to navigate through styles based on ID selectors for me.
Also, I wrote a simple server on Express.js that serves email templates populated with mocked data. It processes variables and simple if-else expressions only. It made development much easier than updating of template in Mandrill and triggering its sending via application each time you want to see how email looks with proper data.
Please, share tips you follow when developing email templates or tools you use for it. Maybe great email builder exists and my suffering was vain...😮
Top comments (1)
I had been given the task to create email templates for our company and I have to say it is a lot more painful than creating a website!