Passer au contenu

Associer plusieurs liens à une image

A l’intérieur d’une page Web du site que vous avez conçu, il est possible de rendre une image interactive en lui associant un lien hypertexte. Mais…

A l’intérieur d’une page Web du site que vous avez conçu, il est possible de rendre une image interactive en lui associant un lien hypertexte. Mais vous pouvez aller plus loin en découpant l’image en plusieurs zones et en associant chacune à un lien différent. Ces zones peuvent prendre diverses formes (rectangles, cercles ou n’importe quel tracé). Vous pourrez ainsi dessiner une carte dans laquelle l’utilisateur, selon l’endroit où il clique, sera dirigé vers des pages différentes. Pour cela, commencez par définir les zones en ouvrant l’image dans un logiciel d’édition graphique (tel l’accessoire Paint de Windows). En regardant les chiffres affichés en bas à droite de la fenêtre, notez les coordonnées des formes que vous souhaitez définir. Pour un rectangle, il s’agit des coordonnées du point en haut à gauche (par exemple 20,25) et de celles du point en bas à droite (84,113). Pour un cercle, il s’agit des coordonnées de son centre et de la valeur du rayon. Pour un tracé polygonal, vous devez préciser les coordonnées de chaque sommet. A l’aide d’un éditeur HTML, ouvrez la page que vous souhaitez modifier puis insérez, par exemple en fin de document, avant les balises et si elles existent, le contenu du listing ci-dessous en adaptant les coordonnées (les paramètres coords) et les liens (les paramètres href) à votre cas particulier. Une fois les modifications enregistrées, placez le fichier HTML ainsi que l’image dans le dossier de votre site. Il ne vous reste plus qu’à vérifier le résultat à l’aide dun navigateur.Niveau requis : Experts

🔴 Pour ne manquer aucune actualité de 01net, suivez-nous sur Google Actualités et WhatsApp.


La rédaction