Responsive Emails

Responsive Newsletters

Where details can make a difference

In my goal to make every newsletter up to today’s standards, I created a lot of responsive newsletters for various clients. All tested in over 15 different e-mail clients, both web (i.e. gmail, yahoo, outlook.com), mobile (i.e. iphone, android, Windows phone) and desktop (i.e. Outlook ’07 ’10 ’13, mail). Using Litmus, a robust email testing tool, as my brother in arms.

The fun thing about building newsletters is the challenge in making it look good on all devices and e-mail clients, and pushing the boundaries where you can. This means creating tons of fallbacks for old email clients relying on old-school code, while using new techniques for modern devices.

Some examples for optimising your newsletter

  • Gif animation on modern devices

    Gif animation on modern devices

Creating that wow effect

A lot of email clients don’t support many techniques. But popular modern devices actually do. This gives you a opportunity to be creative and create an email experience which most people aren’t used to. a simple GIF or a interactive email can make you look cool in the inbox. Just make sure to create fallbacks

  • Good: A fluid email deisgn which scales proportionally  with the preview pane

    Good: A fluid email deisgn which scales proportionally with the preview pane

  • Wrong: Snaps to a small version after a certain point

    Wrong: Snaps to a small version after a certain point

  • Wrong: Doesn't respond until really small screen size

    Wrong: Doesn't respond until really small screen size

Don’t underestimate the preview pane

A lot of newsletters I receive look weird in the preview pane. All thought I view almost all my incoming mail in that window, and I’m not the only one. It’s because these newsletters get optimised for either big viewports or really small (like mobile devices). That’s why I always try to make a newsletter fluid, so it will look good on every device or screen size.

This is a unique website which will require a more modern browser to work!

Please upgrade today!