How to code html mailings?

Question

Hello! I'm preparing to send mass email to customers which is in html + images. What are general rules to do make it display correctly in most popular mail clients?

EDIT:

Well it's for my customers - about few k clients.

My question is - how to code this email that it will display correctly in customer mailclient(thunderbird, outlook, gmail). What css tags can I use?

Answer 1

HTML email type. Your images need to be hosted somewhere on the internet, and then included in the HTML as links.

You generate your HTML code, and that is the message body. The type of the mail message is HTML!

Everyone does this, there are a million examples out there.

Answer 2

You can include inline images if you want as an alternative to hosting them somewhere.

The img src in your html is cid:mime-part-name

And attach the image as a mime part.

But apart from that, make sure you keep your HTML and CSS simple - email programs are worse renderers than browsers - and test it in several email programs and on hotmail and gmail.

Answer 3

I know this isn't what you've asked, but have you tried MailChimp? They've a great service.

Answer 4

You need to consider the fact that some email clients do not render html. The MIME standard supports multipart emails. You define different boundaries for the different parts of the message.

http://en.wikipedia.org/wiki/MIME

Answer 5

General rules for HTML emails:

• No Javascript... ever!
• Use table-based layout (no floats)
• No <style> or <link> for CSS - use the style="" attribute only

This should keep your emails looking decent in most mail clients, including the web-based ones (hotmail, yahoo, gmail).

Answer 6

I'd also recommend a 3rd party like MailChimp or CampainMonitor, they deal with a lot of extra stuff like mangaging subscriptions and checking for bouncing, plus they offer stats on opening etc.

Answer 7

These two references are great places to start

• http://www.alistapart.com/articles/cssemail/
• http://www.campaignmonitor.com/css/

Apparently using HTML 3.0 compatible tags and formatting works best for all email readers and providers.

I asked a similar question http://stackoverflow.com/questions/340250/what-is-the-best-method-for-formatting-email-when-using-systemnetmail

Answer 8

If you must use images, keep them very small and keep them in-line. Many mail clients refuse to render links to external images because spammers use them to track who was dumb enough to read their email.

Answer 9

Avoid background images, as Outlook 2007 won't display them. (The 2007 version of Outlook uses the HTML rendering engine from Word...)

Answer 10

Have a look at email-standards.org, they have an ACID test which they run on most popular clients, and you can see a list of the different css selectors and html tags they tested, and screenshots of the actual results, with what works and what doesnt.

Hope this helps!

Answer 11

I tend to use a table layout, with tags to allow for rendering text in the correct face and colour and roughly the right size, then use style="" to render it correctly in email clients that support CSS.

Just don't get too complicated with your CSS...

Answer 12

Several of these are very good. I'll just summarize and add a couple other tips.

• Use a table based layout
• No javascript
• Minimal CSS - many things don't work
• Any CSS should be inline
• No background images of any kind, won't render in Outlook 2007
• Link to hosted images. Inline images may work, but if you aren't very careful size restrictions on mail servers will bounce them.
• Be sure to use alt tags on images so something is displayed when mail clients block images
• include a text version of the email for clients that block images
• test in as many clients as you can. Specifically Outlook 2007 and Gmail. Gmail tends to do strange things with text alignment