終於，將舊版電子報改版了~
為了之後方便維護，除了LOGO圖片、上方主要插圖以外，其他皆為服務商提供的書籍封面圖，而且HTML 也很簡潔....
在這邊要說明一下
在編輯電子報HTML格式時，有幾個注意的地方。一般人常常收到來自各家平台的電子包廣告信件，這些HTML格式電子報郵件設計和一般網頁標準化有很大個不同，為甚麼呢?
因為收信的cliend軟體太多元了，對W3C網頁格式的支援也不同，所以編輯設計電子報時候，HTML、CSS的撰寫也要注意
1. 不使用DIV來編輯排版HTML，務必使用table。
在上圖這份電子報，我所使用個編輯格式為 :
<html>
<body>
<div id="w-100">
<h1>......</h1>
<table>內容區域</table>
</div>
</body>
<html>
這裡的DIV其實是因為在頁尾處設計了連續背景圖 (圖片中斜長型背景)，並不影響本身結構。
然後在定義出h1，主要是因為網頁搜尋SEO的關西。內容開始則為<table></table>來排版了。
2.圖片路徑為「絕對路徑」
因為不知道什麼情況下又會有使用者破圖情況，為了盡量避免破圖問題，因此在設計上都是單張圖，另外圖片路徑為「絕對路徑」，收mail的人只有收到一個htm原始碼，由原始碼讀取圖片所放置的網頁空間。
3.圖片請務必加上width/htght ，並且定義好 alt 。
4.CSS不可以使用css link的方式，而是要寫入html 的inline Css
5.不要使用影片及flash 相關tag
6.不使用javascript
7.EDM 文末加入「取消訂閱此電子報」的連結
現今垃設廣告郵件非常氾濫，為了避免被spam 也請加入。
*有些電子報在mail裡面呈現時有白邊，是因為chrome、其他broeser 收Gmail瀏覽EDM 圖片會被主動加入margin，解決的方法是在img tag 上加入 {display:block } 即可消除部必要的空白間隙。
0 意見
張貼留言