Accessibilité : Vérifier et ajuster l'ordre du DOM d'un site
7 min
Dans cet article
- Ordre du DOM sur les sites
- Pourquoi l'ordre du DOM est important
- DOM automatique dans l'Assistant d'accessibilité
- Modifier manuellement l'ordre du DOM d'un site
- Langue et DOM du site
L'ordre du DOM d'un site est l'ordre dans lequel les lecteurs d'écran et la touche Tab permettent de mettre en évidence et/ou de lire le contenu de la page. Il doit suivre un ordre logique pour que vos visiteurs profitent de la meilleure expérience possible sur votre site, et qu'ils puissent comprendre et apprécier son contenu.
Ordre du DOM sur les sites
Le DOM d'un site correspond à l'ordre dans lequel les éléments sur les pages du site sont chargés et lus. Wix définit automatiquement un ordre du DOM basé sur l'ordre visuel des éléments. Lorsque nous développons nos outils d'accessibilité, nous testons nos produits en utilisant les lecteurs d'écran suivants :
- Windows + Firefox ou Chrome: NVDA (lecteur gratuit)
- iOS + Safari : Voiceover (lecteur intégré)
Cela signifie que nous avons créé l'ordre du DOM automatique de votre site en gardant les fonctions des applications ci-dessus à l'esprit.
Pourquoi l'ordre du DOM est important
Certains visiteurs du site peuvent utiliser les lecteurs d'écran et d'autres technologies d'assistance pour naviguer sur votre site. Ces technologies aident les visiteurs ayant des limitations et des conditions visuelles en analysant le contenu du site et en le lisant à haute voix au visiteur.
Les visiteurs qui utilisent des lecteurs d'écran, ainsi que ceux qui présentent des troubles qui affectent la mobilité, peuvent utiliser la touche Tab pour naviguer dans le contenu de votre site. L'ordre du DOM du site est donc important pour les visiteurs utilisant des lecteurs d'écran et/ou la touche Tab, car ils doivent pouvoir naviguer sur votre site dans un ordre logique.
Par exemple, le menu du site doit venir en premier, suivi du reste des éléments de l'en-tête, puis du titre de la page, puis du contenu de la page, etc. Si l'ordre du DOM est incorrect, le lecteur d'écran / la touche Tab peut ignorer ou survoler le contenu de votre page.
Vous souhaitez tester l'ordre du DOM du site ?
Vous pouvez tester l'ordre automatique du DOM d'un site en utilisant la touche Tab de votre clavier ou un lecteur d'écran sur la version en ligne du site.
DOM automatique dans l'Assistant d'accessibilité
Lorsque vous ouvrez l'Assistant d'accessibilité dans l'éditeur Studio, vous pouvez voir l'option pour organiser automatiquement son ordre du DOM. Nous vous recommandons de sélectionner cette option, car cela garantit que l'analyse de l'Assistant et les tâches qui en résultent sont correctes.
Vous ne voyez pas cette case à cocher ?
L'option pour organiser le DOM du site ne se remplit pas si :
- Le site a été créé après le début du mois de novembre 2024
- Vous avez déjà organisé le DOM du site avec l'Assistant d'accessibilité
- Vous avez désactivé le DOM automatique sur le site.
Modifier manuellement l'ordre du DOM d'un site
Si vous remarquez que l'ordre du DOM de votre site n'est pas logique, vous pouvez l'ajuster manuellement pour améliorer l'expérience des visiteurs.
Utilisez l' Assistant d'accessibilité et le panneau Calques pour modifier le DOM sur les sites de l'Éditeur Wix. Si vous créez un site dans l'Éditeur Studio, vous pouvez ajuster l'ordre à l'aide des panneaux Calques et Pages du site.
Important :
Si l'ordre de tabulation de votre site est logique, vous n'avez rien à faire. La modification de l'ordre alors qu'il est déjà correct peut entraîner des problèmes pour les visiteurs qui utilisent des lecteurs d'écran et/ou la touche Tab.
Pour modifier l'ordre du DOM :
Éditeur Wix
Éditeur Studio
Comme Wix définit automatiquement une commande de DOM pour votre site, vous devez la désactiver dans l'Assistant d'accessibilité. Vous pouvez ensuite ajuster manuellement l'ordre DOM des éléments dans le panneau Calques de votre site si nécessaire.
Pour organiser manuellement l'ordre du DOM :
- Accédez à votre Éditeur.
- Cliquez sur Paramètres en haut et sélectionnez Assistant d'accessibilité.
- Sélectionnez Scan du site dans l'Assistant à droite.
- Cliquez sur l'onglet Problèmes détectés .
- Sélectionnez Niveau du site.
- Cliquez sur Organiser l'ordre du DOM.
- Sélectionnez Manuellement.
- Cliquez sur Appliquer.
- Sélectionner les calques
en bas à gauche de votre éditeur. - Vérifiez la liste et supprimez tous les éléments redondants. Cela inclut les éléments dupliqués qui n'ont pas d'utilisation sur votre site et qui peuvent dérouter les utilisateurs de lecteurs d'écran.
- Glissez et déposez les éléments restants dans l'ordre souhaité.
Prochaine étape :
Ouvrez l'Éditeur mobile et répétez les mêmes étapes.
Remarques :
- La navigation sur un site à l'aide de la touche Tab permet uniquement de naviguer dans les éléments interactifs et non dans les éléments statiques tels que le texte. Si vous souhaitez tester un lecteur d'écran sur des éléments statiques tels que du texte, suivez les instructions du centre d'aide de votre lecteur d'écran pour savoir comment naviguer correctement sur un site web avec un clavier.
- Les éléments épinglés sont automatiquement placés à la fin de la séquence de tabulation. Si vous souhaitez qu'un élément soit tabulé plus tôt dans la séquence, nous vous recommandons de détacher l'élément et de le placer dans l'en-tête.
Prochaine étape ?
Retournez à la check-list d'accessibilité pour continuer à travailler sur l'accessibilité de votre site.
Langue et DOM du site
Différentes langues ont des sens de lecture différents (par exemple L'anglais se lit de gauche à droite et l'hébreu se lit de droite à gauche). Si vous avez modifié la langue d'un site pour une direction de lecture différente, l'ordre visuel et le DOM des éléments peuvent ne plus être alignés.
Nous vous recommandons d'activer l'option automatique du DOM dans l'Assistant d'accessibilité pour vous assurer que l'ordre des éléments correspond au sens de lecture de la langue du site.
Important :
Si le site contient du contenu dans les langues de gauche à droite et de droite à gauche, nous vous recommandons d'ajuster manuellement l'ordre du DOM.
Pour activer le DOM automatique dans l'Assistant :
- Scannez le site avec l'Assistant d'accessibilité.
- Cliquez sur l'onglet Problèmes détectés .
- Sélectionnez Niveau du site.
- Cliquez sur Organiser l'ordre du DOM.
- Sélectionnez Automatiquement (recommandé).
- Cliquez sur Appliquer.
- (Facultatif) Vérifiez l'affichage visuel des éléments du site pour vous assurer qu'ils sont alignés.
Remarques :
- Cette option peut modifier l'affichage visuel des éléments, nous vous suggérons donc de vérifier les modifications pour vous assurer que le site a l'aspect que vous souhaitez.
- Cette fonctionnalité ne prend pas en charge tous les composants du site et vous devrez peut-être ajuster manuellement leur sens de lecture.
Vous avez changé d'avis ?
Vous pouvez rétablir l'ordre automatique du DOM à partir de votre Éditeur :
- Éditeur Wix : Cliquez sur l'icône Annuler
dans la barre supérieure de votre Éditeur.
Remarque : Cette option ne s'applique que si la dernière action que vous avez effectuée a été la réorganisation automatique du DOM. - Éditeur Studio : Restaurez une version précédente du site à partir de l’historique du site.