Which version of HTML to use in emails?

Which version of html would you recommend for post content for better compatibility with the email client?

HTML 3.2
HTML 4.01 Transitional
HTML 4.01 Strict | XHTML 1.0

What would you advise me to use?



source to share

4 answers

If you think browser-html has been fragmented, you are going to pull your hair out with html email. You often don't have the luxury of providing doctype

(to distinguish between transient / strict, etc.) ... even if you provide one, many clients will ignore it. It gets even more complicated when you have webmail users - these pages already have their own document type, so they won't be paying attention to you.

Once you finish this (as in - don't even worry about it), you will find out that very limited layout options are provided ... CSS is only supported indefinitely ... not by every client ( great guide here ). The desk design will crawl backwards and you will find yourself crying over what you have to do to make it look readable (not to mention making it look similar across platforms).

This is not like trying to create a GUI application on the command line ... or casting carrots into a sword fight.



Keep it as old and forgiving as possible. However, most email clients will strip your head and html anyway, so your doctype isn't really that important.

Check out this great article: http://24ways.org/2009/rock-solid-html-emails and this list of CSS properties and which support them via email: http://www.campaignmonitor.com/css/



Since you are not in control of the doctype, you are not actually in control of that. If your message appears in a web service, you get the type "THEY".

To make matters worse, Outlook uses the MS-WORD engine to render HTML.

Your best bet is to use this diagram to decide which features to use when encoding your emails and just pretend it's still 1999 (table-based design, no background images).



If you are encoding HTML emails, you want to encode them as if it were 1999.

This means using tables for layout, inline styles and limited css.

Here's a nice graphic showing what works in which browsers: http://www.campaignmonitor.com/css/

Some general rules that I follow:

  • adding tags <td>

    or tags <table>

    and nothing else
  • use background images sparingly or not at all.
  • no divs, use tables instead and nest them appropriately.
  • Inheritance doesn't always work, there is not always style inheritance for <a>

    inside a tag <p>

    , so it's best to give the tag its own inline style for everyone, including font styles.
  • set all images to display:block

    and border="0"

    and always declare width and height


All Articles