Hot Rum Cow

When we see responsive email designs in the wild, it makes us happy. But when we see an email that’s not only looks great on mobile devices, but also covers some of my personal loves (cocktails and magazines that smell like books), then two words come to mind - ‘gallery worthy’.

This announcement for Hot Rum Cow magazine, designed by White Light Media and built by Binary Vein is a by-the-book example of responsive design in practice. As Adam at Hot Rum Cow explains:

The ‘Twitter Mobile Makeover’ in the Guide to Responsive Email Design really did it for me. It assured me that if we built a responsive website, we also needed responsive emails. It also had me interested in code all of a sudden - not my usual day’s work.

Despite being ‘not a usual day’s work’, this design shows mastery over mobile tricks and techniques, including code to prevent phone numbers and addresses from turning blue. The source code is well worth a look if you’re interested in what it takes to build a mobile-optimized design from the ground up.

Overall, the warm colours, great imagery and code that makes up this design makes me feel as good as a sip of hot toddy… Cheers, guys and gals!

Designed by White Light Media
Posted by Ros Hodgekiss

6 Comments

  • Robert
    30th August

    Sorry mates, but I don’t see the responsiveness at all… How does it adjust to different screen sizes? :/

  • Ros Hodgekiss
    30th August

    Hey there Robert, if you were to receive this newsletter on your mobile device, you would likely see a version that’s optimized for its small screen dimensions. Be sure to check out our Guide to Responsive Email Design to see more examples and find out how this is done :)

  • Adam
    30th August

    Thanks for the mention Ros. Working on the next one now too.

  • Proov
    30th August

    do u know what typeface is used for “newsletter” ? ^^

  • Ros Hodgekiss
    31st August

    Hey there Proov, you’ll find that Georgia is used for headings and Arial for body text :)

  • jimmy
    15th September

    i recently coded set of responsive email templates,plz check out here

    http://www.mojo-themes.com/item/shopmail-product-offer-responsive-email-template/

    As discussed above i used various techniques for mobile optimization such as Attribute selectors for writing css for media queries, code to prevent phone numbers and addresses from turning blue

What do you think?

Sign up for free.
Then send campaigns for as little as $9/month

Create an account