交付第 5 集：電子郵件設計究竟是什麼？

在這一集中的交付中，主持人傑森羅德里格斯試圖回答這個問題，“什麼是電子郵件設計？” 它了解您對 HTML 和 CSS 的理解嗎？ 或者它不僅僅是代碼？

請務必訂閱在 iTunes 或 Spotify 上交付以收聽未來的劇集，並使用標籤#DeliveringPodcast 在 Twitter 上加入對話。

情節抄本

從表面上看，電子郵件設計似乎很簡單。 它只是編寫一些 HTML 和 CSS 並將其發送給訂閱者，對嗎？ 但是再深入一點，你就會打開一個複雜的世界，而不僅僅是代碼。 在這一集中的交付中，我試圖回答這個問題，“電子郵件設計究竟是什麼？”

歡迎來到 Delivering，這是一個關於電子郵件營銷、戰略、電子郵件行業以及電子郵件設計和開發的播客。 Litmus 為您提供投遞服務，Litmus 是一個創意平台，超過 600,000 名電子郵件專業人士使用該平台來設計、測試、分析和協作開展更好的電子郵件活動，讓訂閱者更快樂。 了解更多信息並在 litmus.com 上免費試用 Litmus 7 天。

電子郵件設計很簡單，對吧？ 歸根結底，電子郵件只是 HTML 和 CSS，有點像編寫網頁。 有整個文檔結構——HTML 文件中的頭部和正文——然後是該文檔中的所有內容。 您使用非常標準的 HTML 來標記內容，然後使用 CSS 來設置該內容的樣式。 理論上，任何有一點構建網頁經驗的人都可以編寫一封快速電子郵件，將其上傳到 ESP，然後將其發送給訂閱者。

至少，這是很多人的想法。

實際上，HTML 和 CSS 只是電子郵件設計的開始。 當然，電子郵件設計人員、開發人員和營銷人員需要了解他們的 HTML 和 CSS。 沒有它，您只能任由所見即所得編輯器的奇思妙想以及它生成的任何意大利麵條式代碼。 但是，電子郵件設計究竟是什麼？

在近十年來設計和編碼電子郵件的過程中，我將電子郵件設計歸結為三個關鍵事項：降低風險、突破界限以及為所有訂閱者創造更好的體驗。

和很多人一樣，我首先學習了 HTML 和 CSS 來構建自己的網站。 我在網絡標準運動中長大，並虔誠地追隨像 Jeffrey Zeldman 和 Eric Meyer 這樣的人。 每當我有時間時，我都會花時間閱讀 Rachel Andrew 和 Jen Simmons 等人的寫作和演講。

然而，當我負責構建我的第一封電子郵件時，我很快了解到僅了解基於標準的 HTML 和 CSS 是不夠的。 電子郵件是它自己的野獸，這要歸功於許多流行的電子郵件客戶端，它們都以不同的方式對待 HTML 和 CSS。 所有電子郵件客戶端都使用自己的渲染引擎來解釋和顯示我們電子郵件活動背後的標記。 在某些情況下，同一電子郵件客戶端的不同版本使用截然不同的渲染引擎。

眾所周知，Microsoft Outlook 從使用 Internet Explorer（一種相對較好的電子郵件渲染引擎）切換到在後端使用 Microsoft Word 來顯示電子郵件。 微軟做出這一轉變的原因有很多，但從那以後，這一直是電子郵件營銷人員的眼中釘。

電子郵件客戶端的範圍從 Apple Mail 中令人驚嘆的渲染到最糟糕的。 想想舊版本的 Lotus Notes，它不支持大量標記。

這就是為什麼這麼多電子郵件設計都是為了降低風險。 這是關於了解每個電子郵件客戶端和相關的怪癖，並防禦性地編碼電子郵件。 作為電子郵件設計師，我們希望限制活動中出錯的數量。 在這樣做的過程中，我們開發了一些非常有創意的技術和技巧，以幫助電子郵件在電子郵件客戶端之間良好運行。

Microsoft 條件註釋和幻影表、混合編碼和 Fab Four 方法，甚至像使用內聯 CSS 和限制電子郵件中使用的 HTML 元素和 CSS 屬性的數量這樣的基本方法都是為了降低風險。

不過，許多電子郵件設計師就止步於此。 他們默認使用防禦性編碼技術，而不想知道在電子郵件中還可以完成什麼。 不過幸運的是，有些電子郵件設計者並不滿足於現狀。 他們致力於突破電子郵件設計的界限。

公平地說，許多防禦性編碼技術都是創造性的，並以自己的方式突破界限。 但他們應該只以最好的方式感受到限制。 他們應該激勵電子郵件設計師超越傳統的電子郵件設計。

這就是有效電子郵件設計的第二部分是推動這些界限的原因。 了解電子郵件的局限性，但從其他領域（如網頁設計和開發）或從視覺設計的角度，如創意印刷設計之類的事物中汲取靈感才是它的所在。

這種設計最流行的例子是構建交互式電子郵件。 Mark Robbins 和 Rebelmail 的工作人員在收件箱中為 Burberry 等品牌打造了完全交互式的結賬體驗。 在 Litmus，我們在電子郵件活動中發送 Twitter 提要、背景視頻和尋寶遊戲後，得到了巨大的反響。

但是不要認為電子郵件必須具有交互性才能突破界限和發展媒體。 文案、策略、圖形和視覺設計也能起到推動作用。 真正的好電子郵件吸引了大量忠實的受眾，不是通過讓他們的所有電子郵件都具有互動性，而是通過擁抱他們獨特的聲音、幽默品牌和一些很棒的個性化。

我最喜歡的時事通訊之一，Mailchimp 現已解散的 UX 時事通訊，並沒有對代碼做任何花哨的事情。 但他們的藝術指導電子郵件——我最喜歡的是看起來像 90 年代時代的 HTML 電子郵件，純文本 ASCII 藝術——激勵其他設計師將藝術指導帶入他們自己的電子郵件活動，並擴展訂閱者認為電子郵件通訊可以做什麼的概念是。

儘管其中一些定義類型的電子郵件只是為了好玩而進行的一次性活動，但很多工作都圍繞著良好電子郵件設計的最後一個方面：為訂閱者創造更好的體驗。

如果沒有 Fabio Carneiro 和 Nicole Merlin、Stig Morten Myre 和 Remi Parmentier 等人的開創性工作，我們就不會有我們都認為理所當然的技術來為訂閱者提供更好的體驗。 Fabio、Nicole 和 Remi 都參與了圍繞構建響應式、適合移動設備的電子郵件的對話，全球有數百萬訂閱者每天閱讀這些電子郵件。 Stig 致力於解開 VML 的秘密，以及防彈按鈕和背景的世界，使世界各地的訂閱者都能參與電子郵件活動，儘管電子郵件客戶對我們的代碼做了所有奇怪的事情。

最近，我們看到了創建更易於訪問的電子郵件活動的巨大推動。 像 Mark Robbins 和 Paul Airy 這樣的人進行了大量研究，以幫助我們所有人了解如何製作任何人都可以使用的電子郵件活動，無論他們的能力如何。 更加註重使用排版、對比度、圖像替代文本和更清晰的文案，為比以往更多的人打開了電子郵件營銷的大門。

所以，這讓我們回到了這個問題，“什麼是電子郵件設計？”

電子郵件設計不僅僅是代碼。 還有很多。

電子郵件設計是關於了解一種獨特的媒介。 一種與網頁設計和開發相關但又獨立的媒介。 一種建立在熟悉的技術之上，但需要專家的知識才能做得好。

當然，電子郵件是關於減輕如此多的電子郵件客戶端和渲染引擎帶來的風險，每個客戶端和渲染引擎都有自己的一組令人沮喪的錯誤。 但它是關於超越這些風險和限制，並找到創造性的方法來為我們的所有訂閱者打造令人驚嘆的、可訪問的體驗。

所以，下次有人問你是否是電子郵件設計師時，不要迴避回答。 不要說，“是的，但我也做前端 Web 工作。” 告訴他們真相：告訴他們您解決了有趣且具有挑戰性的問題，並使用世界上最有價值和最受歡迎的溝通渠道電子郵件提供更好的體驗。

喜歡《交付》的這一集嗎？ 在 iTunes 上給我們評論並與您的朋友分享播客。 並確保在您最喜歡的社交網絡上使用#DeliveringPodcast 標籤加入對話。