19 January 2018
6435
8 min
5.00
The Right Ways of Email Image Processing
If you want your mailing to be effective, it’s important to compose the message that will attract subscriber’s attention at first sight. Email should be easy to read and attractively designed. A very frequent mistakes that happen with email campaigns are bleakness and aridity of content, so if reader see the message of this kind he will most likely delete it without reading.
The same email message may be accepted by readers in different ways, it depends very much on email design - how attractive it looks to subscriber.
If you want to express your mood in email and provide good-looking presentation of your product then email image is an element of priority importance to design messages for your mailings.
Why email picture is important when composing email?
- Email image background enhances the effect of your message. As a rule, recipient notices images first of all and accentuating his attention upon them; and only then he starts to read what is newcome email about. This way, email image is the best assistant to create an efficient image in one’s mind. Using properly chosen images for email composing you can emphasize the main subject of your message and build the image you need.
- People like to click pictures in emails, so use it - add link below the picture on your website. Make sure that link is not too long and has one-line position, otherwise it may be unclickable.
- Advertising of product works better when represented graphically by pics. A picture is worth a thousand words.
- It’s much easier to make your email or brand recognizable when you embed image into email. You can add corporate images, logos, photos of email sender - client will be glad to see the people he communicates with. The trick here is to detect did subscriber read your email or not; so the best choice is uploading your images to our service. This way you will get to know when subscriber downloaded pics and what message they were related to; therefore it means that he opened your email. (Many email clients are featured with auto download of pics).
- The trick here is to detect did subscriber read your email or not; so the best choice is uploading your images to our service. This way you will get to know when subscriber downloaded pics and what message they were related to; therefore it means that he opened your email. (Many email clients are featured with auto download of pics).
Some pitfalls of images processing for emails:
- It’s important to note that most email clients are blocking images, that’s why emails are often being displayed incorrectly. A common practice in the world of digital mailings is to add alternative text (also known as "ALT tag" or "ALT text") to each email image. This element specifies the text that will be displayed in email instead of image that might be not downloaded because of low speed traffic, broken link, browser settings etc.
ALT text is especially useful when design of your email is mostly composed of pics - it helps to get a sense of unloaded image.
- If images were not downloaded and no ALT text is added - your message will be unreadable. Client may just see a white page or block instead of pictures.
- When subscribers see ALT text in email - it's a signal to click "Show pictures" link
- "Big" email picture is evil. Big size has several different meanings. First of all, picture size is made of bytes. The larger is image, the slower it will be downloaded, for example when using mobile internet. Secondly, size means points (or pixels). It is best when real size is equal to image displayed in email. It often happens that 2000x2000 pixels image is compressed to 200x200 pixels. Such compressions are always inappropriate. Email image is downloaded slower and loses its quality.
- Don’t use 1x1 pixels pictures. Sometimes it’s more convenient to use a transparent 1x1 pic as email image background to fill the empty space. These images may cause spam markings. It’s quite easy to avoid this problem using 10x10 pics instead of 1x1 :).
- Misused picture may become your enemy: there are many email designers that suffer the utter filling of an entire message with images. Maybe it’s a good way to realize all the creative ideas, but on the other hand clients receive just a set of links if images are not downloaded. Use the text for important information and paste image into email to enhance the sense of what is said, or to attract readers attention.
- Blocks names should be textual, so they won’t disappear when transferred.
- If you choose the same one block to embed images into email - make sure that they have the same size and ALT text is added everywhere.
Bad:
Good:
Important points of ALT text processing:
1. It’s quite simple to add ALT text for images to email message - paste image into email using image tags; it belongs to the basic rules of HTML syntax:
<img alt="TEXT" height="149" src="logo.jpg" width="400">
An important point is to specify height and width of email picture because it affects the filling of ALT text field when images are disabled.
2. If you make ALT text too descriptive, subscriber may not need to click "Show images"
3. Make experiments with alternative text adding some built-in CSS to change font, color, size and background of ALT text, for example:
<span style="background-color: rgb(255, 255, 224);">
<img alt="TEXT" height="149" src="logo.jpg" width="400">
<div class="image-title" style="width: 768px;max-width: 100%; display: block; margin-left: auto; margin-right: auto;text-align:center;padding-top:5px;">
</div></span>
4. In all the email clients, support of stylized ALT text depends on what browser is used. For example, it will be displayed when you open Gmail message in Firefox but for Gmail with Internet Explorer is not.
5. ALT text with image link may be blue colored or underlined in some email clients. Yahoo! highlights ALT text in image links while Gmail underlines it and ignores the specified colors substituting blue (by default)
6. In many email clients alternative text disappears just when size or length of text exceeds width and/or height of image. So it’s better to prefer brief descriptions and smaller font size; this way ALT text won’t disappear.
FireFox:
Opera:
Chrome:
7. If you apply styles to ALT text, test how links are displayed in different email clients and aren’t your styles broken. Remember that "tricks with styles" sometimes really making emails look good, ...but always be ready for the worst case when ALT tags are displayed as a plain text instead of email pictures.
Of course it's great if readers added you to their address books or clicked "Always show images from ..." but it's better to be safe and following these simple advices when you paste image into email. Don’t forget that messages overloaded with information, pictures and text may be marked as spam, but we don’t need it, am I right?:)
PS: Read more, How to adjust image and add it to Viber mailing.