Email 簽名檔的圖片是個奇怪的設計題。它很小、被看的次數極多,而且得撐過三個幾乎沒有別的圖片要面對的條件——而尺寸是從這些條件推導出來的,不是來自任何官方規格。
很多郵件軟體在讀者點某個按鈕之前不會載入遠端圖片。對一個從來沒跟你通過信的人寄出的第一封信——而那正是簽名檔最有意義的場合——你的標誌有很大機率根本沒出現過。
由此得出兩個後果。
簽名檔必須以文字的形式讀得出來。姓名、職稱、公司、電話都要是真正的文字,不能放在圖片裡。這是最常見也最傷的錯誤:**把整個簽名檔做成一張圖**。被擋掉的時候,收件人看到的是一個空白方框,其他什麼都沒有。而且那些字沒辦法選取、沒辦法複製、搜尋找不到,就算載入成功,螢幕閱讀器也讀不出來。
替代文字不是選配。被擋掉的圖片會顯示它的 alt 文字,所以 alt="某某公司" 還是能把公司名傳達出去。空的 alt 屬性什麼都傳達不了。
現在每一塊螢幕都把兩個以上的實體像素塞進一個版面像素裡。一張「檔案尺寸剛好等於顯示尺寸」的圖,在所有這些螢幕上都是糊的。
解法是標準做法:用 2 倍匯出,然後在簽名檔的 HTML 裡明確指定顯示寬度。一個要顯示成 180 像素寬的標誌,用 360 匯出、顯示成 180。
那個寬度一定要寫。不寫的話圖片會以完整的 360 像素呈現,你的簽名檔就變成設計時的兩倍大。
那個 600 像素的上限,是大多數郵件版面的建構寬度。再寬就會在手機上出現水平捲動,而那在信件裡看起來「壞掉」的程度,是其他任何東西都比不上的。
現在很多郵件軟體用深色背景呈現訊息,有些還會自動反轉顏色。一個存成 JPG 的標誌會把它的白底一起帶著,於是在一封深色的信裡,它是一個漂浮的明亮白方塊。
用透明的 PNG,而且要檢查標誌在深色上長什麼樣。深色標誌配透明背景會幾乎看不見;帶一圈細白邊的版本,或者一個為深色背景設計的版本,兩邊都撐得住。
最簡單而穩健的答案,是一個在任何背景上都成立的標誌——用飽和的中間調,不要有接近白或接近黑的元素。
簽名檔會附在你寄出的每一封信上。一年一千封信,一個 300 KB 的簽名檔就是 300 MB 的傳輸和儲存——在你的寄件備份裡,也在每一個收件人的信箱裡。
還有第二個效應:某些系統會把大的簽名檔算進郵件大小上限,於是一個已經接近上限的附件就寄不出去,而寄件人看不出原因在哪。
目標是每張圖 20 KB 以內、整個簽名檔 50 KB 以內。一個 360 像素、純色構成的 PNG 標誌壓完只有幾 KB;如果你的不是,那它多半是一張存成 PNG 的照片。
連結的圖片放在網頁伺服器上,信件只引用它的網址。訊息維持很小,而且你可以一次更新所有地方的標誌——但那也正是會被擋掉的那一種。
內嵌的圖片跟著訊息一起走。它一定顯示得出來,但它的重量加在每一封信上,而且某些軟體會把它當成附件顯示——於是你的信件帶著一個迴紋針圖示抵達,暗示有一份其實不存在的文件。
對大多數人來說連結是比較好的預設;只要把網址維持穩定就好,因為圖片一搬家,你寄出去的每一封信的簽名檔都會壞掉。