Pictureless perfect: how to build emails which look good when images are blocked

Image blocking has always been a challenge for email marketers. Some email clients hide images by default, leaving your beautifully crafted newsletter as little more than a few stray alt tags scattered around in white space. So how do you make sure your emails look presentable when stripped of their images? Let’s rule out some ideas which don’t work before we look at those that do. Embedded images Adding images to a web page doesn’t necessarily mean linking to an external file. It’s possible to use a data URI instead and paste the image data right there in your HTML document. There are drag-and-drop online converters which can generate the data for you. Just feed them an image and they’ll…

How to create hi-res retina images for email

While the world of email might be a a few years off from implementing something like SVG images there are a few tricks you can do to ensure you have high or at least higher quality images in your emails. The technique described here works best for small images, icons, or single colour images. During the testing process I noticed that serving images even slightly larger in size did have quite a noticeable image quality improvement on the retina screen. What we can learn from this is it’s not always necessary to supply exactly the right amount of pixels for the retina screens just try and get as close as possible. For this example I’m going to make a logo…