如何發送只有 Apple Watch 才能看到的隱藏版電子郵件

Litmus 用戶 Dan Foody 發現了有關 Apple Watch 的一些非常令人興奮的東西。 有一種方法可以發送只有 Apple Watch 才會顯示的電子郵件營銷活動的隱藏版本。 這為您的設計提供了更大的靈活性。

通常 Watch 只顯示電子郵件的純文本部分。 這是因為一個怪癖。 當 Watch 在您的電子郵件中註意到遠程圖像時，它認為 HTML 太複雜，因此它顯示純文本版本。 作為參考，遠程圖像是未嵌入電子郵件中的圖像，而是使用標準 <img> 標籤從服務器加載的圖像——電子郵件中 99% 的圖像都是通過這種方式加載的。 請記住，伙計們，我們在這裡在手錶上顯示電子郵件。 它需要簡單！

那麼，秘訣是什麼？

首先，介紹一下背景。 HTML 電子郵件通常包含兩部分 - HTML（技術上具有text/html的內容類型）和純文本（ text/plain ）。 Apple 在最近給客戶的一封電子郵件中使用了第三部分： text/watch-html 。

如果您在消息中包含額外的HTML 部分，內容類型為“ text/watch-html ”，當 HTML 部分不合適時，Watch 將使用額外的 Watch 部分而不是純文本部分。 您可能需要 ESP 或郵件提供商的幫助來設置第三個 Watch 部分。 您還可以嘗試使用 PutsMail 向自己發送啟用 Watch 的電子郵件，它支持第三個watch-html部分。 現在，您可以專門為 Watch 創建內容！

Watch-html 在行動

我們獲取了上一份時事通訊並添加了watch-html部分。 在所有其他電子郵件客戶端中，似乎什麼也沒發生。

但是，在 Apple Watch 上，我們能夠展示一個特定的、量身定制的版本，它利用了 Watch 的類似富文本的支持。

電子郵件在 Watch 上看起來有多好？

使用這種技術可以使您的電子郵件看起來更好，但它仍然相當有限。 考慮 Watch 的 HTML 支持的最簡單方法是僅文本修飾。 您可以創建一些更好的格式，但您不會重新創建完整的多列佈局。

查看用於構建上述示例電子郵件的 HTML。 您會注意到幾乎沒有塊級元素。 事實上，它看起來一點也不像 HTML。 這都是因為 Watch 將 HTML 解析為富文本視圖的方式。

由於 Watch 不能顯示 HTML，它實際上讓 iPhone 在將 HTML 傳輸到 Watch 之前將其轉換為富文本。 這與有些人可能記得的 Lotus Notes 和 AOL 早期的富文本查看器非常相似。 它本質上是純文本，具有一些豐富的內容支持。

格式化提示

無需段落標籤，只需在電子郵件源中創建一個段落即可。 不要使用樣式或強標籤來增加字體粗細，而是使用 <b>。 不需要 Div，也不需要大多數樣式（除了非黑色的文本顏色）。 一定要避免在 HTML 中使用縮進或其他組織方式——Watch 在消息中包含這種額外的間距。

這是我們迄今為止支持的內容的概要：

富文本概念	觀看 HTML
膽大	<b>文字</b>
斜體	<i>文字</i>
強調	<u>文字</u>
字體顏色	<span style="color: #00800;">文字</span> 設置為黑色 (#000000) 或未指定的文本將轉換為白色 (#FFFFFF)。 支持其他顏色。
結盟	<div style="text-align: right;">Text</div> 僅支持左、中和右。
引用	<blockquote type="cite">文本</blockquote> 嵌套引用最多 7 級深，不會出現縮進，但陰影確實表示引用級別。
編號列表	<ol><li>項目 1</li></ol>
項目符號列表	<ul><li>項目 1</li></ul>
圖片	<img src="cid:...">文本</blockquote> 僅支持嵌入圖像，實際支持非常有問題。 更多關於這在下面。

圖像支持

Watch 電子郵件客戶端的第一個版本在圖像方面存在一些相當大的問題。 除了它們必須嵌入這一事實之外，還有一些重要的問題需要注意。

圖像定位方式存在錯誤，導致圖像比例被破壞。 當手錶調整嵌入圖像的大小時，它會插入一個 2px（在視網膜屏幕上一次 4px）的透明邊框。 不幸的是，它在圖像內部執行此操作，導致圖像失真。 例如，如果您有一張 100x50 像素的圖像，手錶會將其調整為 96x46 像素，從而無法保留圖像比例。

您可以通過將圖像大小調整為 4px x 4px（不保留圖像比例）來解決此問題。 在此示例中，Watch HTML 部分中的圖像為 104x54px。 Watch 會將其重新調整為 100x50px。 但是，這會導致一些失真。

此外，內嵌圖像可能會無意中重新定位在 Watch 視圖中的任何位置。 如果 Watch 在渲染時遇到問題，您可能會發現您的圖像出現在主題行、日期甚至名稱的頂部！

我們完全希望 Apple 在不久的將來通過軟件更新來解決這些問題，但牢記這些限制是值得的。 如果您嘗試嵌入圖像，請記住僅在 Watch HTML 部分使用它們，因為嵌入的圖像對在其他電子郵件客戶端中顯示的 HTML 部分的顯示支持很差。

報頭文本

最後還有一個需要注意的問題。 儘管 Watch 將呈現 Watch HTML，但它仍將使用標準 HTML 部分作為收件箱視圖中的預標題文本。

在野外使用 watch-html

你如何真正使用這個隱藏的 Watch HTML 部分？ 您需要 ESP 或郵寄服務提供商的幫助。 壞消息是 ESP 尚不支持此功能 - 向他們發送此帖子的鏈接！ 我們在下面提供了技術細節。 希望現在我們已經發現了技術細節，我們將在不久的將來看到採用。

如何使用 watch-html 部分發送電子郵件

如果您自己發送 HTML 電子郵件，或者您正在為 ESP 實現此功能，讓我們介紹如何發送包含 Watch HTML 部分的電子郵件的技術細節。

要添加您的 Watch HTML 部分，請添加額外的第三個 MIME 部分。 它必須使用內容類型“text/watch-html”並且必須是內聯的。

 內容類型：text/watch-html； 字符集=“utf-8”

此外，這是非常重要的，你必須確保你的電子郵件來源的標準HTML部分前觀看HTML部分出現，以及純文本部分之後。 如果您在其他地方包含 Watch HTML，桌面上的 Apple Mail 會將您的 Watch HTML 呈現為純文本。 如果您在使用它時遇到問題，請檢查您的郵件軟件或 MTA 是否沒有重新訂購 MIME 部件。

這是一個正確實現所有 3 個部分的示例電子郵件：

 來自：來自@example.org
至：[email protected]
主題：Apple Watch 示例
內容類型：多部分/替代； 邊界=“你的邊界”

--你的邊界
內容類型：文本/純文本； 字符集=“utf-8”
內容傳輸編碼：引用打印
內容處置：內聯

這是純文本部分。

--你的邊界
內容類型：text/watch-html； 字符集=“utf-8”
內容傳輸編碼：引用打印
內容處置：內聯

<b>這是觀看 HTML 部分</b>

--你的邊界
內容類型：文本/html； 字符集=“utf-8”
內容傳輸編碼：引用打印
內容處置：內聯

<p>這是標準的 HTML 部分</p>
<img src="something-remote"/>

--你的邊界--

最後，如果標準 HTML 部分中存在不合適的內容，Watch 只會回退到您的 watch-html 部分。 一個簡單的遠程圖像，例如跟踪錯誤或隱藏圖像，就可以解決問題。

這種技術是有效的，因為 Apple Watch 會嘗試 text/html 部分，然後逐漸返回 MIME 部分，尋找合適的內容。 雖然我們將內容類型命名為“text/watch-html”，但實際上，它可以被稱為以“text/”開頭的任何內容。

向自己發送手錶優化的電子郵件

PutsMail 允許您向任何地址發送測試電子郵件，而無需 ESP。 它還支持watch-html 。