為什麼電子郵件設計很重要：電子商務和行銷的重要性。
字型和版式
字體大小：
行動和桌面電子郵件的建議尺寸
為了提高行動電子郵件的可讀性，您通常需要遵循以下字體大小：
- 主體：14-16px 是一個不錯的範圍。無需縮放即可輕鬆閱讀。
- 標題：22-27px 非常適合標題。你希望它們脫穎而出，但又不會讓人難以招架。
- 副標題：大約 18-22 像素。它們應該大於正文但小於主標題。
- 號召性用語按鈕：按鈕內的文字應至少為 14 像素，以便於點擊。
- 印刷精美：保持至少 12 像素，以便清晰易讀，但顯然是次要的。
可讀性是關鍵，尤其是對於想要引導讀者採取行動的電子商務。請務必在多個裝置上測試您的電子郵件，以確保它們看起來不錯！
字體類型
襯線與無襯線。
在電子郵件設計方面，襯線字體和無襯線字體之間的選擇可以產生真正的差異。以下是真相：
襯線字體
- 例子：喬治亞州 Times New Roman
- 氛圍：較傳統，通常被視為正式或學術。
- 最適合：可讀性至關重要的長篇內容。
- 但：在小螢幕上可能會顯得混亂，因此在行動電子郵件中請謹慎使用。
無襯線字體
- 例子：Arial、Helvetica、Verdana
- 氛圍：現代、乾淨、休閒。
- 最適合：內容簡短、活潑，具有行動可讀性。
- 為什麼：更容易在小螢幕上閱讀並給人一種現代感。
電子郵件設計技巧
- 一致性：堅持使用一種或兩種字體以保持設計的凝聚力。
- 網路安全字體：使用在所有電子郵件用戶端上都能正常顯示的字體。
- 等級制度：對標題和正文使用不同的字體或樣式來創建視覺層次結構。
- 測試：始終測試字體在不同裝置和電子郵件用戶端上的呈現方式。
鑑於我們對電子商務的關注，您可能會傾向於無襯線字體，因為它具有現代感和行動可讀性。
但如果您要發送教育內容，襯線字體可以增添一絲權威感。根據您的品牌和訊息進行選擇！
行間距
最佳間距對於電子郵件的可讀性非常重要。
- 主體：目標是字體大小的 1.4 至 1.6 倍。因此，如果您的字體大小為 16 像素，則行間距約為 22 像素到 26 像素。
為什麼行間距很重要
- 可讀性：適當的行間距可以防止文字感覺局促，從而更易於閱讀。
- 略讀性：良好的間距可以幫助讀者瀏覽內容，這是大多數人閱讀電子郵件的方式。
行距提示
- 一致性：在整個電子郵件中保持行間距一致，以獲得一致的外觀。
- 標題和副標題：它們的間距可以稍微緊湊一些，因為它們通常更大、更粗。
- 移動的：在不同設備上進行測試，以確保整體間距看起來良好。
對於您的電子商務電子郵件行銷活動，行距可以幫助引導讀者的注意力到 CTA 和關鍵訊息。所以，千萬不要忽視它！
圖片與媒體
推薦尺寸 用於電子郵件影像
- 全寬影像：600-800 像素寬。這適合大多數電子郵件用戶端的預設寬度。
- 內嵌或浮動影像：200-300 像素寬。這些是位於文字旁邊的圖像。
- 英雄形象：800-1200 像素寬。這些是頂部引人注目的大圖像。
- 號召性用語按鈕：至少 44x44 像素，以便在行動裝置上輕鬆點擊。
其他提示
- 縱橫比：堅持使用 16:9 或 4:3 等常見比例，以確保影像縮放良好。
- 文件大小：如果可能的話，請將其保持在 100KB 以下，以加快加載速度。
- 高 DPI 螢幕：考慮視網膜顯示器並使用更高解析度的影像，但對其進行壓縮以保持較小的檔案大小。
影像格式 在電子郵件中
- JPEG：適合具有多種顏色的複雜影像。
- 巴布亞紐幾內亞：最適合簡單的圖像、文字和標誌。
- 動圖：對於簡單的動畫。
鑑於您專注於電子商務，清晰且快速加載的圖像可以使您的產品看起來很有吸引力並保持用戶的參與度。始終在多個設備上進行測試，以確保一切看起來都很好！
電子郵件中圖像的替代文本
無障礙
- 視障人士：螢幕閱讀器使用替代文字來描述圖像。
- 合法合規：幫助您符合 ADA 等輔助功能標準。
- 電子郵件用戶端中的圖像阻止：某些客戶端預設阻止影像。替代文本提供上下文。
搜尋引擎優化的好處
- 搜尋排名：雖然不會直接影響電子郵件，但良好的替代文字實踐可以幫助整體 SEO 策略。
- 當您有一個用於傳出新聞通訊的公共存檔頁面時，就會發生這種情況
使用者體驗
- 網速慢：如果圖像未加載，替代文字會提供上下文。
- 澄清：描述圖像（如果圖像複雜或包含重要資訊）。
最佳實踐
- 描述性的：「藍色女式跑鞋」比「鞋子」更好。
- 簡潔的：保持簡短但資訊豐富。
- 關鍵字：使用相關關鍵字，但避免關鍵字堆砌。
影片嵌入到電子郵件中
在電子郵件中加入影片可以提高參與度，但也有一些注意事項。以下是您可以涵蓋的內容：
優點
- 訂婚：影片可以提高點擊率。
- 資訊：更容易傳達複雜訊息或展示產品。
缺點
- 相容性：並非所有電子郵件用戶端都支援嵌入影片。
- 載入時間：大量影片會減慢電子郵件載入速度。
最佳實踐
- 後備影像：使用連結到影片的縮圖，以防嵌入不起作用。
- 電腦輔助科技協會：新增播放按鈕覆蓋層以鼓勵點擊。
- 簡短而甜蜜：影片要簡短，最好在 2 分鐘內。
- 自動播放：一般情況下避免使用；讓用戶選擇播放影片。
如何
- HTML5：對於支援的電子郵件用戶端，您可以使用 HTML5 標籤進行嵌入。
- 第三方服務：Vibetrace、Mailchimp 等平台通常具有內建影片選項。
電子郵件中嵌入影片的替代方案
- 動圖：簡短的循環 GIF 可以提供類似影片的體驗。
- 連結縮圖：連結到其他地方託管的影片的靜態圖片。
測試
- 多個客戶端：測試影片在不同電子郵件用戶端的顯示效果。
- 移動的：確保它適合行動裝置。
電子郵件設計的佈局和結構
單列佈局與多列佈局: 優點和缺點。
單列佈局
優點
- 適合行動裝置：在較小的螢幕上更容易縮小。
- 專注：以線性、直接的方式引導讀者。
- 簡單：設計更容易，載入速度更快。
缺點
- 內容有限：不適合包含多個部分的複雜訊息。
- 動態較小：可能無法像多列佈局那樣有效地吸引註意力。
多欄佈局
優點
- 內容豐富：非常適合展示各種產品或主題。
- 視覺吸引力：更具活力和吸引力。
- 分層的：允許更複雜的資訊結構。
缺點
- 複雜：設計較困難，且可能無法在所有設備上呈現良好。
- 壓倒：混亂或資訊過載的風險。
電子商務重點提示
- 單柱：最適合產品發布或特別優惠等重點活動。
- 多欄：非常適合新聞通訊或展示一系列產品。
單列和多列之間的選擇應符合您的內容策略、訊息的複雜性以及目標受眾的偏好。始終測試這兩種佈局，看看哪種佈局最能與您的電子商務受眾產生共鳴！
空白在電子郵件設計中的重要性
在設計中，空白具有特殊的重要性。使用空格有很多優點，但對於電子郵件來說，最重要的是：
可讀性和呼吸空間： 文字和元素之間的間距使內容更容易理解。
焦點與注意力：空白可以將讀者的注意力引導到 CTA 等重要元素。
專業和乾淨的外觀：整齊的設計看起來更專業、更值得信賴。
使用者體驗和可略讀：幫助讀者瀏覽內容，這是大多數人閱讀電子郵件的方式。
行動體驗和點擊友好：額外的空間可以更輕鬆地點擊行動裝置上的按鈕。
對於您的電子商務電子郵件，空白可以幫助引導讀者執行關鍵操作，例如購買或查看新產品。這不僅僅是空曠的空間；這是一個功能性的設計元素！
移動響應能力
確保它在所有設備上看起來都不錯。有一個更高的確定性是 行動裝置 人們更多地使用桌面設備來閱讀電子郵件。
確保您的電子郵件具有響應能力並能夠適應行動螢幕不是一種選擇，而是開始設計電子郵件的方法。
電子郵件中的號召性用語 (CTA)
- CTA 安置：將它們放置在哪裡才能產生最大的影響。
- CTA 按鈕設計：尺寸、顏色、文字。
使用者體驗（UX）
載入時間
電子郵件載入時間的重要性（取決於圖片的大小和數量）
- 使用者體驗：電子郵件載入緩慢可能會讓使用者感到沮喪並導致參與度降低。
- 行動用戶：他們經常在旅途中，不會等待緩慢的內容。
- 優化影像：保持檔案大小小但品質高。
- 最小化程式碼：乾淨、簡單的 HTML/CSS 載入速度更快。
- 較短的電子郵件：雖然嘗試在電子郵件中添加很多內容可能更容易，但保持簡短實際上會更好。
- 電子郵件剪輯： 某些電子郵件用戶端（例如 Gmail）會在電子郵件超過一定大小時剪輯它們。
- 測試：始終測試各種裝置、電子郵件用戶端和解析度的載入時間。
導航
郵件導航
- 內容發現：對於較長的電子郵件（例如時事通訊），導航可以幫助用戶找到他們感興趣的內容。
- 商品交易顧問：清晰的導航可以引導使用者採取行動。
- 菜單：對於內容非常豐富的電子郵件，頂部的小菜單可能會有所幫助。
- 等級制度：使用標題和副標題來分解內容並引導讀者。
無障礙
電子郵件中的字體選擇
- 字體選擇：簡單、乾淨的字體更易於閱讀。
- 字體大小：堅持可讀的大小，一般為 14-16 像素的正文文字。
- 螢幕閱讀器：使用螢幕閱讀軟體測試您的電子郵件以確保其易於存取。
- 字體可用性: 使用自訂字體（裝置上未預設安裝）時，請確保字體檔案已正確載入。
色彩對比
- 可讀性：文本和背景之間的高對比度提高了可讀性。
- 無障礙：幫助視力障礙或色盲的人。
- 文字與背景：目標是在淺色背景上顯示深色文本，反之亦然。
- 商品交易顧問：確保按鈕突出但清晰易讀。
- 工具：使用對比檢查器來測試您的顏色選擇。
