Thiemos Archiv
- Monday, 2006-01-02 20:26
- Ich habe mir eine kleine, weitestgehend barrierearme Schutzmethode gegen das automatisierte Auslesen von E-Mail-Adressen ausgedacht. Die Technik basiert auf CSS, funktioniert sogar mit Internet Explorer 5.0 und kommt ohne Grafiken und JavaScript aus. Sie ist in erster Linie für zu druckende Dokumente geeignet. Die Adresse erscheint am Bildschirm und auf dem Papier in ihrer ganz normalen Schreibweise und in der ganz normalen Schriftart (im Gegensatz zu auf Grafiken basierenden Lösungen). Beim Anklicken wird man dagegen zu einem zugehörigen E-Mail-Formular geleitet. Im Quelltext sieht das wie folgt aus.<style>
.spamschutz{text-transform:lowercase;}
.spamschutz span{display:none;}
</style>
<span class="spamschutz">
<a href="http://www.example.com/kontakt">
K.<span> </span>Mustermann
<span>s Kontakt-Formular </span>
@<span> </span>Example.com
</a>
</span>Achtung: Ich habe hier nur der besseren Übersicht wegen Zeilenumbrüche eingefügt. Von
<a…bis</a>muss alles in einer Zeile stehen, ohne Leerzeichen dazwischen. Außerdem sollten die verwendeten Stilangaben in eine CSS-Datei ausgelagert werden.Wenn der Besucher mit einem normalen, CSS-fähigen Browser unterwegs ist, bekommt er die zusätzlichen Textfragmente nicht zu Gesicht. Der hexadezimale Code 40 wird als das gewünschte At-Zeichen angezeigt. Die E-Mail-Adresse sieht somit ganz normal aus und wird auch so gedruckt: „k.mustermann@example.com“. Besucher ohne Stylesheets (das schließt Suchmaschinen-Roboter ein) werden dagegen folgende Linkbeschriftung lesen: „K. Mustermanns Kontakt-Formular @ Example.com“. Ein Spam-Roboter wird damit nichts anfangen können. Ein menschlicher Besucher wird jedoch verstehen, dass es sich hierbei um einen zwar etwas merkwürdig aber verständlich beschrifteten Link zu einem Kontakt-Formular handelt.
Mit den Pseudoklassen
:beforeund:afterließe sich diese Methode noch weiter verfeinern, würde dann aber nicht mehr im Internet Explorer (bis einschließlich 6.0) funktionieren.Einen Nachteil hat die Methode: Beim Kopieren der Linkbeschriftung in die Zwischenablage wird die Langfassung übernommen, da die Browser in diesem Fall die Stilangaben ignorieren (Ausnahme: Opera). Will man die E-Mail-Adresse übernehmen, muss man sie also wie bei den auf Grafiken basierenden Lösungen abtippen.
Kommentare zu diesem Beitrag können per E-Mail an den Autor gesandt werden.