This is a guest post from Marianne Cellucci of Net Atlantic.
When designing email newsletters and marketing campaigns, it is important that you consider the limitations presented by email readers. Many users, either by personal preference or email client defaults, are blocking images from being downloaded in the HTML-formatted messages they receive. Thus, it is a good practice for email designers to prepare for both image "off" and "on" scenarios. Here are some of the basics you need to know about using images in email:
Obstacles to Using Image-based Email Campaigns
Workaround for Image Obstacles
Keep your introduction text based. We recommend not using large banners or clickable graphics in the header. Since most recipients preview their messages in a small email preview pane, consider what the preview pane looks like when there are no images, and add a few lines of text that clearly states your message. This will be especially helpful to those recipients that elect to receive text-only versions on an email.Provide ALT text to describe images. As stated above, many recipients receive email with images blocked (perhaps by the default of their email client). To ensure that a brief image description is displayed in place of the image for those recipients who have their image reader turned "off" or the reader is set "off" as a default, use ALT tags (ALT text displays useful text before the image is loaded). This will give users an indication of what they will see if they choose to download images. Remember that ALT text must be able to essentially replace an image; and any meaning the image provides should be provided by the ALT text.Include photo captions under images. If you place the caption within the image, the message will not be seen if the images are disabled or blocked, so add a caption under contextually-important images.Do not use image-based emails. Avoid using multiple images. Since most image-based email is detected as spam, your message and content may never reach the recipient.Don’t use one large image as the sole content of your email. If your email consists of only one large image, or multiple images, and your recipient's reader has images turned off, the first thing they'll see is your unsubscribe link.Use smaller images to reduce load time. When sending embedded images by email, it's important to keep the image size small (under 25k) so they transfer faster and are more easily viewable by your recipient. Embedded images are a part of the message as opposed to linked images which reside on a remote web server. With embedded images, you are dependent on the recipient enabling image downloads on their email client.The advantage of uploading images to a web server is that they’re not contained in the actual email message, so there is no file size associated with the images that you are using in your email. By using an absolute path to the image being referenced (an absolute path contains the full URL: e.g., http://yourwebsite.com/images/imagename.gif), your image will load quickly, correctly appear in your recipient's email, and keep your email campaigns user-friendly…which will help you avoid the image spam filters and increase open rates.
MaAnna
Nice guest post by Marianne. I remember back in the day, when most folks still needed a coder to have a site, I had to create email templates for the lowest common denominator. At that time it was Gmail, which displayed the least fancy code. My how things have changed – and not. Now Gmail is one of the better online clients, but because of security issues and the popularity of reading email on the go, we are back to deliverimg emails in plain text.
Last year, that’s how I started delivering my emails. But several of my readers lamented how plain they were, so I switched to a more colorful template with a graphic header. You know what, I’m going back to simple text. The newsletters of every marketing guru I subscribe to is in plain text format. If their money is in their list and that’s how they deliver their info, then there’s something to learn from that.
Karen Runtz
Very helpful analysis. While images can dial up interest, they can also “pump up the volume” in less friendly ways. I’ve been careful about some aspects–ratios, alt tags etc. but I see there are other things I need to look at as well, such as the hosting, instead of embedding. You mention that “We recommend not using large banners or clickable graphics in the header.” That reminds me that I need to follow up on something with my email marketing provider: I’ve noticed that the “follow us on facebook” etc. icons show up as inordinately large text in the top part of the email. Definitely need to get this fixed.
Thanks for the information.
DeniseWakeman
Thanks for stopping by, Karen. Glad to know the information was helpful to you.