メールアドレス暗号化
いわゆる、スパム(迷惑メール)対策メールアドレス表記です。
スパム用のメールアドレス収集ボットに見つからないようにアドレスを暗号化し、表示するためのタグを作ります。
生成されたタグは、すべてのブラウザで問題なく使えます。このページ自体はHTML5 に対応したブラウザで動作します。
使い方
7) 上記コードの、実際の動作を確認できます
8) 自分のサイトへの設置方法
- まず、好きな「メールアドレス画像」を選んでください。
- 選んだ画像を、右クリックして「名前をつけて保存」してください。
名前は m.png にします。
うまくいかないブラウザもあるようです。この場合、画像をデスクトップにドラッグで保存します。
(具体的な操作はブラウザごとに微妙に異なります。) - あなたの HTML ファイル中の、メールアドレスを表示したいところに、表示コードをコピー&ペーストしてください。
- 画像と HTML ファイルを同じディレクトリにおきます。
これで、HTML ファイルをブラウザで開けば、表示が行われます。
表示された画像をクリックすれば、メーラ-が起動します。
9) よりよい一歩
- フォントリストを編集すれば、任意のフォントで描画できます。
システムに標準で備わっているフォントは全標準フォント一覧を参照に探すとよいかと思います。 - PNG ファイルは全く最適化されていません。Javascript で生成しているので、複雑なことはできないのです。
PunyPNGなどで最適化すると、劇的にサイズが減ります。 - メールアドレス画像は、「リンクテキストのふり」をするように作っています。
色なども、ご自分のページのリンク色に合わせて選ぶとよいでしょう。 - メールアドレスが本当に OCR できないか、市販の OCR ソフトや WeOCR プロジェクトで試してみるとよいでしょう。
(WeOCR のほとんどのサーバーは PNG には対応していませんので、自前で形式変換する必要があります) - 設置後は、メールアドレス収集ロボットを使って収集試験してみましょう。
なんか間違えていたら(もしくは、このページの方法への対策が取られる時代になったら)収集されるでしょう…
10) 技術事項
当ページで生成された「ボット対策メールアドレス表示」は、すべてのブラウザで問題なく動作します。
- JavaScript が動作しない場合、メーラーとの連携はできませんが、メールアドレスは表示されます。
- 画像表示できないブラウザ、たとえば Lynx や w3m であっても、IMG タグを解釈して外部アプリに渡すことはできるので、問題なくメールアドレスを表示できます。
- もしも、IMG タグを解釈できず、絶対に画像表示ができないブラウザ… いまどき存在しませんが、歴史上のWorldWideWeb やラインモードブラウザ、ViolaWWW で見たとしても、問題は出ません。
HTML の仕組みでは「知らないタグは無視」します。当ページで生成するコードは、一つの IMG タグの中にすべてが納まっていますので、メールアドレス表示ができない、ということ以外の問題は一切生じません。
当ページの「ボット対策メールアドレス表示コード生成機能」は、HTML5 ブラウザで動作します。以下のブラウザでは動作確認していますが、他のブラウザは未確認です。
Windows
IE 9 、Chrome 13 、Safari 5.1、Firefox 6.1、Opera 11.60
Windows 上の Safari で Canvas を使って文字を描くと、なぜか描画が汚いです…
Linux
CentOS 5.6 上の Firefox 3.6.18 および FireFox 6.1
Netwalker (Ubuntu 9.04 ARM) 上の Firefox 3.6.10 および Chromium-browser-nnc 13
html5 canvas 文字列描画の技術についてはこちらへ
2011. 9. 8 ページ作成
2011. 9.14 フォントの実際の高さを自動計測し、最適化するよう改良。
2011.12.28 生成コードを、さらに5バイト短縮。
2012. 1.19 暗号方式を変更。生成コードがさらに20バイト短縮。
2012. 1.26 生成コードを、さらに5バイト短縮。
2012. 9.17 生成コードを、さらに7バイト短縮。そろそろ限界か?
2011. 9.14 フォントの実際の高さを自動計測し、最適化するよう改良。
2011.12.28 生成コードを、さらに5バイト短縮。
2012. 1.19 暗号方式を変更。生成コードがさらに20バイト短縮。
2012. 1.26 生成コードを、さらに5バイト短縮。
2012. 9.17 生成コードを、さらに7バイト短縮。そろそろ限界か?