Technology : The Vision of Future: Working with HTML Emails

Off lately I have been working on html emails. i.e sending emails to users on submitting the form on website / newletters etc. These types of emails can be designed in two forms

Plain Text format
HTML based.

It was quite nteresting to build these emails. Because as HTML has reached to its 5th version and we cannot use any of its properties/tags here, we are required to use properties which were even deprecated in HTML4.

All I had to do was to google around the deprecated tags. Another interesting thing is you are required to use table based design here. I hate it! Email clients do not understand the new / clean div tags.

But still, at times its fun to search out the deprecated tags from our html store and use them in building up something really useful. Its like ‘Best out of waste’. ;)

During my study I found out many interesting practices that needs to be followed in email designing, Some of them are :

Keep Design Simple.
Take care that your emails are not sent to SPAM / JUNK folders of users.
Embedded CSS ( Internal CSS ) is not very well supported in newer browser-based email programs like Y!mail, gmail, windows live, Mac mail, AOL webmail.
Make sure you provide ‘plain text alternative’ in your mails. Use MIME Multipart Alternative content type.
Some email clients makes the links clickable , some wont so type out the entire URL if you want your user to visit certain webpage.
Give all image tags an ‘alt’ tag.
Wrap the email in 100% width table.
Do not allow width to extend beyond 600px.
All easy unsubscribing from your mailing list.
As IE troubles webdesigners , how can it spare emails ! Windows live Hotmail adds a few pixels of additional padding below images. We have a hack for it! : img{display:block;}

Resources:

Monday, December 12, 2011

Working with HTML Emails