Developing static HTML emails is a pain in the butt. For best results, you need to inline all of your styles at HTML attributes instead of using real CSS (externally or inline). You also typically find yourself being very repetitive with your markup if you have a bunch of static emails that share common elements.
MailMatic to the rescue.
MailMatic is a Ruby gem, that is really just a mashup of tools, that aims to ease the burden of creating and maintaining static HTML emails. It uses StaticMatic, Haml, Sass, and Compass to let you author your HTML emails with all of the facilities you enjoy while creating your dynamic site: templates, partials, helper functions, inline Ruby code, reuse of markup and styles, etc. It uses Premailer to convert the HTML/CSS generated from Haml/Sass into self-contained HTML files that inline all of their styles. Premailer even gives you warnings about styles that may not work nicely in certain email readers.
Armed with this, you can accelerate your ability to crank out static HTML emails, and lessen the burden of maintaining them.
To get started with MailMatic, check out its installation and usage instructions on github at: https://github.com/scottwb/mailmatic.
Monday, August 15, 2011
Subscribe to:
Post Comments (Atom)
3 comments:
I'm working with haml for an email right now (not using mailmatic or any of its other dependencies) and it works great but for one thing: img tags aren't loading in Mail.app (and maybe other clients?) and I can't figure out why.
Have you had experience with resolving similar issues? I'm wondering if I need to tweak the encoding, etc.
If I look at the raw email in Mail.app, I see that my code was sent unencoded, as raw html. Mail.app renders all the tables, text, font styles, etc but images show as missing (indicated by that lovely blue box with ?). I notice other html emails sometimes encode the html somehow...
Nick, how are you rendering your Haml emails? Are you using the haml command line, something like StaticMatic, or Ruby on Rails and ActionMailer?
Also, what do the img tags look like in the output? I wonder if maybe you are using the image_tag helper and are getting relative src URLs instead of absolute URLs.
coding can be fun and hectic too! HTML is a simple language but one needs great practice and experiance to master it. i wanted to say that your blog is awesome!
Post a Comment