高點擊好感度No.1的EDM設計：RWD響應式電子報瞄準行動商機，手機桌機收信都完美呈現

電子郵件行銷(又稱Email行銷、EDM行銷、電子報行銷)是企業與品牌向顧客進行溝通的重要行銷管道，目前全球已有39億電子郵件用戶，2023年預估成長至 43億用戶。企業透過Email將產品與服務訊息傳送給會員及潛在消費者，以增進顧客關係、增加品牌知名度並建立更深的忠誠度。

然而您知道Email行銷悄悄地轉變嗎? 根據Movable ink研究「66%的消費者使用手機閱讀電子郵件」。而另一份Google調查顯示「在台灣，16歲以上的人擁有智慧型手機的比例超過半數，並有74 %的人曾用智慧型手機來收發電子郵件。」這意謂電子報的設計必須以手機舒適閱讀為優先(Mobile-First)，不論是Email內容或是從電子報連結導過去的Landing Page(中文稱為網站到達頁)都須以RWD響應式設計為主。

我們先來了解一下什麼是RWD? RWD英文全名為Responsive Web Design，中文為響應式網站設計，又稱回應式網頁設計、適應性網頁、響應式網頁設計、多螢網頁設計，表示網站內容(電子報內容)能依照不同的裝置(如：手機、桌機、平板)的螢幕寬度來調整版面配置及文字大小，無論收件者採直立或橫放手機，在瀏覽時皆可得到最佳的視覺體驗。

圖解說明讓您秒懂RWD響應式電子報，透過Meta8 CRM「拖曳式EDM模版」建立的行銷郵件即為RWD響應式電子報，其「自動」因應收件者的各種裝置變更圖文排版，讓您的客戶在閱讀電子報時不必再忙著放大縮小，就可清楚看到文字內容。下方左圖為Meta8 CRM發送至以「電腦版」收信的電子報，右圖為「手機版」的畫面呈現，都是同一個電子報內容，但為了能在手機閱讀更流暢，手機版的圖片與文字敘述自動轉換成單欄式設計，同時放大字型。

 
圖片來源：Meta8 CRM顧客關係管理系統-RWD電子報

 

使用行動裝置閱信的比例越來越高，企業與品牌若不重視手機上的電子報呈現效果，可能會錯失與許多客戶互動的機會，甚至流失了商機。同時為了提高開信率與點擊率，您的電子報設計應該這樣優化：

1. 方便閱讀的文字大小

首先您的電子報字型必須夠大，以利收件者在手機上便於閱讀，依據iOS 設計規範的字型建議是 17 px ~22px，而在Android 設計規範的建議是18 px ~22px。不要害怕將您的文字調大，因為過小的文字將造成閱讀困難，若您還是偏好精美的文字外觀，那麼至少讓您的文字保持在14px以上，讓您的會員能輕鬆地看完整封EDM。

 

2. 圖片替代文字(Alt)

並非全部收件者在開啟電子報時就顯示HTML圖片，所以您可以運用圖片替代文字(Alt)的方式為圖片增加一些敘述，以簡短的文字帶出圖片裡的重要特徵，幫助會員了解您的產品與服務資訊。在Meta8 CRM拖曳式EDM版型內，於替代文字輸入描述性商品文案，當收件者沒有顯示圖片時，即以「替代文字顯示」，以下圖例，顧客會看到「甜美的櫻花粉色唇膏」。 

圖片來源：Meta8 CRM顧客關係管理系統-RWD電子報

除了使用Alt以外，另一種常見的做法是行銷人員可在圖片下方加入短短的文字簡介，也能協助收件人快速得知圖片資訊。

 

3. 圖片與文字混合運用

行銷與設計人員因考量到電子報的美觀，常將文字直接鑲在圖片上，若整份EDM皆採這類的文字鑲在圖片設計法，在手機上將形成不易閱讀的狀況。因為在手機上，響應式CSS 語法將大圖轉為小圖片，而圖片上的文字又隨之被縮的更小，就開始考驗收件人的眼力了。因此，我們建議您將圖片與文字分開(如下圖所示，以圖文並茂的方式編排電子報)，當會員用手機閱讀文字時，不用再瞇著眼看小字。

圖片來源：Meta8 CRM顧客關係管理系統- 拖曳式EDM模版

 

4. 合適的電子報尺寸

在設計電子報時，許多企業與品牌思考要採用哪種尺寸大小，內容要如何安排。您可以試試寬度600px左右的電子報，即使用桌機收信，閱讀起來也舒適合宜。關於電子報的長度，手機不適合瀏覽篇幅過多的文章內容，您應在EDM放入簡短扼要的文案及商品/活動介紹，並搭配CTA行動呼籲按鈕，若會員對您的商品/活動有興趣，他們將點擊CTA並前往網站觀看詳細的說明。

5. 吸睛的CTA(Call To Action行動呼籲按鈕)

您的電子報內容中應放置號召性用語(CTA, Call To Action行動呼籲按鈕)，像是了解更多、立即搶購、馬上報名、前往逛逛等，提示會員採取特定行動或前往您的目的網站。CTA擔綱關鍵角色，良好的CTA能提升顧客的互動及EDM轉換率，您的CTA必須尺寸夠大而明顯，最好是將重要的CTA放置在電子報中間，使得收件者用單手或大拇指來操作手機，能輕鬆按到CTA鈕。

CTA按鈕的顏色與大小也是一門學問，應凸顯它的存在，而不是讓CTA鈕與電子報背景融合在一起，您不妨運用明亮的顏色或背景對比色。那麼CTA尺寸要多大呢? 依據iOS 設計規範，CTA按鈕建議44px乘以44px以上，而Android 則是48px乘以48px以上，避免CTA按鈕過小、手指點不到而電子報轉換率下降。

6. 電子報主旨的藝術

比起桌機收信，手機能夠顯示的主旨長度更短，在手機版Gmail app 的主旨大約顯示30個半形字(15個中文字)，30個字元-此數值並非一直固定，其可能隨著各收件者的手機螢幕寬度或Google政策而變更。但值得注意的是若主旨超出字數，文字就會被截掉(僅在預覽畫面顯示前半段的主旨)，因此您能試著採用較短主旨，或是將核心文案放在最前方，確保行銷訴求及廣告重點有被看見，以提升EDM的開啟率。

延伸閱讀：提高電子報開信率！顧客點不停的10種EDM主旨術 (上)
延伸閱讀：提高電子報開信率！顧客點不停的10種EDM主旨術 (下)

 

7. 測試與追蹤電子報

寄送前測試電子報
若希望電子報在各種裝置皆完美展現，電子郵件行銷的基本可不能少，「測試」電子報是必經的過程，行銷人員與美編設計在製作完成EDM後，請發送到多個大家常使用的收件系統進行測試，例如：手機版Gmail app，網頁版Yahoo、Gmail、 Hotmail，桌機版Outlook 等。請在收件匣確實開啟電子郵件，確定各裝置是否正常顯示、有無跑版的狀況、超連結是否正確，待確認內容無誤後再大量正式發信。

寄送後觀看EDM行銷成效
在發送電子報後，開啟CRM系統(顧客關係管理系統)的Email行銷報表，透過理性、客觀的數據圖表來追蹤與分析每次電子報的成果，持續調整策略，將電子報效益極大化。

圖片來源：Meta8 CRM顧客關係管理系統-電子報行銷分析報表

 

8. 留意退訂鈕間距

在電子報最下方置入取消訂閱按鈕，以保障收件者退訂的權益，此部分需留意退訂鈕與其他按鈕/超連結之間的間距，間距要夠大，以免會員誤按到取消訂閱。若您是Meta8 CRM的用戶，請不用擔心誤按造成訂閱戶流失的情形，CRM系統多一道保護流程，當收件者點選退訂連結，CRM會跳出視窗詢問此會員是否 「確認」取消訂閱，待該位會員按下確認按鈕後才會完成退訂。

圖片來源：Meta8 CRM顧客關係管理系統-取消訂閱畫面

延伸閱讀：【Email行銷】EDM一定要放入取消訂閱連結嗎? 如何減少取消訂閱呢?

 

Meta8 CRM拖曳式EDM版型：快速打造RWD電子報

企業在設計電子報之際，往往相當耗時，不但要編排電子報版型、發想豐富的內容及吸睛主旨，還得因應現代人的手機收信趨勢而寫入RWD的CSS語法。有一種高效的方法能快速製作RWD響應式電子報，省下大約 90% 設計和調整排版的時間，那就是運用Meta8 CRM內建的拖曳式EDM版型。

圖片來源：Meta8 CRM顧客關係管理系統-拖曳式EDM版型

行銷人員不用編寫網頁原始碼、不需懂HTML程式語法，只要採滑鼠拖拉的方式即可於Meta8 CRM中輕鬆製作出在手機、平板電腦及桌機都友善閱讀的RWD電子報。在CRM系統發送電子報還有一個好處，能彈性選擇分眾行銷的活動對象(像是根據會員活躍度、消費貢獻度、先前購買偏好、地區、性別等多種條件)來群發電子報，達成精準行銷。換句話說，行銷人員在同一平台做到設計電子報、篩選收件名單(活動TA)、發送RWD電子報並查看分析報表，所有行銷活動皆在CRM系統上執行，幫助您的工作效率事半功倍。

延伸閱讀：為何電子報在Outlook跑版破圖? Outlook能群發EDM嗎? 10個問答，幫助企業秒懂行銷眉角

 

作者：Meta8 CRM 雲端高智能客戶關係管理
知名企業御用 CRM 品牌：會員分眾行銷 x 維繫良好顧客關係