Ideal zum Lernen:
Kurs als Videos
Video-Kurs HTML5, CSS
& Webdesign
HTML-Kurs, CSS u. Webdesign lernen & die eigene Website erstellen
Videos eBook Forum Kontakt

klickbare Telefonnummern für Handy-Besucher <a href="tel:"

Immer mehr Nutzer surfen mit ihrem Handy durch das Internet. Hier sollte es selbstverständlich sein, wenn eine Telefonnummer auf der Website gezeigt wird, dass diese einfach durch Klick dann vom Mobiltelefon gewählt wird!

Über normales HTML können Telefonnummern direkt anklickbar gemacht werden und werden dann vom Handy genutzt, um direkt telefonieren zu können.

Dieser Funktion kam mit HTML5 – sollte also ein alter Browser diesen Link sehen, wird dieser ordnungsgemäß angezeigt (nur die Funktion der Telefonwahl fehlt). Wir haben also primär Vorteile und keine Nachteile, wenn wir unsere Telefonnummern so anbieten.

Der Aufbau in HTML:

Anrufen unter: 
<a href="tel: 49123456789"> 49 (0)123 456789</a>

Bei Klick wird die Telefon-App am Handy geöffnet und der Besucher kann bequem nun die Nummer anrufen (ohne Tipparbeit und vor allem ohne Tippfehler!)

Wichtig ist:

  • unser Link wird ergänzt mit „tel:“ (ohne die 2 Slash „//“ dahinter!)
  • die internationale Vorwahl muss vorhanden sein mit +49 (+49 steht für Deutschland, für andere Länder bitte die entsprechende internationale Vorwahl eintragen)
  • die erste 0 von der Ortsvorwahl wird entfernt. Unsere Nummer aus dem obigen Beispiel (diese existiert nicht) wäre eigentlich 0123 456789
Telefonieren über FaceTime-App durch href=tel:

Ist man auf einem Mac unterwegs, wird beim Klick auf die Telefonnummer die FaceTime-App vorgeschlagen bzw. für Android-Smartphones eine Anleitung zur Nutzung der Synchronisierung gegeben.

Funktioniert auch über VoIP

Hier haben wir nun anstelle von tel: einfach das Kürzel sip::

VoIP unter: 
<a href="sip:eigenerKontakt@VoIP-Anbieter">VoIP</a>

Skype als Link

Skype unter: 
<a href="skype:eigeneSkypeNr">skype:eigeneSkypeNr</a>

Über Parameter können die verschiedenen Optionen von Skype ausgeführt werden.

  • add - Kontakt zur Kontaktliste hinzufügen
  • call - Telefongespräch durchführen (dies ist der Standard)
  • chat – Chatgespräch
  • sendfile - Datei(en) senden
  • userinfo - Profildaten anzeigen
  • voicemail - Sprachnachricht hinterlassen

Weitere Vorteile: Design über CSS

Wir können direkt über CSS auf das Design Einfluss nehmen. Dazu kommt als Selektor der folgende Aufbau zum Zuge:

a[href^="tel:"] {
    /* hier z.B. Grafik vor Telefonnr einblenden */
}

Dazu mehr im Kapitel über Design mit CSS.

Weiterempfehlen • Social Bookmarks • Vielen Dank

Wenn Sie einen Fehler finden, bitte mitteilen (egal ob Schreibfehler oder inhaltlicher Fehler).

Mit Maus fehlerhafte Stelle markieren und übernehmen mit folgendem Button:



(kann angegeben werden)

Nach Absenden kommt hier Feedback! Bitte nicht doppelt absenden. Danke.

    E-Books zum Kurs

    von HTML-Seminar.de

    E-Books mit rund 930 Seiten Umfang als PDF. Alle 3 zu einem Preis.

    Mehr Details

Bitte unterstützen Sie dieses Projekt

Sie können dieses Projekt in verschiedenen Formen unterstützen - wir würden uns freuen und es würde uns für weitere Inhalte motivieren :).

unsere Videos bestellen

Unsere Videos und eBooks bestellen.

Spenden

Sie können uns eine Spende über PayPal zukommen lassen.

Weiterempfehlungen

Empfehlen Sie es weiter - wir freuen uns immer über Links und Facebook-Empfehlungen.

Bücher über Amazon

Bestellen Sie Bücher über folgende Links bei Amazon:

Fehler melden

Vielen Dank für Ihre Hilfe