Responsive Emails

Responsive Design allows us to adapt pages for different sized devices to give the user the best experience on their particular device rather than compromising between the two.

This is something that has been done in website design for a while now but more recently has been used in email deign too. This is essential because more and more people are checking emails solely on their mobile devices. Stats say 48% of email is now opened on a mobile device as of Feb 2014 (litmus). Thats almost half!

So how do responsive emails work?

We use media queries in the styles section which allow us to specify different styles at varying widths.

Onto an example

Top Dog Days email campaign:

On a desktop:

Screen Shot 2014-04-08 at 10.00.49


On a mobile:

Screen Shot 2014-04-08 at 10.01.06


You can see we optimize everything into an easy to read list and remove some of the less necessary images and the longer advert on the side. This eliminates the need for horizontal scroll meaning the recipient doesn't miss anything important on the page and has a better experience viewing the email.

Matt Scott

Web Developer

Matt Scott