HTML design tactics for e-mail newsletter have changed over the years. Providing a Web version of your e-newsletter used to be the only solution because e-mail clients chewed up HTML.

Today, just about every e-mail client renders HTML properly. But still marketers and designers have to format it correctly. Having the newsletter displayed correctly in the e-mail clients, especially the preview pane is the first goal you must fulfill.

Why?

Because people expect more from you now.

E-mail readers also use image blocking as default settings, making the design work more difficult than ever.

Kirill Popov and Stefan Pollard have written 10 HTML tips that could improve your e-mail newsletter and campaign:

1. Code e-mail by hand: E-mail is usually simpler but trickier. If you absolutely must design with software, use one that do not introduce unnecessary code, and clean the final result by hand.
2. Be careful with tables: Avoid nested tables and 1×1 pixel spacer GIFs.
3. Use care with background images: May not appear in all e-mail clients such as Lotus Notes.
4. Host images on your Web site instead of embedding them in messages: Some ISPs filter e-mail with embedded images.
5. Avoid CSS: Incorrect rendering could result in some e-mail clients. Use inline CSS if you must.
6. Keep HTML e-mail 500-650 pixels wide: Horizontal scrolling is annoying.
7. Use image alt tags: The ISP or e-mail clients which do not block alt tags and images at the same time will have the latter displayed if the former are blocked.
8. Add functionalities carefully: Surveys, send-to-friend forms, search boxes and all features that require proper data submission should be done on your Web site to ensure greatest compatibility.
9. Just say no to Flash: Post a link to your site instead.
10. Avoid scripting if you can: It will be stripped out or even rejected.

When done with your design, validate your HTML content, test your e-mail in different e-mail clients and platform.

My thoughts: I keep blogging about testing repeatedly simply because they are not only important, but a must. Don’t waste all your effort simply because you fail to test.

HTML e-mail won’t look the same everywhere. My tip newsletter, for example, do not display exactly what I want. In the browser, it looks great. In Gmail, the left column is narrower, but still acceptable. Fix things if they are broken, and repeat the test again.

Source: ClickZ.