Each email client has it’s own specific issues in rendering HTML content. Because of this issues, email testing is highly recommended.
Here are some quick tips you can use in order to test your email content (template).
Use html, head, title and body tag
HTML file should use html, head, title and body tags like this:
... YOUR CONTENT HERE ... |
Use HTML instead of XHTML
Usually email clients like more HTML than XHTML so stick to the “old” HTML style, meaning no <br/> tags or any <htmltag />.
Valid HTML Code
All your HTML code must be valid. There are 2 options for testing Valid HTML code:
- W3 Validator https://validator.w3.org/
- Tidy https://tidy.sourceforge.net/
We recommend using both.
CSS Inline only
CSS styles should not be placed inside style tags.
CSS should not be referred via a link TAG.
All css should be placed in attribute
style="CSS: here;"
on each HTML TAG.
Images
All images should be referred with FULL url. So instead of having src=”/images/test.jpg” use src=”http://your.url.com/images/test.jpg”.
Other recommendations for <img> tags:
- Use border=”0″ attribute.
- Don’t use alt attribute. Outlook is not doing it, why should you ?
- Don’t use width / height attributes. If no width / height, some spam filters like Spam Assassin can’t compute the IMAGE / TEXT ratio for your content.
Actual webmail tests
Send a copy of your email to at least one email from Yahoo, Hotmail and Gmail. Most of the subscribers have emails at these 3 FREE email providers. Making sure your email looks good in Hotmail, Gmail, Yahoo is a good starting point.
Here is some quick PHP / Zend code to send a quick HTML email to your 3 test email accounts.
<? require_once("Zend/Loader/Autoloader.php"); $autoloader = Zend_Loader_Autoloader::getInstance(); $autoloader->setFallbackAutoloader(true); $charset = "utf-8"; $mail = new Zend_Mail($charset); $mail->setBodyHtml(file_get_contents("newsletter.html"), $charset); $mail->setSubject("Test with your real subject."); $mail->setReturnPath("info@yourdomain.com"); $mail->setFrom("info@yourdomain.com"); $mail->addTo("testemail@yahoo.com"); $mail->addTo("testemail@gmail.com"); $mail->addTo("testemail@hotmail.com"); $tr = new Zend_Mail_Transport_Smtp("localhost"); $mail->send($tr); ?>
Use an email preview engine
If you design and send emails on a regular basis, using a tool for email render testing should be a good choice.
Here are some tools available online:
Other usefull informations can be found here at Email Standards project.