Jan
14
2009
We all know that HTML emails are more apealing and produce higher clickthrough. So what is the big deal with HTML? Why do the spamfilters hate them so much?
This post explains some of the basic HTML email techniques used by spammers to hide the real content of the email.
The filters can not see the emails in the same way we see them. They only see the sourcecode and they can only guess what it looks like within the email client.
For example:
to the filter will look like:
<table border=”1″>
<tbody>
<tr>
<td>cell 1</td>
<td>cell 2</td>
</tr>
</tbody>
</table>
Knowing this, a keyword based filters can be easily tricked as they, are looking for particular keywords within the email. For example if a word “viagra” apears in the email it is most likely to be blocked. However breaking this word into 5 cells of a table will make it impossible for the filter to recognize the word.
Example:
will be seen as:
<table border=”0″>
<tbody>
<tr>
<td>v</td>
<td>i</td>
<td>a</td>
<td>g</td>
<td>r</td>
<td>a</td>
</tr>
</tbody></table>
So unless “<td>v</td><td>i</td><td>a</td><td>g</td><td>r</td><td>a</td>” is in the spam keyword database it will be percieved as a simple table with random letters.
This is the very basic way to trick the spamfilter and it is very unlikely that any of the up-to-date filters will let it through. However this is a great example of what the spamfilters have to put up with when dealing with HTML.
1 comment | tags: HTML email, SPAM, spam filter, spam techniques | posted in HTML email
Jan
8
2009
Text:Image ratio
- Emails containing large amount of images get a high SPAM score as the images can be used to hide SPAM messages. I suggest using at least 80:20 text:image ratio. If it is necessary to use a lot of images, there are techniques to make them less harmful.
- Always optimise the image file size. Make sure you use GIF and JPG correctly to get the lowest file size. Use JPG only for photos and images containing gradient colors. GIF – for plain sharp images.
Layout
- A standard email should not be wider than 600px.
- <table> is the most appropriate form of email layout.
CSS
- Go easy on CSS! There is absolutely no need to use CSS excessively. There is a thin line between an email that reaches the recipient and the email that ‘junks’. Many leading email clients got a poor CSS support. For example Outlook 2007 is using MS Word HTML rendering engine which means basic CSS support, no background images etc.
A great article by CampaignMonitor about CSS support across different Email Clients:
http://www.campaignmonitor.com/blog/archives/2006/03/a_guide_to_css_support_in_emai.html
Link to HTML
- Never assume that the email will look exactly the same on all email clients even though you did all the necessary tests. Always include a “view online” or “can’t see this email?” link at the top for those that are struggling to see your message.
Multipart Email (HTML and Text)
- If possible always send multipart emails. If the recipient can’t see the HTML he will see the Text email. Think about those that use handheld devices to read their email!
Images
- Always use full path for the images.
For example: <img src=”http://yoursite.com/image.jpg” /> instead of <img src=”image.jpg” />
- Never put important information into the images. When designing an email always think what will the creative look like with the images missing, because this is what most recipients will see before pressing on “Download images”
- Alt tags are very important to describe the missing image. Never use spam messages in the alt tags like “Call now to claim your FREE DVD!!!” etc.
Image size parameters
- Be aware of what the missing image size parameters will do to your design. Also keep the filename neutral (don’t use “click_here.jpg”)
Image format
- The image format itself does not affect the email delivery in any way. It’s the image size that matters. Images containing solid colors should be saved as GIF’s and gradient images (photos) should be JPEG, JPG, PNG.
Can’t see this email?
- It does not matter how well you designed the email. There always be someone who is using a prehistoric email client and can’t see anything.
Source Code
- Keep the source code as tidy as possible. Remove all comments.
- Make sure the URL is as neutral as possible. www.your.site/greatfreeoffer.html. Make sure that the landing page URL is not Blacklisted. Happen to me three times so far when I spend hours of trying to resolve deliveribility issues by adding text and removing images when in fact the clients website was blacklisted.
“Textual links should be colored and underlined to achieve the best perceived affordance of clickability” Jakob Nielsen has written a great article about link colors. It is good practice to keep the URL’s blue as everyone will know that this is a link. This helps when dealing with “click here” buttons. Example “click to visit our online shop” can be changed into “visit our online shop”. It is a clear call to action that can not be misunderstood.
http://www.useit.com/alertbox/20040510.html
Unsubscribe link
- It is a legal requirement
12 comments | tags: can't see this email, email CSS, email layout, email source code, guidelines, HTML email, image rendering, multipart, text:image ratio, unsubscribe, view online | posted in HTML email