メールアドレスの難読化

機能

• 5つの形式を一度に：10進数の実体参照、16進数の実体参照、そのまま貼れる <a> タグ、パーセントエンコーディング、JS エスケープ
• 「@ と . だけを符号化」モード：ページ上の表示は平文とまったく同じまま、クローラーには使えない形になります
• そのまま貼れる完全なリンク —— href の中のアドレスも合わせて符号化します
• 行ごとに個別コピー可能。長い文字列から手で範囲選択する必要はありません
• すべてブラウザ内で完結し、アドレスがどこかへ送信されることはありません

使い方

1. 入力欄にメールアドレスを貼り付けるか入力します
2. 必要なら「@ と . だけを符号化」にチェックを入れます
3. 「そのまま貼れるリンク」の行をコピーし、ページのソースに貼り付けます
4. ブラウザで表示が正常か、クリックでメールソフトが起動するか確認します

よくある質問

本当にスパムクローラーを止められますか？

かなりの数は止められますが、全部ではありません —— その前提で使ってください。大多数のクローラーは単純な正規表現で HTML から `xxx@yyy.zzz` を拾いますが、実体参照にするとそのパターンが消えるため取りこぼします。ただし難読化対策専用のクローラーは先に HTML 実体参照をデコードしてから照合するので通用しません。つまり手間が小さく、効果も限定的な対策です：1分かける価値はありますが、スパムが全部解決すると期待したり、秘匿したいアドレスを隠す目的で使うのは避けてください。

「@ と . だけを符号化」に利点はありますか？

変更を最小限に抑えられます。ページの表示は `me@example.com` のまま（ブラウザが `&#64;` を @ に戻すため）で、ソースには連続した `me@example.com` がどこにも残りません。利点は、後で自分がソース内をこのアドレスで検索しても大部分（`me` と `example` は平文）が見つかるので、保守で迷わないことです。代償は防御がわずかに弱くなることですが、経験のあるクローラーにはどちらでも大差ありません。

貼り付けたらクリックが効かない・表示がおかしい

まず、どの行を貼ったかを確認してください。「そのまま貼れるリンク」の行はそれ自体が完全な `<a href="mailto:…">…</a>` なので、本文にそのまま置けます。アドレスのテキストだけ欲しい場合は実体参照の行を使ってください。また、Markdown やリッチテキストエディタ、一部の CMS の WYSIWYG モードに貼ると、エディタが実体参照をさらにエスケープして `&amp;#109;` にしてしまうことがあります —— その場合ブラウザには `&#109;` という文字列がそのまま表示されます。HTML ソースモードに切り替えてから貼り付けてください。

もっと確実な方法はありますか？

確実さの順に3つあります。第一に平文で公開しないこと —— お問い合わせフォームにするか、訪問者から声をかけてもらう形にします。第二に画像に置き換える方法（クローラーは読めませんが、スマートフォンでのコピーが面倒で、スクリーンリーダーが読み上げられないというアクセシビリティ上の問題があります）。第三に、ページ読み込み後に JS でアドレスを組み立てる方法で、実体参照より強力ですが JS を無効にした訪問者には見えません。実際には、たまに投稿する個人サイトなら実体参照で十分、商用サイトはフォームにするのが結論です。