Jamie Sefton | Web Developer

Responsive Email Fail

Posted: 10th Feb 2015

This is a quick post and mainly a rant. Sadly the victim is ASOS in this example but it's not just them that have this issue.

My rant here is people who spend time and money creating mobile email templates / campaigns and yes they look great and do their job. But what bothers me is that most mobiles now have HD / Retina displays. Which means that when they put graphics and icons in their email templates they just look awful!

This can simply be resolved for icons by putting the fixed height and width as these won't need to be flexible. Then saving the original icon twice its size to give the retina image (2 pixels per standard pixel).

See the image below of a recent ASOS email sent through to me. This shows how blurry this looks on a retina phone.

The next issue that is going to effect the majority of websites is that these retina displays are starting to appear on desktop setups. This means that most websites that have lots of icons and images will start to look awful on these amazing HD monitors. 

So class this as the early warning to look at dealing with this. My way at the moment is the use of SVGs to make everything very clear!