Web Accessibility Check – Erreurs et avertissements

Comment vérifier l’accessibilité d’un site web

Vérifier l’accessibilité d’un site web, c’est s’assurer que tout le monde, y compris les personnes handicapées, peut utiliser votre site ou votre application. Cela implique de tester votre contenu par rapport à des directives telles que les WCAG, qui expliquent comment rendre les expériences numériques plus inclusives. Aspose.HTML for Java vous permet d’automatiser ce processus en analysant le HTML et le CSS pour détecter les problèmes d’accessibilité, soit par rapport à l’ensemble des normes WCAG, soit en vous concentrant sur des critères spécifiques.

Dans cet article, vous apprendrez à évaluer l’accessibilité d’un site web pour vérifier sa conformité aux WCAG en utilisant les classes et les méthodes des paquets com.aspose.html.accessibility et com.aspose.html.accessibility.results. Nous explorerons diverses classes et interfaces qui permettent de collecter des informations sur les erreurs et les avertissements lors de la vérification de l’accessibilité d’un site web. Une attention particulière sera accordée aux critères d’échec et aux méthodes de signalement des erreurs, ainsi qu’à un exemple Java qui démontre comment récupérer les erreurs d’accessibilité du web après la validation d’un document HTML.

Voyons un extrait de code relatif à la validation de l’accessibilité du web. Le code suivant vérifie l’accessibilité d’une page HTML distante à l’aide de toutes les règles de validation WCAG et affiche les détails de toutes les règles qui n’ont pas été respectées :

  1. Utilisez le constructeur WebAccessibility() pour créer une instance de la classe WebAccessibility responsable de la validation de l’accessibilité du web.
  2. Appelez la méthode createValidator() pour créer un objet validateur.
  3. Charger une page HTML en utilisant le constructeur HTMLDocument(Url).
  4. Utilisez la méthode validate(document) pour vérifier l’accessibilité de la page web. Le résultat est stocké dans la variable validationResult.
  5. Vérifiez si la validation a réussi. Pour chaque problème d’accessibilité, imprimez des informations sur le code et la description de la règle, et indiquez si la validation a réussi ou échoué.
 1// Check website for WCAG compliance in Java
 2
 3// Initialize webAccessibility container
 4WebAccessibility webAccessibility = new WebAccessibility();
 5
 6// Create an accessibility validator with static instance
 7// for all rules from repository that match the builder settings
 8AccessibilityValidator validator = webAccessibility.createValidator(ValidationBuilder.getAll());
 9
10// Initialize an HTMLDocument object
11final HTMLDocument document = new HTMLDocument("https://products.aspose.com/html/net/generators/video/");
12ValidationResult validationResult = validator.validate(document);
13
14// Checking for success
15if (!validationResult.getSuccess()) {
16    // Get a list of Details
17    for (RuleValidationResult detail : validationResult.getDetails()) {
18        System.out.println(String.format("%s: %s = %s",
19                detail.getRule().getCode(),
20                detail.getRule().getDescription(),
21                detail.getSuccess()
22        ));
23    }
24}

Erreurs et avertissements

La détection des erreurs permet d’identifier les obstacles susceptibles d’empêcher les personnes handicapées d’utiliser et d’interagir efficacement avec le contenu web. Les erreurs et les avertissements indiquent ce qu’il faut faire pour améliorer l’accessibilité du web. Ils servent de feuille de route aux développeurs et aux concepteurs pour qu’ils apportent les changements nécessaires.

IError

L’ IError est une interface publique contenant des informations sur l’erreur de validation. Cela signifie que le contrôle est erroné, c’est-à-dire que la règle n’a pas été respectée, et que le résultat ne correspond pas à Accessibility.

L’interface IError décrit les détails d’un problème de validation rencontré lors des contrôles d’accessibilité. Elle fournit des informations clés sur l’erreur, y compris un message lisible par l’homme via getErrorMessage(), le statut du résultat avec getSuccess(), et le type d’erreur en tant que valeur numérique (getErrorType()) et un nom descriptif (getErrorTypeName()), tel que Error ou Warning. En outre, getTarget() renvoie l’élément HTML ou CSS spécifique dans lequel le problème a été rencontré, ce qui permet d’identifier et de corriger avec précision les problèmes d’accessibilité. Cette interface est essentielle pour interpréter et communiquer efficacement les résultats des contrôles d’accessibilité.

L’objet IError a ces significations :

* ErrorType = 1 and Success = false – this means that the error is critical, and the result of the check is not performed.
* ErrorType = 2 and Success = true – this means that the error is not critical but has an informational character and displays hints for possible improvement. 

Le type d’erreur est déterminé par le type de technique :

Target

La classe Target représente un élément HTML ou CSS spécifique pour lequel une erreur ou un avertissement d’accessibilité a été détecté lors de la validation. Elle fournit deux propriétés clés : Item, qui renvoie l’objet réel (comme une balise HTML ou une règle CSS) qui a causé le problème, et TargetType, qui détermine si la source du problème est un élément HTML ou un composant CSS.

TargetTypes

L’énumération TargetTypes définit les types d’objets possibles dans un document HTML où une erreur ou un avertissement d’accessibilité peut être trouvé. Elle permet de classer la source du problème, ce qui facilite son identification et sa résolution. L’énumération comprend trois valeurs :

NameValueDescription
HTMLElement0The element containing the HTMLElement from a document: standard HTML elements such as <img> or <button>.
CSSStyleRule1The element containing the CSSStyleRule from a document: specific CSS rules in stylesheets.
CSSStyleSheet2The element containing the CSSStyleSheet from a document: entire CSS stylesheets.

Cette énumération fonctionne en conjonction avec la classe Target pour indiquer exactement quel type d’élément a provoqué le résultat de la validation.

Générer un rapport complet sur l’accessibilité

Examinons le code Java permettant de parcourir les résultats du contrôle de l’accessibilité du web, en accordant une attention particulière aux critères d’échec et aux détails des méthodes qui signalent les erreurs. Exemple d’obtention des détails des erreurs et des éléments d’un document HTML :

  1. Utilisez la classe RuleValidationResult et parcourez les objets ruleResult contenus dans validationResult.getDetails(). Ces objets représentent différents critères d’accessibilité.
  2. Imprimer le code et la description du critère et indiquer s’il a réussi ou non. Pour cela, utilisez les propriétés Code et Description de l’interface IRule.
  3. Utilisez la méthode getSuccess() pour vérifier les critères.
  4. Utilisez les objets ITechniqueResultruleDetail contenus dans ruleResult.getErrors(). Les objets ITechniqueResult représentent les résultats individuels de la règle pour le critère qui a signalé des erreurs.
  5. Imprime les informations relatives à la méthode, y compris le code de la méthode, l’état de réussite et la description.
  6. Utilisez la propriété IError pour obtenir l’objet error à partir de ruleDetail. La ruleDetail représente un problème d’accessibilité spécifique, et l’objet error contient des informations sur ce problème.
  7. Utilisez getTarget() pour récupérer l’objet target associé à l’erreur. L’objet target représente typiquement l’élément HTML spécifique, la règle CSS, ou tout autre contenu qui a déclenché l’erreur d’accessibilité.
  8. Imprime des informations sur l’erreur. Cela inclut le type d’erreur error.getErrorTypeName() et le message d’erreur error.getErrorMessage().
  9. Utilisez la méthode getTargetType() de la classe Target pour vérifier le type de l’objet cible. En fonction du type de l’objet cible, des informations spécifiques sont extraites et imprimées sur la console.
 1// Check HTML for WCAG compliance and output failed rule codes and error messages
 2
 3// Initialize a webAccessibility container
 4WebAccessibility webAccessibility = new WebAccessibility();
 5
 6// Create an accessibility validator with static instance
 7// for all rules from repository that match the builder settings
 8AccessibilityValidator validator = webAccessibility.createValidator(ValidationBuilder.getAll());
 9
10String documentPath = "input.html";
11
12// Initialize an object of the HTMLDocument class
13final HTMLDocument document = new HTMLDocument(documentPath);
14ValidationResult validationResult = validator.validate(document);
15
16for (RuleValidationResult ruleResult : validationResult.getDetails()) {
17    //  list only unsuccessful rule
18    if (!ruleResult.getSuccess()) {
19        // print the code and description of the rule
20        System.out.println(String.format("%s: %s = %s",
21                ruleResult.getRule().getCode(),
22                ruleResult.getRule().getDescription(),
23                ruleResult.getSuccess()
24        ));
25
26        // print the results of methods with errors
27        for (ITechniqueResult ruleDetail : ruleResult.getErrors()) {
28            // print the code and description of the method
29            StringBuilder str = new StringBuilder(String.format("\n{0}: {1} - {2}",
30                    ruleDetail.getRule().getCode(),
31                    ruleDetail.getSuccess(),
32                    ruleDetail.getRule().getDescription()
33            ));
34            // get an error object
35            IError error = ruleDetail.getError();
36            // get a target object
37            Target target = error.getTarget();
38            // get error type and message
39            str.append(String.format("\n\n\t%s : %s",
40                    error.getErrorTypeName(),
41                    error.getErrorMessage()
42            ));
43
44            if (target != null) {
45                // Checking the type of the contained object for casting and working with it
46                if (target.getTargetType() == TargetTypes.CSSStyleRule) {
47                    ICSSStyleRule cssRule = (ICSSStyleRule) target.getItem();
48                    str.append(String.format("\n\n\t%s",
49                            cssRule.getCSSText()
50                    ));
51                }
52                if (ruleDetail.getError().getTarget().getTargetType() == TargetTypes.CSSStyleSheet) {
53                    str.append(String.format("\n\n\t%s",
54                            ((ICSSStyleSheet) target.getItem()).getTitle()
55                    ));
56                }
57                if (ruleDetail.getError().getTarget().getTargetType() == TargetTypes.HTMLElement) {
58                    str.append(String.format("\n\n\t%s",
59                            ((HTMLElement) target.getItem()).getOuterHTML()
60                    ));
61                }
62            }
63            System.out.println(str);
64        }
65    }
66}

Pour chaque critère échoué, le code énumère les descriptions des règles, les méthodes échouées, les messages d’erreur et met en évidence l’élément HTML ou CSS exact où le problème a été détecté. Cette approche est idéale pour générer un rapport d’accessibilité complet et précis, comprenant un contexte d’erreur et des diagnostics techniques pour les développeurs.

Voir aussi

  • Vous trouverez des conseils utiles sur l’évaluation et l’amélioration de la visibilité du texte dans l’article Accessibilité du contraste des couleurs, qui couvre la vérification du contraste basée sur les WCAG à l’aide d’Aspose.HTML for Java.
  • L’article Accessibilité aux lecteurs d’écran contient des instructions sur la manière de vérifier que le contenu web est compatible avec les lecteurs d’écran. Vous y apprendrez comment vérifier le texte alt et d’autres éléments clés.
  • Si vous souhaitez savoir comment afficher les résultats de la validation et identifier les problèmes d’accessibilité du web, consultez l’article Résultats de la validation.

Aspose.HTML propose un Vérificateur de contraste de couleur gratuit en ligne pour vérifier les rapports de contraste dans vos conceptions web. Cet outil permet de savoir si vos choix de couleurs sont conformes aux normes d’accessibilité.

Texte “Vérificateur de contraste de couleur”

Subscribe to Aspose Product Updates

Get monthly newsletters & offers directly delivered to your mailbox.