HTML製作edm的技巧與問題

不管是系統通知信/電子報，還是會員註冊成功的信，總之只要是寄到他人信箱的信，
都要注意很多地方。之前UI曾經給我的畫面是，他希望使用者收到的edm之後，裡面還要有hover行為，真是嚇死我了(收信的mail system會有過濾的機制，機於郵件安全性的考量，所有JavaScript會被過濾掉，包含所有的監聽事件)

光是要兼容大部分的信箱可以看到幾乎一樣的畫面就已經不是ㄧ件簡單的事情了...
最後找出來的原則就是 :

• 以table排版

• Inline styles are still king with email=>任何CSS都要寫在行內

• margin如果沒有作用，高度用<br>替代，寬度用border-left:20px solid transparent(用透明顏色產生一個假的寬度)

• 圖檔勿過大

• 所有的文字或是有超連結的文字，要設定css的color，因為在某些信箱會把顏色跳成很一般的藍色跟紫色

這篇文章提供了非常仔細的描述 EDM郵件製作規範完整版 (2011-08-21 14:54:44)
我想我寫再多也不會超過他，如果我還有機會碰到製作EDM，有什麼怪異的點我會再把他記起來。

如果寫行內樣式還是無法解的問題，可以參考這個網站 :
裡面有哪些信箱系統支援/不支援哪些css，可以做個參考。

圖片來源(截圖自) : http://www.campaignmonitor.com/css/

其他連結 :

• Outlook 2007, inline styles, and links
• Outlook 2007 losing font-family declaration (如果你在Outlook有設定css字型的困難)