Screen Reader Accessibility – Überprüfung der Zugänglichkeit von Alt-Text und Multimedia in Java

Aspose.HTML for Java enthält das Paket com.aspose.html.accessibility, das für alle Manipulationen und Prüfungen im Zusammenhang mit der Barrierefreiheit im Web konzipiert ist.

Zugänglichkeit von Bildschirmlesegeräten – Verbesserung der Web-Erlebnisse für alle Benutzer

Die Zugänglichkeit von Bildschirmlesegeräten ist ein wesentlicher Bestandteil der Barrierefreiheit im Internet. Sie stellt sicher, dass Websites und digitale Anwendungen von blinden, sehbehinderten oder kognitiv eingeschränkten Menschen genutzt werden können. Ein Bildschirmlesegerät ist eine unterstützende Technologie, die digitale Inhalte, einschließlich Text, Bilder und interaktive Elemente, in Sprache oder Braille-Schrift umwandelt, so dass die Benutzer effektiv auf Webseiten navigieren und mit ihnen interagieren können. Um Screenreader zu unterstützen, sollten Entwickler die Web Content Accessibility Guidelines (WCAG) befolgen, insbesondere indem sie klare, beschreibende Alternativtexte (alt text) für alle informativen Bilder, Schaltflächen und Medienelemente bereitstellen.

In diesem Artikel wird gezeigt, wie die Aspose.HTML for Java-Bibliothek verwendet werden kann, um eine Website oder ein anderes HTML-Dokument auf die Zugänglichkeit für Bildschirmleser zu prüfen – ob es klare, beschreibende Alternativtexte (alt text) für alle informativen Bilder, Schaltflächen und Medienelemente enthält.

In dem Artikel Barrierefreiheit für Bildschirmleser – Alt-Text prüfen erfahren Sie, wie Sie Ihre Website unter Berücksichtigung der Barrierefreiheit für Bildschirmleser gestalten und wie Sie verschiedene Möglichkeiten nutzen können, um alternativen Text auf Ihrer Website zu implementieren, z. B. für Bilder, Schaltflächen, -Elemente, Formularsteuerungen, Emojis und mehr.

Der Artikel Multimedia-Web-Zugänglichkeit untersucht, wie multimediale Inhalte integrativ und für ein breiteres Publikum, einschließlich Menschen mit Behinderungen, zugänglich gemacht werden können. Dieser Artikel enthält Beispiele für bewährte Verfahren für die Zugänglichkeit von Multimedia-Inhalten, die den WCAG-Standards entsprechen.

Alt-Text eines Bildes prüfen

Schauen wir uns ein Codeschnipsel an, das sich auf die Überprüfung von Alt-Text für Bilder und Beschriftungen bezieht. Um Ihre Seite auf Alternativtext und Zugänglichkeitskriterien zu überprüfen, müssen Sie folgende Schritte ausführen:

Verwenden Sie den Konstruktor WebAccessibility(), um eine Instanz der Klasse WebAccessibility zu erstellen, die für die Validierung der Barrierefreiheit im Web zuständig ist.
Verwenden Sie die Eigenschaft Rules des Objekts webAccessibility, die Zugriff auf eine Sammlung von Regeln für die Barrierefreiheit im Web bietet. Rufen Sie die Methode getPrinciple() der Klasse “AccessibilityRules” und die Methode getGuideline() der Klasse “Principle” auf, um das erforderliche Prinzip per Code aus den WCAG zu erhalten.
Rufen Sie die Methode createValidator() auf, um ein Validator-Objekt zu erstellen. Sie richten im Wesentlichen einen Validator ein, der Webinhalte anhand der spezifischen Zugänglichkeitsrichtlinien und Erfolgskriterien prüft, die mit der von Ihnen angegebenen Richtlinie verbunden sind.
Laden Sie ein HTML-Dokument mit einem der HTMLDocument() Konstruktoren.
Verwenden Sie die Methode validate(document), um das HTML-Dokument auf Barrierefreiheit zu prüfen. Das Ergebnis wird in der Variablen validationResult gespeichert.
Prüfen Sie, ob die Validierung erfolgreich war. Drucken Sie die detaillierten Informationen über Fehler, einschließlich des zugehörigen HTML-Elements.

Betrachten Sie ein Beispiel für die HTML-Datei alt-tag.html:

 1<html>
 2    <body>
 3        <img src="./resourses/login.png" alt="Login icon">
 4
 5        <label>Enter login:</label>
 6        <!--error: for input missing label with for="login" -->
 7        <input type="text" id="login">
 8
 9        <label for="password">Enter password:</label>
10        <input type="password" id="password">
11    
12        <!--error: for image alt attribute must not be empty -->
13        <img src="./resourses/sign.png" alt="">
14    </body>
15</html>

Das folgende Java-Code-Snippet demonstriert die grundlegenden Schritte zur Erstellung eines Validators, zum Laden eines HTML-Dokuments und zur Validierung gegen die Anforderungen an die Barrierefreiheit im Web, insbesondere die Regeln “1. Perceivable” und “1.1 Text Alternatives”:

 1// Validate HTML image alt text accessibility with detailed error reporting
 2
 3// Prepare a path to a source HTML file
 4String documentPath = "alt-tag.html";
 5
 6// Initialize webAccessibility container
 7WebAccessibility webAccessibility = new WebAccessibility();
 8
 9// Get from the rules list Principle "1. Perceivable"
10// by code "1" and get guideline "1.1 Text Alternatives"
11Guideline guideline = webAccessibility.getRules()
12        .getPrinciple("1").getGuideline("1.1");
13
14// Create an accessibility validator - pass the found guideline
15// as parameters and specify the full validation settings
16AccessibilityValidator validator = webAccessibility.createValidator(
17        guideline,
18        ValidationBuilder.getAll()
19);
20
21// Initialize an HTMLDocument object
22final HTMLDocument document = new HTMLDocument(documentPath);
23ValidationResult validationResult = validator.validate(document);
24
25if (!validationResult.getSuccess()) {
26    // Get all the result details
27    for (RuleValidationResult ruleResult : validationResult.getDetails()) {
28        // If the result of the rule is unsuccessful
29        if (!ruleResult.getSuccess()) {
30            // Get an errors list
31            for (ITechniqueResult result : ruleResult.getErrors()) {
32                // Check the type of the erroneous element, in this case,
33                // we have an error in the HTML Element
34                if (result.getError().getTarget().getTargetType() == TargetTypes.HTMLElement) {
35                    HTMLElement rule = (HTMLElement) result.getError().getTarget().getItem();
36
37                    System.out.println(String.format("Error in rule %s : %s",
38                            result.getRule().getCode(),
39                            result.getError().getErrorMessage()
40                    ));
41
42                    System.out.println(String.format("HTML Element: %s",
43                            rule.getOuterHTML()
44                    ));
45                }
46            }
47        }
48    }
49}

Example_CheckAltText.java hosted with ❤ by GitHub

Das Ergebnis der Dateiprüfung ist eine Liste von Ergebnissen, die Fehler enthalten. Das Programm gibt die Ergebnisse auf der Konsole aus:

1    Error in rule H37 : Img element missing an alt attribute. The value of this attribute is referred to as "alt text".
2    HTML Element: <img src="./resourses/sign.png" alt="">
3    Error in rule H44 : Check that the label element contains for attribute.
4    HTML Element: <label>Enter login:</label>
5    Error in rule H65 : Check that the title attribute identifies the purpose of the control and that it matches the apparent visual purpose.
6    HTML Element: <input type="text" id="login">
7    Error in rule F65 : Absence of an alt attribute or text alternative on img elements, area elements, and input elements of type "image".
8    HTML Element: <img src="./resourses/sign.png" alt="">

Multimedia-Zugänglichkeit prüfen

In diesem Beispiel wird ein HTML-Dokument auf die Einhaltung aller Kriterien der “1.2 Time-based Media”-Richtlinie geprüft.

 1// Validate HTML for multimedia accessibility using Java
 2
 3// Initialize a webAccessibility container
 4WebAccessibility webAccessibility = new WebAccessibility();
 5
 6// Get from the rules list Principle "1.Perceivable" by code "1"
 7// and get guideline "1.2 Time-based Media"
 8Guideline guideline = webAccessibility.getRules()
 9        .getPrinciple("1").getGuideline("1.2");
10
11// Create an accessibility validator, pass the found guideline
12// as parameters, and specify the full validation settings
13AccessibilityValidator validator = webAccessibility.createValidator(
14        guideline,
15        ValidationBuilder.getAll()
16);
17
18// Initialize an HTMLDocument object
19final HTMLDocument document = new HTMLDocument("https://www.youtube.com/watch?v=Yugq1KyZCI0");
20ValidationResult validationResult = validator.validate(document);
21
22// Checking for success
23if (!validationResult.getSuccess()) {
24    // Get all result details
25    for (RuleValidationResult ruleResult : validationResult.getDetails()) {
26        // If the result of the rule is unsuccessful
27        if (!ruleResult.getSuccess()) {
28            // Get an errors list
29            for (ITechniqueResult result : ruleResult.getErrors()) {
30                // Check the type of the erroneous element
31                if (result.getError().getTarget().getTargetType() == TargetTypes.HTMLElement) {
32                    HTMLElement rule = (HTMLElement) result.getError().getTarget().getItem();
33
34                    System.out.println(String.format("Error in rule %s : %s",
35                            result.getRule().getCode(),
36                            result.getError().getErrorMessage()
37                    ));
38
39                    System.out.println(String.format("HTML Element: %s",
40                            rule.getOuterHTML()
41                    ));
42                }
43            }
44        }
45    }
46}

Example_CheckMultimediaAccessibility.java hosted with ❤ by GitHub

Um zum Beispiel das Vorhandensein der Audiodeskription zu prüfen, müssen Sie das gewünschte Kriterium auswählen und es ankreuzen.

 1    // Get the principle "1. Perceivable" by its code and retrieve the guideline "1.2 Time-based Media"
 2    Guideline guideline = webAccessibility.getRules().getPrinciple("1").getGuideline("1.2");
 3
 4    // Get the specific criterion: 1.2.3 Audio Description or Media Alternative (Prerecorded)
 5    Criterion criterion = guideline.getCriterion("1.2.3");
 6
 7    // Create an accessibility validator with the found criterion and full validation settings
 8    AccessibilityValidator validator = webAccessibility.createValidator(criterion, ValidationBuilder.getAll());
 9
10    ...

Denken Sie daran, dass der Schlüssel darin liegt, sicherzustellen, dass Nutzer mit Behinderungen Zugang zu den multimedialen Inhalten haben und deren Kontext effektiv verstehen können. Die Kombination mehrerer Zugänglichkeitstechniken, wie Untertitel, Transkripte und Audiobeschreibungen, kann allen Nutzern ein umfassendes und integratives Erlebnis bieten.

Siehe auch

Hilfreiche Tipps zur Bewertung und Verbesserung der Textsichtbarkeit finden Sie im Artikel Zugänglichkeit von Farbkontrasten, der die Kontrastprüfung auf der Grundlage der WCAG mit Aspose.HTML for Java behandelt.
Wenn Sie wissen möchten, wie Sie Validierungsergebnisse anzeigen und Probleme mit der Barrierefreiheit erkennen können, lesen Sie den Artikel Validierungsergebnisse.
In dem Artikel Zugänglichkeitsprüfung von Websites – Fehler und Warnungen erfahren Sie, wie Sie in Java programmgesteuert Fehler- und Warninformationen bei der Prüfung der Zugänglichkeit einer Website sammeln können.

Aspose.HTML bietet einen kostenlosen Online- Web-Zugänglichkeits-Checker. Dieses Tool scannt Webseiten, prüft sie auf WCAG-Konformität, identifiziert Probleme und schlägt Verbesserungen vor. Sie erhalten sofortige Einblicke in die Konformität Ihrer Website und können so den Umfang der notwendigen Korrekturen und die Lücke zwischen dem aktuellen Zustand Ihrer Website oder Ihres HTML-Dokuments und den WCAG-Anforderungen bestimmen.

Farbkontrast prüfen Fortgeschrittene Programmierung