メールアドレスの収集に立ち向かう

メールアドレス収集ボットにメールアドレスをぶっこ抜かれないよう画像などで表示することがありますが、たまにこの画像をアンカータグでマーカップしてるページを見かけます。
これってあんま意味ないですよね。アンカータグの href 属性をチェックされたら一発でアウトです。
と言うわけで、JavaScript と UTF-8 の制御文字を使って「見た目と中身がちょっと違うメールアドレスのリンク」を作ってみました。

制御文字

Unicode には制御文字という種類の文字が存在します。細かい説明は割愛しますが、文字自体を制御する機能を持った小さな制御コードというような概念です。
で、WindowsXP だとエクスプローラなんかでファイル名入力するとき、コンテキストメニューに「UNICODE 制御文字の挿入」というのがあると思います。でさらにこの UNICODE 制御文字に「LRO」ってのと「RLO」ってのがあると思います。

UAX #9: The Bidirectional Algorithm によると

The following codes allow the bidirectional character types to be overridden when required for special cases, such as for part numbers. These codes allow for nested directional overrides.

RLO	Right-to-Left Override	Force following characters to be treated as strong right-to-left characters.
LRO	Left-to-Right Override	Force following characters to be treated as strong left-to-right characters.

The precise meaning of these codes will be made clear in the discussion of the algorithm. The right-to-left override, for example, can be used to force a part number made of mixed English, digits and Hebrew letters to be written from right to left.

とあります。要は「この制御文字以降の文字の表示方向を変える」という意味合いのものです。
実用とはかけ離れた使い方ですが、ダメっつうことはないと思います。

メールアドレスだけ右から左に表記

例えば

スパンコール丼

‮丼ルーコンパス‭

この二つは見た目は同じだけど下の方は実際には「丼ルーコンパス」と入力されています。
この「丼ルーコンパス」の直前に RLO を、直後に LRO を挿入することで「丼ルーコンパス」部分だけが「右から左に表示」と言うことになります。

どうやって入力するの？

実体が入力できれば問題ないのですが、キーボードで入力できるわけではありません。
直接入力したい場合、WindowsXP で Microsoft IME を利用しているならば、IME パッドの文字一覧から選択することが可能です。
デフォルトではおそらく Shft_JIS となっているかと思いますので、まず Unicode を選択します。
LRO のコードは \u202D で、RLO は \u202E ですので、大体”一般句読点”のグループ辺りに存在します。
表記される文字なり記号なりがあるわけではないので、空白となっていますので、マウスオーバーで表示されるコードを参考に選択してみて下さい。

そんな面倒なことアレだ！と言う向きもおられるかと思います。そういう方は数値実体参照で入力なさってもよろしいかと。
LRO のコードは \u202D ですので、10進数で表した数値実体参照は ‭ となります。
同様に RLO ならば \u202E ですので、数値実体参照は ‮ となります。

文字コードの表や実体参照に関しては

• Category:Unicode表 – Wikipedia
• 文字参照 – Wikipedia

辺りを参考にして下さい。

アンカータグっぽく

さて、表記を逆方向に変えたとしてもそれがアンカータグの場合正常なメールアドレスだと判断してくれはしません。当たり前ですね。
さらに普通にアンカータグを書くのも意味が無いので却下。と言うことで閲覧者の環境に左右してしまいますが JavaScript を使ってアンカータグの様な働きを作ります。

ソースはこんな感じに。

document.getElementById("mailto").onmouseover = function(){
    document.getElementById("mailto").style.cursor = "pointer";
    document.getElementById("mailto").style.color  = "#e4007f";
};
document.getElementById("mailto").onmouseout = function(){
    document.getElementById("mailto").style.cursor = "normal";
    document.getElementById("mailto").style.color  = "#444444";
}
document.getElementById("mailto").onclick = function(){
    var result = "mailto:";
    var i = 0;
    var m = ["77", "6f", "72", "6b", "73", "40", "53", "50", "61", "69", "53", "2e", "6a", "70"];
    while(true){
        if(i > m.length - 1) break;
        result = result + "%" + m[i];
        i ++;
    }
    location.href = result;
}

CSS 的な表現部分は割愛するとして、メールアドレスを生成するのに逆向きのメールアドレスを span タグなどでマーカップし、id 属性を mailto としています。
そして、URL エンコードで表現したメールアドレスをさらに % を取り除いて配列に格納しています。
これを while で1文字ずつ連結して location.href に渡すことでアンカータグと同様の働きをさせています。

※アルファベットと半角で表現できる記号は Unicode でも Ascii 互換ですので、URL エンコードしたとしてもコード自体は Ascii と同じです。

効果はあるのか

結局こういうのはいたちごっこなわけで、この方法に対応した解析を行われてしまえば意味はありません。
しかし少なくとも単純にメールアドレスの形式を持った文字列を収集するだけのボットであれば、上記で生成したメールアドレスがメールアドレスだと認識できることはないので、多少なりとも効果があるのではないでしょうか。
上記のソースは方法論として例に挙げただけなので、実際に使う際には独自のスクランブル（逆から連結とか、順番に応じてコードを計算するとか）を織り交ぜてさらに難読化することで、ボットの収集を防げるのではないかと思います。

デメリット

当然ながら Javascript が有効でないと全く動作しません。ページの文字コードも Unicode である必要があります。
連絡手段として 100% 開放できるわけではないので、確実性が要求されるシーンで利用されることはお勧めしませんが、個人的なものであればこの程度は問題ないかと思います。

そんな回りくどい事しなくても、こんな方法があるぜ！と言う情報がありましたらコメントでも ○○@△△（誰かに突っ込まれる前に見事に収集されたので削除：2007/11/16） までメールでもお寄せいただければ助かりマスク。