Éléments html pour un carrousel d'images

Bonjour,

Cette discussion fait suite à ce sujet.

Dans un carrousel, le clic sur l'image principale ouvre le carrousel dans une pop-up.

Pour l'accessibilité, quelques sont les éléments html les mieux appropriés afin d'encadrer les images.

<div class="pop_up"><img /></div>
<div class="vignette"><img /></div>
<div class="vignette"><img /></div>

Faut-il remplacer div par un autre élément et si oui par quoi ?

Bonjour, pour la sémantique tu peux entourer tes images de la balise <figure>.

Pour l’accessibilité mieux que je ne pourrais en dire :
https://van11y.net/fr/carrousel-accessible/
https://accessuse.eu/fr/carrousels.html
https://a11y-guidelines.orange.com/fr/articles/Carrousel/
https://www.accede-web.com/notices/interface-riche/carrousels/
https://rgaa-checker.com/blog/carrousel-accessibilite-guide
https://www.24joursdeweb.fr/2025/concevoir-et-developper-un-carrousel-accessible-aux-personnes-handicapees

Et d'anciens sujets :
https://forum.alsacreations.com/topic-6-79153-1-Resolu-Carrousel-accessible.html
https://forum.alsacreations.com/topic-6-60698-1-Comment-rendre-un-carrousel-accessible.html
Modifié par casper2 (19 Apr 2026 - 13:58)

Bonjour casper2,

Merci de ton suivi.

casper2 a écrit :
Pour la sémantique tu peux entourer tes images de la balise <figure>.

C'était déjà fait, l'ai publié un code minimal.

Merci pour les liens.
Je vais m'y plonger mais j'ai l'impression que cela concerne surtout les carrousels à base de JS.
Le carrousel dont je parle est à 99 % CSS.
La question porte sur le choix des balises HTML et les aria éventuels.