Most of us can parrot web development best practices until we’re blue in the face. Design with CSS, take advantage of inheritance, use semantic markup, separate design from content, etc. Last week we took on a new project that made the importance of these recommendations sink in – by stripping them all away.
Our department has several mass-email jobs that are sent out on a regular basis. Thus far they have all been standard plain-text messages. It has been decided, though, that we should make the move to putting them into a web template and sending out the message as HTML.
As I started pulling everything together one thing became immediately clear – as much as we bemoan the inconsistencies between web browsers, they don’t compare to the differences in how email clients render HTML code. In order to make the display work across even the most common clients you have to throw out the last five years of web development and go back to the basics. This means layer upon layer upon layer of nested tables, untold numbers of colspans and rowspans, style elements applied to every paragraph, and being careful to minimize the number of images and their file size.
After being neck-deep in these templates for a few days, with one more to go, I’ll never again take proper techniques and procedures for granted. It also means don’t bring me a tables-based design and ask for my honest appraisal of it…