Questions? Feedback? powered by Olark live chat software

Tags: , , , , , ,

Quick and simple Email testing

Catalin, February 24

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:

<html>
<head>
<title>Your Newsletter Subject as Title</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
...
YOUR CONTENT HERE
...
</body>
</html>

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:

  1. W3 Validator http://validator.w3.org/
  2. Tidy http://tidy.sourceforge.net/

We recommend using both.

CSS Inline only

CSS styles should not be placed inside style tags.

Ex: <style></style>

CSS should not be referred via a link TAG.

Ex: <link rel="stylesheet" href="some.url/some.css.file" media="all" type="text/css">

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:

  1. Use border=”0″ attribute.
  2. Don’t use alt attribute. Outlook is not doing it, why should you ?
  3. 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:

  1. Litmus
  2. Email on Acid
  3. Preview my Email

Other usefull informations can be found here at Email Standards project.

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading ... Loading ...