電子郵件圖像攔截：回答什麼、為什麼、在哪裡、誰和如何

如果您從事電子郵件營銷，您可能聽說過您不應該發送全圖片電子郵件。 對此已經給出了很多理由。 您的電子郵件將進入垃圾郵件。 您的觀眾將無法看到它。 這對可訪問性不利。 所有這些都是很好的理由。 但隨著電子郵件的發展，情況發生了變化。 讓我們深入了解不斷變化的環境如何影響電子郵件中的圖像，並更新我們 2021 年及以後的一些最佳實踐。

我會引導你完成：

• 什麼是電子郵件圖像攔截
• 為什麼圖片不顯示
• 默認關閉的位置
• 誰會阻止電子郵件圖像
• 如何優化關閉圖像

那是什麼？

電子郵件圖像阻止是一種從電子郵件中阻止圖像或電子郵件客戶端或公司服務器不顯示圖像的做法。 這導致圖像沒有顯示在電子郵件中，例如幾乎沒有圖像 ALT 文本的圖像：

或者這個帶有更好的圖像 ALT 文本的（雖然看起來仍然不太好，對吧？）：

為什麼會發生？

電子郵件客戶端默認阻止圖像或將其關閉的原因有多種。 最大的原因是安全。 微軟聲稱他們阻止圖像是為了幫助他們的讀者避免查看潛在的冒犯性內容並保護他們免受惡意代碼的侵害。 他們還提供了一個觀點，即默認情況下阻止圖像允許帶寬較低的人選擇是否要使用該帶寬進行圖像下載。

對於電子郵件客戶端有默認是打開的圖片，很多都使用圖片代理服務器來承載的，而不是具有圖像直接從外部主機來的圖像。 這允許電子郵件客戶端在圖像到達收件箱之前檢查病毒和惡意軟件，從而減少將圖像阻止作為安全功能的需要。

帶寬參數仍然是打開圖像阻止的一個很好的理由，但我們測試的所有移動電子郵件客戶端默認允許圖像。 訂閱者必須認真研究如何為他們的移動設備關閉圖像。 這使得電子郵件營銷人員確保所使用的任何圖像都經過優化變得更加重要。

電子郵件圖像在哪裡被阻止？

過去，許多電子郵件客戶端默認阻止圖像。 如今，最大的罪魁禍首是 Outlook 桌面客戶端。 大多數其他電子郵件客戶端（AOL 除外）默認顯示圖像。

網絡郵件客戶端

*ALT 文本仍有下劃線。

桌面客戶端

*從 Outlook 2016 開始，此功能已關閉，但我們無法測試是否仍然如此。
**這在警告消息之後呈現並且僅在圖像被關閉時呈現。 如果圖像損壞，則不會呈現 ALT 文本。

移動客戶端

*這是我們上次檢查時的情況，但我們無法測試是否仍然如此。

那麼，只有圖片的電子郵件是否對您的電子郵件宣判死刑？ 根據電子郵件客戶端市場份額，雖然 Outlook 是第四大最受歡迎的電子郵件客戶端，但它僅佔電子郵件打開的 6%。 但是，由於 Outlook 默認阻止圖像——因此，開放跟踪像素——我們不知道它有多準確。

所以你有可能會沒事。 但是，就像所有電子郵件一樣，這取決於您的受眾是誰。 如果您的 Outlook 訂閱者數量高於平均水平（如果您是 B2B，很有可能就是您），那麼您可能會遇到麻煩。

不再有損壞的電子郵件 在 100 多個電子郵件客戶端、應用程序和設備上預覽您的電子郵件，以確保品牌一致、無錯誤的訂閱者體驗——無論是否打開圖像。 了解如何 →

誰阻止他們的電子郵件加載圖像？

沒有真正的方法可以判斷有多少觀眾受到圖像阻塞的影響，因為打開率是通過圖像像素負載來衡量的。 沒有圖像加載意味著沒有打開被跟踪。

根據我們之前的研究，當 Gmail 於 2013 年首次開始默認打開圖片時，43% 的 Gmail 用戶曾經在查看電子郵件時關閉圖片。 這是否表明 Outlook 用戶的行為？ 可能是，但我們無從得知。

由於您無法準確判斷有多少受眾打開了關閉圖像的電子郵件，因此最好在創建電子郵件時考慮到圖像屏蔽，以確保為每個人提供最佳體驗。

如何優化關閉圖片的電子郵件？

即使在圖像被阻止的客戶端中，您也可以通過多種方式對電子郵件進行編碼以提供出色的體驗。 我們將在這裡深入探討它們。

盡可能使用實時 HTML

對電子郵件進行編碼以確保最大可訪問性的最佳方法是使用實時 HTML 對電子郵件進行編碼。 這意味著不要在圖像中放置文本（尤其是關鍵信息）。 讓按鈕和文本使用 HTML 編碼，而不是創建為圖形。 專門為圖像使用圖像。

實時文本

將文本保存在段落和標題標籤中。 品牌風格很重要，但並不比考慮訂閱者的體驗更重要。

Magic Spoon 在讓他們的圖像包含適當的 ALT 文本方面做得很好，但是將它們作為 <p> 標籤中的實時文本用於更具影響力的無圖像版本（例如 Ace Hardware 所做的）將非常簡單：

關閉圖像的 Magic Spoon 電子郵件	關閉圖像的 Ace 硬件電子郵件

我希望他們至少有替代文字。 我無法想像這需要超過 1-2 小時 2 代碼 2 提高可訪問性。 而且你知道我的立場......如果你只是出於品牌原因做烘焙文本，那麼你更關心你的字體而不是你的訂閱者有限制

— 安妮·湯姆林 (@pompeii79)，2021 年 8 月 3 日

防彈按鈕

在號召性用語 (CTA) 中使用實時文本是必不可少的。 作為電子郵件的主要驅動力，無論訂閱者使用何種體驗，您都希望確保您的 CTA 出現。 使用防彈按鈕來完成此操作，並確保您的 CTA 始終顯示：

背景圖片

不要在圖像中嵌入文本。 但這並不意味著您不能擁有漂亮的設計。 為了兩全其美，請使用頂部帶有實時文本的背景圖像。 這可確保即使在圖像關閉時也能傳達您的信息。

並在背景圖片中加入背景顏色，以確保您的電子郵件仍然吸引人且具有品牌特色（您不想要巨大的空白區域——除非這是您想要的外觀）。 只需確保設置 ALT 文本的樣式，使其顯示在背景顏色後備中並且不會丟失。 像這個例子：

圖像	圖片關閉

實時編碼電子郵件可能比“插入圖像”更棘手，但是當您對電子郵件進行編碼時，更改文本比更改圖像並重新上傳要容易和快捷得多。 現在有了所有的工具（例如 Litmus 的可視化編輯器），創建電子郵件比以往任何時候都更容易，而無需僅使用圖像。

使用 ALT 文本或風格化的 ALT 文本

ALT 文本是在訂閱者使用屏幕閱讀器時不顯示圖像或大聲朗讀時顯示的文本。 如前面的支持表所示，幾乎所有地方都支持 ALT 文本。 在某些地方，您甚至可以設置 ALT 文本的樣式，使其看起來與圖像中的實際文本相似。

使用 ALT 文本可以幫助打開圖像屏蔽的人（以及使用屏幕閱讀器的人）了解圖像中的內容。 我知道我經常無法為圖像的 ALT 文本寫什麼，所以這裡有四個有用的提示。

ALT 文本不需要乾燥。

為您的 ALT 文字描述添加情感，以幫助您的圖像生動起來。 例如，看看這張圖片：

而不是僅僅“泰勒戴維斯的爆頭”，而是使用“泰勒戴維斯，在意想不到的時刻大笑起來。”

請記住圖像的上下文。

是的，是描述性的，但上下文是關鍵。 讓我們看看這張圖片，例如：

“一個人看著他們的手機，然後是一個顯示電子郵件通知的屏幕特寫”是一個不錯的 ALT 文本。 但如果文章是關於主題行提示的，那麼“顯示引人注目的主題行的彈出警報”是一個更相關和更有幫助的 ALT 文本。

將裝飾圖像的 ALT 文本留空。

基於圖像的項目符號或水平線不需要 ALT 文本。 如果圖像純粹是裝飾性的，而不是功能性的，那麼添加 ALT 文本只會分散讀者對您信息的注意力。

不要告訴人們下載圖像。

我曾經認為這樣的事情是天才，因為下載的圖像意味著獲取開放數據：

這似乎是一種讓人們下載圖像的有趣而聰明的方式，但任何擁有屏幕閱讀器的人都可能會感到被冷落。 ALT 文本應該用於改善所有訂閱者的體驗。

如何編碼 ALT 文本

將 ALT 文本添加到圖像就像將 ALT 屬性添加到圖像標籤一樣簡單：