Skip to main content

Coding HTML Emails

Today had to spend some time HTML coding up some email newsletters. There's a certain guilty pleasure in this... as for a while you have to forget about web standards, and (as Prince almost said) code like it's 1999.

Due to the variability in rendering HTML in all the various email and webmail clients, this means using tables, font tags etc.

So here's my checklist of coding issues that I try to follow when presented with an HTML email design to code up:
  • Ask the designer to avoid background images - particularly with light coloured text overlayed. Reason being if the background isn't displayed, the text will be illegible. So use solid colours. Failing that, I make sure I put a background colour on as well.
  • Use tables for layout.
  • Don't use any external CSS - only inline.
  • Even then, use alternate means to be sure what you require will come out. For example if I need text at a particular size, I'll put <span> tags inside <font> tags, e.g.

    <font face="arial">
    <span style="font-size: 32px">
    Big text
    </span>
    </font>
Here's some links to others offering tips on this subject:

Comments