標籤: 響應式郵件

我要如何設計響應式郵件?

我要如何設計響應式郵件?

行銷策略 • 2016.11.21

起床一睜開眼睛就迫不及待從枕頭旁拿起手機?痾...好吧,我不得不承認這就是我,但是在現今這個世代,手機已經成為我們生活的一部份,Litmus 統計顯示有近 56% 郵件透過行動裝置被開啟,其他依序為 22% 網頁版、17% 桌上型,這數據再次顯示響應式郵件的重要,若你已經制定好行銷策略,也不妨看看以下建議。 在此之前得先找出收件人最常透過何種行動裝置開啟郵件,可以藉由 Benchmark 分析報告追蹤收件人最常使用何種裝置開啟,接著再繼續制定你的行銷策略。 準備好了,就開始吧! 到哪都完美呈現 響應式設計是目前郵件行銷最夯的趨勢,換言之,郵件若是採用響應式設計,那麼不論收件人是透過何種裝置檢視,郵件編排都能完美呈現。Benchmark 恰恰提供一組編輯器,只要使用該編輯器建立的郵件,均為響應式郵件,寄件者不需要擔心郵件跑版。 [caption id=\"attachment_2310\" align=\"aligncenter\" width=\"1400\"] 以下是郵件自動依不同行動裝置適應的樣子。[/caption] 主旨欄 主旨長度也大大影響郵件的開啟率,而不同的客戶端(iOS、Gmail、Yahoo 等等)也有不同的字數限制,桌上型通常顯示約 60 字符,行動裝置約 25~30 字符,因此建議控制在 40 字符以內,主旨必須清晰又能立刻抓住收件人目光。 [caption id=\"attachment_2311\" align=\"aligncenter\" width=\"1400\"] 精心設計主旨[/caption] 清晰明瞭的 CTA CTA 的位置最好顯而易見,能依據不同裝置自動適應,建議最好置於郵件最上方,讓收件人開啟郵件後能立即到,另外 CTA 的用語也必須清楚傳達要收件人採取的動作。 [caption id=\"attachment_2312\" align=\"aligncenter\" width=\"1400\"] 清晰明瞭的 CTA[/caption] 字體大小適中 對某些人來說,用桌電閱讀字體大小為 12 px 的郵件已經有些吃力,更別說是用手機瀏覽,因此,必須確定郵件段落與 CTA 在小螢幕中也能清晰易讀。 圖片 圖片也是郵件中的重要元素,要特別注意,圖片若超過 100 KB 將增加郵件下載時間,因此圖片不宜過大,另外,還有一點,部分收件端會自動顯示認可寄件者所發送的郵件圖片,其他可能必須手動點選顯示,郵件圖片才會完整呈現。 如何優化於行動裝置的郵件圖片 : 如果碰到上述遇到的問題,可以善用圖片屬性文字 (Alt 替代文字),利用簡短的文字描述替代無法顯示的圖片,若你是使用 Benchmark 拖曳編輯器,可以點選圖片區塊,加入 Alt 文字 。 切記不要在 Alt 文字加入 CTA 訊息,以文字為主、圖片為輔的方式設計郵件。 圖片寬度不得超過 600 px,這樣即便不是響應式郵件,圖片也能夠在行動裝置完整呈現。 [caption id=\"attachment_2313\" align=\"aligncenter\" width=\"1400\"] 確保圖片於行動裝置完美呈現[/caption] 總結 看完以上 5 個要點,是不是覺得設計響應式郵件易如反掌呢?若你有任何問題,或者其他小秘訣的想要分享,非常歡迎在底下留言。


瀏覽更多