Creating Image Based Emails and Using Alt Text & Slicing
Many email marketers choose to use image-based emails to create a seamless and professional look for their email campaigns. You can do this too, if you know the right way to do it!
For starters, you will have to accept that initially your images WILL get blocked by the majority of email clients. Your customers can choose to accept these images later, but on initial receipt, the images will be blocked. If you understand this and the implications and you still want to use this tactic, then you are ready to proceed.
When you decide to send an image-based email, a great way to ensure that your customers hear your message is by including alternative text. Including alternative text for images is always a good practice, but becomes especially important when there is no other content for your recipients to see such as in image based emails. Alternate text will show up when an image is blocked and your customer will at least be able to read that small part of your message. This text can assure recipients that the email is from a trusted source and they will be more likely to view the images after reading it.
It is extremely simple to provide alternative text for your images with the Admail.net system. All you need to do is include your alternative text in the "Image Description" when you add the image to your message. If you are going to use HTML code to construct your email, you probably already know that you can include alternative text through the "alt" tag.
Another way to keep your image-based emails manageable is to avoid using one large image file. It is more prudent to slice the image into several pieces and then construct the image out of these pieces. Why is this a commonly followed practice? For two reasons: Primarily, because it makes the message more likely to be viewed. Several small files allow for an opportunity to include more alternate text and reduce the chance of tripping spam filters. Secondly, slicing allows you to make each individual section of your image a clickable link. Remember, image map code does not work in most email browsers, so slicing becomes a great alternative. We encourage best practices such as slicing at Admail.net. That is one of the reasons why our default image upload size is 40kbs or less per image.
Slicing an image is a fairly simple process that can be carried out by your company's graphic designer or anyone who is competent with photo editing software. You can also do it online here: http://www.chami.com/html-kit/services/is/ Make sure you uncheck the boxes that say 'enable links' and 'mouse over effect' unless you are an advance user. After making any changes on this page, including unchecking these boxes, you must click the “process” button for the changes to take effect. Once you've made your changes, click download. You'll be prompted to download a zip file which will contain your slices.
Now that you have a sliced piece of artwork that you would like to send, you may be wondering how to turn it into an email. The best way to handle imaged-based email creation is to have an experienced website designer or someone very familiar with HTML create a simple layout and then import it into our system. Another possibility is to modify a template for your needs. Simply insert the images in the arrangement you would like them to be. We suggest that you use as few slices as possible to keep this manageable. Slicing the image in half is usually enough. Through our own testing we've found that anything over four slices begins to get pretty complicated. You may need to change individual image alignment to get images to lay flush against one another. When you have one image above another you'll see that there will be a space between the two. Align the image on top with using the alignment tag "bottom."
If you are unfamiliar with the more advanced editing features of Email Builder 2.0, we highly suggest that you experiment with the system. By right-clicking on the layout view of the template, you can access a host of options that let your modify the template. You can copy sections and you split them into additional columns. Padding changes can be made by right clicking and choosing the modify option in the drop down. After a little experimentation, you should have a firm grasp on the layout editor, if not, you're welcome to call us and we'll be more than happy to walk you through it!
A great example of alternative text and slicing done right.