Pages

Monday, August 27, 2018

DocType for email

DocType for email


Ive found that no matter how I write the HTML for that high-impact monthly email, it will always look different in all email clients (and internet browsers).

Im not an HTML expert on these things, so I did some digging to learn: Is there a way to keep the look consistent on multiple email clients (shortened to clients)?

Sadly, a single and easy solution does not exist if you want to customize the look of your text and images with HTML and CSS.

The most common alternative that many marketeers use to bypass all the inconsistencies is to use sliced images, lay them out in tables, and add hyperlinks to some of the images. Even then, they would still have to use HTML tag attributes and/or CSS styles to format the table and image placement.

Dare to continue? Our best bet would be to first leave out the <!DOCTYPE> declaration (see link #3 and #4 for more info) in the initial email design1, test it on multiple clients, tweak it to look good on those clients, add the <!DOCTYPE> declaration (shown below), test it once again, and tweak it if necessary.2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Its okay if youre one of those people who would only use plain text for their marketing emails. But for the majority of us, I recommend signing up with an email marketing site that provides a multi-client preview:
  • ActiveCampaign (Email Testing)
  • Campaign Monitor (Design and Spam Testing)
  • Constant Contact ("Preview Test Versions - Set up accounts with a few email programs and send test versions to each one." Are you serious?!)3
  • Contactology (Preview Before you Send)
  • Email on Acid (Acid Test)
  • EmailReach (EmailView)4
  • GetResponse (Inbox Preview)
  • JangoMail (Render)
  • Litmus (Email Tests)
  • Mailboto (Email Previews & Validation)*5
  • MailChimp (Inbox Inspector)
  • StreamSend (Email Analyzer)
These are the most common ones Ive found. There isnt one that I would highly recommend since it depends on what will fit your needs and comfort level. Keep in mind that all these services cost a little bit of money to continue using after the end of the trial period.

If there are any other sites that you would recommend, feel free to comment below and share the wealth.

Good luck and happy coding!


REFERENCE LINKS
  1. CampaignMonitor: Which doctype should I use in HTML email? (November 15, 2010)
  2. Email on Acid: !DOCTYPE - The Black Sheep of HTML Email Design (November 10, 2010)
  3. Wikipedia: Document Type Declaration (Revised March 8, 2012)
  4. W3Schools: HTML <!DOCTYPE> Declaration
  5. alternativeTo: Litmus 


NOTES
  1. The <!DOCTYPE> declaration goes at the very beginning, above the <HTML> tag.
  2. This was a suggestion from Email on Acid (link #2). Even after suggesting this sequence of actions, the email could still look inconsistent due to the fact that some clients will remove the DOCTYPE or even replace it with their own. Check out Email on Acids table (link #2) to see who does what.
  3. As you can see, there is one I dont really recommend. Though they have some great features that others dont have, it feels like this one huge oversight. So Im hoping theyll add a multi-client testing feature that will match what their smaller competitors offer, and become the all-in-one email marketing company they aim to be. Ill update this post when or if this will happen.
  4. They need to clean up the duplicates in their list of testing platforms.
  5. SF City Dish uses this.


REVISIONS
  1. [2012.03.18 @ 5:45 PM] Added more sites to the list based on what I found as alternatives to Litmus (see link #4); added link #4.
  2. [2012.03.21 @ 1:26 PM] Added Mailboto to list and note #5.


      visit link download
      Posted by at

      No comments:

      Post a Comment

      Note: Only a member of this blog may post a comment.

      Subscribe to: Post Comments (Atom)