Telefonnummernerkennung ausschalten und Text kopieren verhindern
Das Smartphone findet beispielsweise Telefonnummern auf Webseiten selbstständig und wandeln die Nummer automatisch in einen Link mit Anruf Funktion um. Wenn Sie allerdings keine Telefonnummern auf der Seite haben, sondern nur Nummern, die wie welche aussehen, könnte das für Irritationen sorgen. Sie können allerdings die automatische Telefonnummernerkennung ausschalten. Außerdem gibt es die Möglichkeit klickbare Telefonnummern und Mail Adressen auf einer Seite gezielt zu integrieren. Wie das alles funktioniert und Sie das Kopieren von Text auf Webseiten verhindern zeige ich Ihnen in diesem Artikel.
Automatische Telefonnummernerkennung ausschalten
Die automatische Erkennung der Zeichenketten kann zum Beispiel mit Hilfe des Meta-Befehls format-detection
beeinflusst werden. Mit folgendem Befehl im <head>
Ihrer Webseite können Sie die automatische Telefonnummernerkennung abschalten.
Dazu einfach diesen Code in den <head>
Bereich der Seite kopieren.
<meta name="format-detection" content="telephone=no">
Klickbare Telefonnummern
Sie können Telefonnummer ganz einfach mit Hilfe des HTML <a>
Tags klickbar machen. Der Code sieht wie folgt aus:
<a href="tel:+491751234567">+49 (0)175 123 456 78</a>
Bitte beachten das Sie die führende 0 weglassen und stattdessen das Länderkennzeichen einsetzen müssen. Zum Beispiel für Deutschland ist es die +49. Der Besucher der Seite kann nun direkt zum Anrufen auf die Nummer klicken. Er muss diese nicht mehr abtippen oder kopieren. Bitte beachten das Sie gegeben falls auf Desktop Browsern die Nummern ebenfalls anklicken können. Sie bekommen dann wahrscheinlich eine Fehlermeldung.
Klickbare Mail Adressen
Genauso wie Telefonnummer können Sie auch Mail Adressen klickbar machen. Der Code hierfür sieht wie folgt aus:
<a href="mailto:max.mustermann@domain.de">Max Mustermann, max.mustermann@domain.de</a>
Sobald Sie auf den Link klicken öffnet sich das Standard Mail Programm. Der Empfänger wurde schon automatisch hinzugefügt und Sie müssen nur noch den Mail Text eingeben.
Kopieren von Text auf Webseiten verhindern
Die user-select
Eigenschaft in CSS steuert, wie der Text in einem Element ausgewählt werden darf. Zum Beispiel kann es verwendet werden um Text unselektierbar zu machen. So können Sie das Kopieren von Text auf Websites verhindern.
Dies ist eine nützliche Funktion um das Kopieren von zum Beispiel Test der Website Besucher zu verhindern. Allerdings ist die Funktion ein bisschen fehlerhaft. Im Mozilla Firefox können Sie jeden Text, der mit diesem Selektor übereinstimmt, nicht kopieren. WebKit Browser wie zum Beispiel Google Chrome erlauben es noch, den Text zu kopieren, wenn Sie Elemente um ihn herum auswählen.
Dazu fügen Sie einfach beim gewünschten Element im CSS folgende Anweisungen ein.
-webkit-user-select: none; /* Chrome / Safari */ -moz-user-select: none; /* Firefox*/ -ms-user-select: none; /* IE 10+ */ user-select: none; /* Funktion */
Zurück
Super Beitrag, ich finde so sinnvoll klickbare Telefonnummern auch sind, manchmal nervt die automatische Nummernerkennung auch ziemlich.
Bezüglich des Hinweises beiden klickbaren Telefonnummern: Wenn man in WordPress arbeitet, hat man die Möglichkeit Seiten unterschiedlich zu bearbeiten, je nachdem ob man diese mobil oder vom PC aufruft. Wenn man also mobil den „tel:“-Link und am PC statt „tel:“ lieber „Skype:“ (nach Doppelpunkt den Skype-Namen oder die Telefonnummer einfügen) eingibt, bekommt hoffentlich niemand mehr eine Fehlermeldung.
Cheers
Chris