Category Archives: Front-end development

Creating HTML email templates

There are plenty of resources out there from various email marketing websites, it’s just a case of putting them all together and taking note of the main rules:

  • Code like it’s 1999
  • Tables, tables, tables
  • Nest your tables like crazy
  • Test your email template
  • Avoid using margin
  • Style your <td> tags (nest your tables if needed)

Let us treat each email client like a different browser. You’re going to run into old versions which do not support newer technologies. As you design and create your email templates, you will run into problematic issues in different email clients. If you stick to tables and basic syntax from the start, the chances of you running into these issues will be minimal.

Most email clients do not support <style> tags so we’re much better off using inline styling. To make this easier, we’ll let PHP handle this using an HTML and CSS parser. You may be working with a framework that already takes care of this or you could need to implement this yourself. There are plenty of resources available such as:

Useful links and resources:

Transactional email API services: