10 HTML Email Coding Tips

submitted: Jul 31st 2008 | by: Drake | Total views: 307 | Word Count: 647
Bookmark This | View PDF | Print View | Html

When creating the messages for your auto responder there are a few points that you should consider. The last thing you want is for your message to end up all distorted by the recipient's mail service or and up in the SPAM box! Here are 10 good practices to follow when creating your messages:

1.    Code HTML emails in a plain-text, no-frills editor. This will output the cleanest possible code, plus let you easily produce plain-text emails. Do not use WYSIWYG editors or expect Microsoft Word to export clean HTML code. As a matter of fact, a number of spam filters will actually throw your messages into the spam box if they were created in Microsoft FrontPage (since spammers do that a lot). Use something like NotePad or TextEdit (default programs on your PC or Mac) or acquire something like BBEdit, or NoteTab Pro.

2.    Don't use an excessive amount of Cascading Style Sheets (CSS). If you do use CSS at all make sure to use embedded CSS as much as possible, and avoid CSS positioning. Use tables to position your text and images using cells.

3.    Design for the preview pane. You can assume that it's going to be much less than the typical width you design web pages. Less than 600 pixels is a good guideline. Align content to the left. A few preview panes are skinny and vertical (AOL gives about 200 pixels of width). Be sure your logo and important content "peeks" out on the left side of your template.

4.    Don't use JavaScript, ActiveX, Flash, embedded video, sound files, or DHTML. Hackers commonly use these as vehicles for viruses and so anti-virus programs will block them. Depressing I know for the artist within you but the simpler the better in this case.

5.    Unless your autoresponder hosts your images for you, you will need to code your HTML emails using absolute paths for your images (e.g. http://www.mysite.com/image folder/image.jpg).

6.    Webmail clients (Yahoo, MSN, Hotmail, Gmail, etc) typically remove any HTML code above and below (and including) the <BODY> tags.

Therefore:

              - BODY BGCOLORs won't work. Create a 100% wide table with your bgcolor, and embed your template inside that.

              - Any embedded CSS inside your <HEAD> tags will not work. Embed your CSS below the <BODY> tag, just above your content.

7.    Just about ALL email programs block  your images by default. The recipient has to click a button to "display images." This is a default feature in most cases, and can't be turned off. And most recipients have to be really motivated to click that button.

Therefore:

              - Don't design HTML emails that are nothing but one big image. Recipients won't see anything (and spam filters can't read any content, so they'll assume it's spam).

 - For those of you who use open reports, use them sparingly. Open tracking involves placing a tiny, transparent .GIF in your email, then calculating how many times the image was downloaded. If your recipient    doesn't turn on images, the graphic won't be downloaded.

8.    Always include a plain-text version of your emails as a MIME attachment. Any email service will definately be able to display that version if your recipient can't (or won't) view HTML emails.

9.    Understand CAN-SPAM. You should always include your contact information in your footer (your name, contact email, website address, etc) and include an opt-out link. Autoresponder programs like the Millionaire Geeks Autoresponder Unlimited offer a link code for an unsubscribe link to place in your emails.

10. Test your HTML emails like mad. Sign up for as many email services as possible, and download as many email programs and spam filters as possible. You may need to setup a test computer(s) in your office to do all this testing. 

Follow these practices and you should be well on your way to having a successful email campaign!

About the Author:

Drake is a web design specialist who has been in the field for over 2 years now. Drake has expertise in HTML, Flash, PHP, MySQL, and much more! He is also the Co-Founder of Millionaire Geeks.

Article Source: Articles - Millionaire Geeks

No comments posted.

You do not have permission to comment. If you log in, you may be able to comment.

-->
Previous Article - Building An Opt-In Mailing List
Next Article - Why Bother With Plain-Text Emails?