常見的HTML電子郵件錯誤語法
一封html email的電子郵件在您的電腦上或許看來完美，但卻在收件人的電腦上卻不是這麼一回事，因為它需要使用到您系統上的圖表、字型和CSS檔案。當您在HTML編輯器以外的地方(例如:Microsoft Publisher、Dreamweaver或FrontPage)建立您的電子郵件時，請記住：您是在設計一封電子郵件，而不是設計網站，如果您把它當成一個網頁來撰寫時，有些內容可能會無法正常顯示在不同的聯絡人郵件伺服器以及網頁電子信箱伺服器上。
- 不要引用外部的CSS檔案。 大多數的電子郵件客戶端(Gmail、Yahoo、Mac、AOL Web等等)不會引用這些外部檔案，因為這會干擾它們的CSS編碼。如果您要使用CSS，就要用In-line CSS(標記加註式)，並且利用市占率最高的電子郵件客戶端來測試您的郵件，如此您就可以檢查其錯誤或不一致的地方。
i) 引用外部的CSS檔案會導致無效ii) 將電子郵件的首頁或正文中放入CSS編碼，也會無效<link href="css1.css" rel="stylesheet" type="text/css"><style>
.main{font-size:16px;}
.subhead{font-size:14px; font-weight:bold; color:#cc0000;}
</style>
<span class="subhead">Newsletter Article</span>
<strong> Use Inline Stylesheet:</strong>
<span style="font-size:14px; font-weight:bold; color:#cc0000;">Newsletter Article</span> - 不要使用一張大圖檔佔滿您電子郵件的頁面和空間。大多數的電子郵件程式，會依照系統設定值來攔截檔案過大的圖片，所以您的收件人只會看到一封沒有圖片的空白郵件。
- 切勿將郵件的頁面設計的太寬。這主要是協助您設計出符合讀者閱讀視角的電子郵件版面，大約650圖素寬的電子郵件是最適合顯示在收件人電腦螢幕上的。如果您對這部分還是有疑慮，可以自行先設定幾個Yahoo!、Gmail等信箱來測試看看。
- 移除您HTML上不必要的編碼。如果您曾經使用Microsoft Front Page、Microsoft Word或Microsoft Publisher來設計電子郵件，請注意：您的範本中將包含所有種類的junk code，那些程式碼會破壞您設計好的電子郵件版面，造成一些問題，更糟糕的是，花指令(sloppy code)會讓您的電子郵件歸到垃圾郵件匣中。請確認在您上傳電子郵件之前，已經清除了不必要的標籤、屬性、意見和其他junk code。以下是一些相關範例：
<span class="fs12"><v:shape>
<o:column>
<b:Xl>
![endif]></span> - Flash、JavaScript、ActiveX以及內嵌的影像和聲音檔皆無法在HTML電子郵件中正常運作。雖然這些附件會讓您的郵件更炫目，但防毒軟體卻會將它們阻擋下來，更不用說從您電子郵件中連結影像和聲音檔。
- 確認所有的圖片連結都是完整的，包含Web-based的URLs。我們發現客戶經常使用連結硬碟上的圖檔，而非網頁上的。
相對位址(無法正常開啟的URL)這些文字只是網頁的部分連結。<a href="lastpage.htm"> </a>
完整位址(可以正常開啟的URL)這些文字是可以連至全球資訊網(World Wide Web)的連結上。<a href="http://www.microsoft.com/"> </a> - 至少運用三種電子郵件客戶端(如Yahoo!、Gmail、AOL以及Hotmail)來測試電子報。如此便可檢查電子郵件的版面，檢查錯誤。您應該多利用這些郵件帳號，來測試設計好的電子郵件，檢查版面、圖片、連結、顏色…等元素是否能正常顯示出來。
- Avoid Form code as it is likely to get stripped out by the email client.
iFrames should also be avoided, as they are not supported by many email clients
A Bulletproof Guide to Using HTML5 and CSS3 in Email
https://litmus.com/blog/a-bulletproof-guide-to-using-html5-and-css3-in-email