Kemmerzell.org


CSS: E-Mail-Adressen verbergen

Von Maximilian · 21.06.2014 · Kategorie: CSS

Unter bestimmten Umständen möchte man seine eigene E-Mail-Adresse auch auf der eigenen Website veröffentlichen. Dies geschieht besonders häufig im Impressum. Aber auch in anderen Fällen kann dies Sinn machen, um mit den Lesern in Kontakt zu treten. Doch wenn man die eigene E-Mail-Adresse einfach auf der Website veröffentlicht, wird man schnell feststellen, dass man deutlich mehr Spam-Nachrichten bekommt und das eigene Postfach damit zum Teil zugeschüttet wird. Daher gibt es verschiedene Möglichkeiten, um die eigene E-Mail-Adresse mit Hilfe von CSS zu verbergen, sodass diese für Leser und Besucher zwar auffindbar ist, aber nicht so einfach für Spam-Nachrichten missbraucht werden kann.

Zusätzlicher und unsichtbarer Text

Eine dieser Möglichkeiten, um die eigene E-Mail-Adresse zu verschleiern, ist das Einbauen zusätzlicher Text-Elemente. Diese sollen für normale Leser und Besucher aber natürlich unsichtbar sein. Daher kann man sich dabei die CSS-Eigenschaft display:none; zu nutze machen. Angewendet auf eine E-Mail-Adresse könnte dies dann folgendermaßen aussehen:

Nun befindet sich in der E-Mail-Adresse zusätzlicher Text, der dazu führt, dass Spam-Nachrichten in der Regel nicht im eigenen Postfach landen. Trotzdem bekommen normale Besucher aber die normale E-Mail-Adresse angezeigt, da bei diesen der zusätzliche Text ausgeblendet wird. Bei dieser Methode kann allerdings kein mailto-Link eingefügt werden. Denn auch E-Mail-Programme würden dann den zusätzlichen Text übernehmen und damit die E-Mail an eine falsche Adresse schicken.

Falsche Schreibrichtung

Es gibt jedoch noch eine weitere Variante, um die eigene E-Mail-Adresse zu verschleiern. So kann man mit den beiden CSS-Eigenschaften unicode-bidi und direction die Richtung des Textflusses verändern. So kann man die eigene E-Mail-Adresse spiegelverkehrt angeben und diese wird den Nutzern der eigenen Website dennoch richtig angezeigt. Bots können die E-Mail-Adresse hingegen nicht so einfach lesen und damit auch keine Spam-Nachrichten an diese Adresse schicken.

Um diese Methode nutzen zu können , braucht man aber erstmal eine weitere CSS-Klasse. Diese könnte beispielsweise so aussehen:

Ausgeben kann man die eigene E-Mail-Adresse dann einfach mit einem span-Element der Klasse ruck. Dabei muss man dann aber eben auch beachten, dass man die E-Mail-Adresse korrekt in der falschen Richtung bzw. spiegelverkehrt angibt. Dies würde dann folgendermaßen aussehen:

Und obwohl die E-Mail-Adresse spiegelverkehrt angegeben wurde, sieht sie bei den normalen Besuchern und Lesern dann trotzdem folgendermaßen aus:

information@kemmerzell.org

Damit können diese die Adresse ganz normal lesen. Wollen diese die E-Mail-Adresse aber kopieren, stehen sie vor einem Problem. Denn wenn man diese Adresse nun kopiert, wird sie auch spiegelverkehrt kopiert. Die Leser müssen diese dann also selbst noch umdrehen oder die Adresse eben direkt selbst abschreiben. Außerdem kann so auch kein mailto-Link angegeben werden und ältere Browser werden auch nicht unterstützt. Denn bei diesen wird die E-Mail-Adresse dann trotzdem spiegelverkehrt angezeigt. Damit ist diese Variante leider nicht sonderlich praktikabel.

Fazit

Es ist also durchaus möglich mit Hilfe von reinem CSS und HTML die eigene E-Mail-Adresse auf der eigenen Website zu verschleiern. Darunter leidet aber immer die Benutzerfreundlichkeit, da so keine mailto-Links genutzt werden können und die E-Mail-Adressen auch nicht einfach kopiert werden können, sondern wirklich abgeschrieben werden müssen. Daher sollten diese Methoden wirklich nur genutzt werden, wenn man wirklich regelmäßig von Spam-Wellen überrascht wird und diese klar auf die eigene Website zurückzuführen sind. Dann sollte man sich aber auch überlegen, ob man nicht auf einem anderen Wege die Leser kontaktieren möchte. Anbieten würden sich dazu soziale Netzwerke.

Alternativ zu der Lösung mit reinem CSS und HTML kann man die eigene E-Mail-Adresse aber auch mit einem kurzen JavaScript-Code verbergen, sodass diese nur normale Leser und Besucher finden können. Dabei muss man aber bedenken, dass nicht alle Nutzer JavaScript in ihrem Browser zugelassen haben und so nicht alle Nutzer die E-Mail-Adresse angezeigt bekommen. Als letzten Schritt könnte man die E-Mail-Adresse dann natürlich auch noch in Form eines Bildes anzeigen. Doch auch das kann zu Problemen führen und ist keine Alternative für das Impressum.

Es gibt also schon genug Möglichkeiten, um die eigene E-Mail-Adresse auf der eigenen Website zu veröffentlichen, aber diese gleichzeitig zu verschleiern. Man muss sich dabei aber auch immer ganz genau überlegen, ob man diese Methoden wirklich einsetzen möchte.

Kommentieren Teilen +1 Twittern
Dieser Artikel wurde von +Maximilian verfasst.
Kommentare
Einen eigenen Kommentar hinterlassen




Newsletter

Um unseren Newsletter zu abonnieren, tragen Sie bitte einfach Ihre Email-Adresse unten ein. Sie werden daraufhin eine Bestätigungsmail erhalten!

Jetzt den RSS-Feed abonnieren!

Klicke hier und abonniere den RSS-Feed, um immer auf dem neusten Stand zu bleiben.

Tipp senden

Du hast etwas entdeckt, über das wir noch nicht berichtet haben? Dann schicke uns doch einen Hinweis zu!

Klicke einfach auf den unteren Button, fülle das Formular aus und wenn das Thema passt, erscheint bei uns schon bald ein Artikel zu deiner Entdeckung.

Jetzt Tipp senden!