CATALOGUE Code & Data Formation XHTML/CSS Cours HTML5 et CSS3 / Part 1 - Les balises HTML et HTML5

Comment créer des Image Maps en HTML

Retour à la formation
Chapitre 3 Leçon 12
Précédent
Suivant

Apprenez à créer des image maps en HTML, permettant de rendre certaines zones d'une image interactives avec des liens définis.

Détails de la leçon

Description de la leçon

Dans cette leçon, nous explorons la création d'image maps en HTML. Une image map permet de rendre certaines zones d'une image interactives avec des liens spécifiques. Nous commençons par insérer une image et utiliser des outils pour définir les coordonnées des zones cliquables, comme Dreamweaver ou des sites spécialisés tels qu'imagemaps.com. Une fois les coordonnées obtenues, nous les intégrons dans notre code HTML, en veillant à les relier correctement via l'attribut usemap. Nous discutons également des aspects d'accessibilité de cette technique, soulignant les limitations pour les personnes malvoyantes ou aveugles. Finalement, nous voyons comment tester notre image map dans un navigateur pour vérifier son bon fonctionnement.

Objectifs de cette leçon

L'objectif de cette vidéo est de maîtriser la création d'image maps en HTML, d'apprendre à utiliser des outils pour définir les coordonnées des zones clics, et de comprendre les bonnes pratiques en termes d'accessibilité.

Prérequis pour cette leçon

Il est recommandé de posséder des connaissances de base en HTML et CSS pour suivre cette vidéo.

Métiers concernés

Les compétences acquises dans cette leçon peuvent être utiles aux métiers de développeur web, designer web, et intégrateur HTML, en leur permettant d'ajouter des fonctionnalités interactives aux sites Internet.

Alternatives et ressources

Des alternatives à Dreamweaver, comme GIMP ou Image Map Editor, peuvent également être utilisées pour définir les coordonnées des zones cliquables.

Questions & Réponses

Des outils tels que Dreamweaver, GIMP ou des sites spécialisés comme imagemaps.com peuvent être utilisés pour définir les coordonnées des zones cliquables d'une image map.
L'accessibilité est cruciale car les image maps peuvent poser des défis aux personnes malvoyantes ou aveugles, rendant la navigation difficile sans descriptions textuelles appropriées.
Les étapes principales sont : insérer l'image dans la page HTML, définir les zones cliquables avec les coordonnées, ajouter l'attribut usemap à l'image et intégrer les balises map et area avec les coordonnées spécifiques et les liens.