版面品質比多數人預期的更影響成效
不少團隊把電子報簡化成先做一張吸睛宣傳圖。圖片若在手機上載入失敗,整封信就變成灰色空白,讀者無從理解你要傳達的內容。
閱讀數據顯示,行動裝置已占信件開啟的大多數,比例常超過六成。版面若沒有跟著小螢幕調整,等於一開始就流失近半潛在讀者。能隨裝置重排的信件不是裝飾,而是現在經營信件行銷時必備的能力。把純圖片信改成可讀的文件結構,只保留關鍵圖像,開啟表現常常就會好轉。
做好行動適配的八個條件
小螢幕先用單欄
大螢幕可以排兩欄或三欄,手機寬度卻很窄。單欄流程最符合手指閱讀:資訊由上而下展開,視線不中斷,也不必橫向拖曳。
把寬度控在安全範圍
桌面版面宜落在 600px。這個寬度在 Gmail、Outlook 與 Apple Mail 等常見環境裡較不容易被裁切。到了手機,則讓內容自動撐滿整個螢幕寬度。
按鈕尺寸要適合手指
手機點選靠指腹,不是滑鼠。可點區域至少 44×44px,四周再留出間距,才能降低誤觸。
只寫「點此」或「按這裡」,通常很難促成動作。改成「立刻領取試吃券」或「查看本月方案」這類具體承諾,點擊意願才會提高。穩定的寫法是一個動作,加上一個明確好處。
字級不能小到被略過
小螢幕上的文字一旦過細,收件人往往直接滑走。可先採用這些範圍:
- 標題:22-28px
- 內文:14-16px
- 行距:1.4-1.6 倍
控制圖文比例並補上替代文字
圖像與文字宜維持約 40:60。圖太多會拖慢載入,也提高被判為垃圾信的機會。若收件人正在通勤、網路不穩,圖出不來時,文字是否仍能獨立說完重點?每張圖都應附替代文字,因為許多收件程式預設不顯示圖片。
預覽列文字也要設計
預覽文字會出現在主旨旁或下一行,長度宜落在 85 到 100 個字元。它是主旨之外、最能影響是否打開的第二句話,適合補充承諾或留下懸念。
深色介面不能被忽略
把介面切成深色的人愈來愈多。避免白底搭配過淺的字,並確認標誌與圖像在深色背景仍清楚。使用透明底 PNG 時,更要先在深色模式下檢查。
退訂連結不可省略
法規要求每一封推廣信都提供明顯的退訂入口。這同時也是信任設計:當人感到可以隨時離開,把信標成垃圾郵件的動機通常會下降。
常用尺寸一覽
先對齊這些尺寸,能少掉許多跨裝置跑版:
| 規格項目 | 桌面 | 手機 |
|---|---|---|
| 版面寬度 | 600px | 螢幕寬度 100% |
| 標題大小 | 22-28px | 20-24px |
| 正文大小 | 14-16px | 14-16px |
| 按鈕寬度 | 200px 起 | 全寬,或至少 280px |
| 按鈕高度 | 44px 起 | 48px 起 |
| 行高 | 1.5 倍 | 1.5 倍 |
| 左右留白 | 20-30px | 15-20px |
| 圖像寬度 | 不超過 560px | 隨寬度縮放 |
收件軟體的支援也不一致:Gmail 多半不採用寫在 ANGLIA AI Chatbot