Objectif
- Permettre aux utilisateurs placés dans des contextes où les styles ne sont pas restitués (navigateur texte, lecteur d'écran, navigateur avec styles désactivés) d’accéder à l’information présente sous forme de contenus générés en CSS (images d’arrière-plan notamment).
- Permettre aux robots d'exploiter l'information véhiculée par les styles CSS (référencement, indexation, traduction automatique des alternatives).
- Améliorer l’accessibilité des contenus aux personnes handicapées.
- Améliorer la prise en compte des contenus par les moteurs de recherche et outils d’indexation
Mise en œuvre
Fournir un contenu masqué à l’affichage via CSS :
- pour chaque information portée par les propriétés CSS background-image ou content ;
- pour chaque information affichée via un pseudo-élément CSS :before ou :after ;
- et plus généralement, pour chaque information absente par ailleurs de la page et dont la restitution dépend du support des styles.
En savoir plus: background-image
sur MDN - content
sur MDN - before
sur MDN - after
sur MDN
Contrôle
Examiner directement le code CSS et comparer visuellement l’affichage normal de la page avec son rendu après désactivation des images d’arrière-plan. Pour chaque page :
- Afficher les feuilles de styles grâce à une barre d’outils dédiée et vérifier que les propriétés et éléments cités dans le paragraphe « Solution technique » sont absents des CSS ou ne sont pas utilisés pour produire une information par ailleurs absente du code HTML.
- Désactiver les images d’arrière-plan CSS avec une barre d’outils dédiée.
- Contrôler l’absence de perte d’information, en comparant l’affichage avec et sans images d’arrière-plan.
Auteur Opquast - Consulter la licence
Découvrez la certification Opquast
- Une formation et une certification 100% en ligne
- 14 heures en ligne en autonomie, disponible 24h/24, 7j/7
- guide de 200 pages, des quiz, un glossaire, des examens blancs, des articles des videos
- Pour tous les professionnels du Web : marketing, commerciaux, UX, chefs de projet, designers, développeurs, ingénieurs informatiques.
- Une approche multidisciplinaire : SEO, accessibilité, sécurité, écoconception… pour tous les professionnels, débutants comme confirmés.