造型HTML通訊

Question

HTML通訊。有時候看起來很有觀點，但目前看起來更像是一場編碼噩夢。我習慣於分離html和css，但是在編寫HTML時事通訊時，這不是一個真正的選擇（或者它是什麼？）

那麼什麼是設計html通訊的最佳實踐？將所有的CSS都放在代碼頂部的一個<style>標記中？使用樣式屬性自定義每個單獨的元素？或者亂七八糟的桌子寬度足以讓它看起來正確？也許是一切？

Answer 1

它們編碼的噩夢。避免使用樣式標籤（一些Webmail客戶端將它們去掉），在內聯樣式上很容易（並非所有郵件客戶端都能正常工作 - 最好限制自己的基本錯字），避免使用背景圖片（因爲它們不起作用使用大量的嵌套表格（但是儘量不要將圖像切分成相鄰表格單元格，因爲有些郵件客戶端可能會在表格單元格之間引入間隙），最重要的是，用你的模板測試每個主要郵件客戶端（在瀏覽器中以HTML頁面測試它們都是無用的，因爲許多郵件客戶端在顯示代碼之前對其進行了更改）。並使用與用於發送真實時事通訊的完全相同的程序測試它們，因爲某些程序在發送時引入了代碼更改。

我可以從痛苦的經歷中得到的最好的建議是a）保持簡單，b）購買經過測試的時事通訊模板，並根據您的需求仔細調整它，並且c）不要發送HTML時事通訊。

Answer 2

電子郵件的設計和開發是最糟糕的事情之一。主要是因爲在不同的客戶端進行渲染和解析時採用了不同的方法。 Gmail，雅虎，Outlook都有自己的「說法」。您必須將<style>中設置的樣式組合起來，同時也要放置一些內聯樣式，例如表格寬度或單元格。

在你學會使用什麼以及如何使用它之前需要花費很多時間，它需要數十封電子郵件。

我可以建議的一件事是使用自動化工具來檢查您的電子郵件，如Litmus。

此外，還可以閱讀有關特定電子郵件客戶端不喜歡哪些標籤或樣式。爲此，我建議CampaignMonitor