6 Tips for Email CSS Render TestingOctober 14, 2013 By Ben Meyer
ISPs and Rendering Issues
In addition to ISPs, keep in mind that HTML email templates render differently on Internet browsers: What looks good on Chrome might not look the same on Safari. Unfortunately, email templates that do not render correctly can be flagged as SPAM or may never reach your customers' inboxes due to regulations set up on the ISP's backend system. For example, when an email is sent, it goes through a set of processes before entering the recipient's inbox. One of those processes determines if your email has "dirty HTML code." If the system determines that your code is dirty, it may not deliver your email.
Most online marketers make the assumption that once they code their templates, they will render correctly across all email mediums. This is simply not the case. Below, I have listed some best practices for using HTML code and the different elements that ISPs do not accept when processing that code.
HTML not CSS
HTML and CSS is like a long-lasting relationship. They are still very different, but cannot live without each other. It is important to understand that HTML in email design does not work the same as HTML in website design. While website designs call to style sheets to provide the design of the wire frame, email templates need inline CSS to render correctly with design attributes.
Besides making sure to use inline CSS, another important rule is to use div tags sparingly, because they tend to break emails more than any other feature. Div tags can be good for styling designs and keeping simple layouts in order, but they should not be used when positioning properties throughout your template. Instead, make sure to use tables instead of divs because they will render better throughout the major ISPs. Ultimately, they are the best way to achieve your overall design goal and keep your message consistent with all webmail clients.