Comment ajouter des liens vers des numéros de téléphone

Grâce à une nouveauté HTML 5

Dans ce tutoriel nous allons voir comment faire en sorte que les numéros de téléphone présents dans vos pages web deviennent cliquables de la même façon que les adresses e-mail le sont.

7 commentaires Donner une note à l'article (5)

Article lu   fois.

Les deux auteur et traducteur

Traducteur :

Liens sociaux

Viadeo Twitter Facebook Share on Google+   

I. Traduction

Ce tutoriel est la traduction la plus fidèle possible du tutoriel original de Paul Underwood, Add Telephone Number Links With HTML5.

II. Introduction

Jusqu'à aujourd'hui, les numéros de téléphone présents dans les pages web étaient ajoutés en tant que texte simple (statique) et n'offraient donc aucune interaction pour les visiteurs. Le nombre de possesseurs de smartphone et donc d'utilisateurs du web via un téléphone étant en augmentation constante, il est temps de changer ces numéros de téléphone pour des zones cliquables afin de pouvoir directement appeler ledit numéro par un simple clic.

En effet à l'heure actuelle, on est obligé de copier le numéro de téléphone qui nous intéresse dans la page, puis de le recopier dans l'interface d'appel du téléphone.

Avec cette nouvelle fonctionnalité, on va pouvoir créer des liens à partir de numéros de téléphone de la même façon que l'on crée des liens à partir d'adresses e-mail.

III. « href=" tel :" » semblable à « href=" mailto :" »

Pour permettre aux visiteurs de directement envoyer un e-mail en cliquant sur une adresse depuis une page web, on utilise un lien classique dans lequel on place mailto : dans l'attribut href.

 
Sélectionnez
<a href="mailto:example@example.com">Example Email</a>

Après avoir cliqué sur ce lien, le client de messagerie par défaut s'ouvre avec un nouvel e-mail dont le champ destinataire est rempli à partir de l'adresse spécifiée dans l'attribut href du lien.

Suivant ce modèle, pour créer un lien cliquable vers un numéro de téléphone, il faut utiliser tel: dans l'attribut href du lien en précisant le numéro à appeler.

 
Sélectionnez
Book now, call <a href="tel:01234567890">01234 567 890</a>

IV. Skype

Il est également possible de créer un lien cliquable qui utilisera Skype pour appeler le numéro de téléphone renseigné dans le lien (à partir d'un ordinateur de bureau par exemple).

Pour ce faire, il suffit de remplacer la valeur tel par callto dans l'attribut href du lien.

 
Sélectionnez
Book now, call <a href="callto:01234567890">01234 567 890</a>

V. Conclusion

Nous avons vu dans ce tutoriel comment rendre interactifs les numéros de téléphone présents dans les pages web. La croissance des visiteurs utilisant des smartphones étant en constante augmentation, cette nouveauté disponible avec HTML 5 vous permet de rendre vos pages web plus attrayantes pour ces utilisateurs.

VI. Remerciements

Je tiens à remercier Paul Underwood de m'avoir autorisé à traduire son tutoriel.
Je remercie également ClaudeLELOUP pour sa relecture orthographique.

Vous avez aimé ce tutoriel ? Alors partagez-le en cliquant sur les boutons suivants : Viadeo Twitter Facebook Share on Google+   

  

Les sources présentées sur cette page sont libres de droits et vous pouvez les utiliser à votre convenance. Par contre, la page de présentation constitue une œuvre intellectuelle protégée par les droits d'auteur. Copyright © 2012 Paul Underwood. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.