網頁上隱藏 Email Address

除了把顯示換成圖形顯示之外,連結也可以運用一點小技巧。

維護網站、Blog 的人,應該都會留下一些連絡的方式,最常見的就是留下 E-Mail address 讓別人有問題就可以寄封信跟你聯絡,但如果大刺刺留下 E-Mail address 的文字,一定會被一些奇妙的 bot 擷取到,然後就狂塞猛送一堆 spam 給你,所以最常見的防範方式,就是把 email address 作成一個難以 recognize (如果還是很單調的文字,可能還是會有 bot 鎖定這些目標作 PR 吧)的 icon。

而另一種情況,為了讓瀏覽者方便,網頁上常常會留下一個 Contact 或是上述的 icon 然後設一個連結 mailto: 到你的網頁位址,就像這樣:

Contact Me

一但瀏覽者點擊這個連結,便可以直接開啟預設的郵件程式來撰寫郵件。但這樣的訊息對於邪惡的 bot 根本就是毫無設防,那要如何加密這樣的訊息,但使用者點擊時又不會不方便呢?我想了一個用 JavaScript 來處理的簡單方式(大概不是原創吧!不過我沒看過就是了),把上面的 code 作一些修改:



這裡用的方式是把 A-Z 及 a-z 的 ascii code + 3 後換成新的字串,所以 decode 的方式就是把它 - 3 後再輸出囉。而且把 "@" 這個字元換成八進位的 100 來表示(ASCII code: 64),才不會讓 bot 認定它可能是個 email address。

當然要 shift 幾個位址可以隨你調整,要加密的話可以依樣畫葫蘆寫一個反向的 function 來作加密囉。