Menü

Tutorial zum WAVE Accessibility Testing Tool

wave accessibility testing tool tutorial

Versuchen Sie Unser Instrument, Um Probleme Zu Beseitigen

Tutorial zum WAVE Web Accessibility Tool: Verwendung von WAVE Chrome und Firefox Extension

Symbolleiste für Barrierefreiheit wurde in unserem vorherigen Tutorial ausführlich erklärt. Dieses Tutorial ist eine Fortsetzung des ersten in dieser Reihe. Überprüfen Sie es hier - Webzugriffstests - Teil 1 .

In diesem Tutorial haben wir uns einige grundlegende Konzepte angesehen, was Barrierefreiheit ist und wie sie mithilfe von Tools zum Testen der Barrierefreiheit bewertet werden kann.

In diesem Tutorial werden wir einige weitere Eingabehilfen-Tools wie die WAVE-Symbolleiste, das JAWS-Eingabehilfen-Tool, Techniken und Details sehen.

WAVE Zugänglichkeit

(Bild Quelle)

Was du lernen wirst:

Unterschied zwischen Systemtests und Benutzerakzeptanztests

WELLE(Tool zur Bewertung der Barrierefreiheit im Internet)

WAVE-Symbolleiste

Das WAVE-Tool ist ein Tool zur Bewertung der Barrierefreiheit im Internet - eine Symbolleiste für Firefox-Browser.

Es ist wichtig zu beachten, dass WAVE Ihnen nicht sagen kann, ob auf Ihre Webinhalte zugegriffen werden kann. Nur ein Mensch kann die wahre Zugänglichkeit bestimmen. WAVE kann Ihnen jedoch dabei helfen, die Zugänglichkeit Ihrer Webinhalte zu bewerten.

Alle Auswertungen erfolgen direkt im Browser und es werden keine Informationen an WAVE-Server gesendet. Dies gewährleistet eine 100% private und sichere Barrierefreiheitsberichterstattung.

Zum Herunterladen der WAVE-Symbolleiste für Barrierefreiheit im Internet gehen Sie zu http://wave.webaim.org/toolbar/ und lade es in F herunter Irefox-Browser . Stellen Sie sicher, dass Sie die Download-URL im Firefox-Browser öffnen, da die WAVE-Symbolleiste nur Firefox unterstützt.

Verwendung der WAVE Web Accessibility-Symbolleiste

Im Folgenden sind die Funktionen aufgeführt, die wir bei der Arbeit am Firefox-Browser verwenden können:

# 1) Wählen Sie die Website aus http://www.easports.com/ Klicken Sie dann auf 'Fehler, Funktionen und Warnungen'. Dort finden Sie die Seite mit Warnungen und Fehlern zur Barrierefreiheit in gelber Farbe. Fahren Sie mit der Maus über die Bilder, um die Details der Warnungen anzuzeigen.

( Hinweis : Klicken Sie auf ein Bild, um es zu vergrößern.)

Tools zum Testen der Barrierefreiheit im Internet 1

#zwei) Klicken Sie nun auf 'Struktur- / Auftragsansicht'. Sie erhalten die Seite mit den Details des Inline-Rahmens.

WAVE Web Accessibility-Bewertungstool

#3) Klicken Sie nun auf 'Nur-Text-Ansicht'. Die Site wird ohne Bilder, Stile und Layouts angezeigt.

Evaluierungswerkzeug für Wave Web Accessibility

# 4) Die Symbole in der Symbolleiste „Gliederungsansicht“ zeigen an, ob die Überschriften in Ordnung sind oder nicht.

WAVE Web Accessibility-Bewertungstool 4

# 5) Das Symbol „Seite zurücksetzen“ aktualisiert die Seite.

Webzugriff 5

# 6) Durch Klicken auf 'Stil deaktivieren' werden die CSS-Stile von der Seite entfernt.

Tools für die Barrierefreiheit im Internet 6

# 7) Über die Schaltfläche „Symbolschlüssel“ wird eine Liste aller WAVE-Symbole mit zusätzlichen Details, Informationen und Empfehlungen angezeigt.

Tool zur Bewertung der Barrierefreiheit im Internet 7

Sie können die Zugänglichkeit der Website auch bewerten, ohne das Wave-Tool herunterzuladen und direkt online zu verwenden.

Schritte zum Überprüfen der Zugänglichkeit der Website

Schritt 1) Klicken Sie auf die URL: http://wave.webaim.org/

Schritt 2) Geben Sie die Webseitenadresse in dem Text Box und drücken Sie die Eingabetaste. Wir werden verwenden mit als Beispiel. Geben Sie also die Site www.facebook.com in das Textfeld ein und klicken Sie auf die Eingabetaste.

Schritt 3) Auf der linken Seite der Navigation finden Sie zusammenfassende Details.

  1. Fehler werden mit einer Zählung rot angezeigt. In meinem Fall wird es als 13 angezeigt.
  2. Warnungen werden in Gelb mit einer Anzahl von 13 angezeigt.
  3. Features wären grün mit einer Zählung von 10.
  4. Strukturelemente wären 6 in blauer Farbe.
  5. HTML5 und ARIA wären 15 in lila Farbe.
  6. Kontrastfehler wären 14 in schwarzer Farbe.

Web Accessibility Checker 8

Wenn Sie auf jedes Symbol klicken, erhalten Sie weitere Informationen zu den oben gezeigten Elementen (in der Mitte der Seite).

Schauen wir uns nun eine andere Kategorie von Werkzeugen an:

Kostenlose Validatoren für die Barrierefreiheit von Webseiten:

Einige weitere der besten Tools zur Überprüfung der Barrierefreiheit im Internet:

Tools für Sehbehinderungen

Sehbehinderung bezieht sich auf einen Verlust des Sehvermögens. Es gibt verschiedene Arten von Sehbehinderungen:

  • Blindheit
  • Sehschwäche oder Sehbehinderung
  • Farbenblindheit

Benutzer mit Sehbehinderungen verwenden unterstützende Technologie-Software, die Inhalte vorliest.Zum BeispielJAWS für Windows-Betriebssysteme, NVDA für Windows-Betriebssysteme, Voice Over für Mac. UA-Benutzer mit schwacher Sicht können den Text auch mit einer Browsereinstellung oder einer großartigen Einstellung des Betriebssystems vergrößern. Wir werden diese Funktionen mithilfe von Lupen- und JAWS-Tools erlernen.

Webzugriff 9

A) Lupen

1) Zoom-Textlupe Vergrößert alles auf Ihrem Computerbildschirm und macht die Anwendung einfach zu sehen und zu verwenden. Sie können es von herunterladen dieser Link .
Um eine gute Vorstellung davon zu bekommen, wie dies funktioniert, empfehlen wir Ihnen dringend, eine kostenlose Testversion herunterzuladen und zu experimentieren.

zwei) Fensterlupe vergrößert auch verschiedene Teile des Bildschirms. Wir können es öffnen, indem Sie auf Ihrem Desktop auf die Schaltfläche Start klicken und dann Lupe eingeben. Klicken Sie auf das Programm Lupe. Wenn Sie mit der Maus über die Webseite fahren, vergrößert dieses Werkzeug den Bildschirm und zeigt ihn an.

Werkzeuge für Sehbehinderungen 1

3) Blinde Computerbenutzer, die keinen normalen Computermonitor verwenden können, verwenden eine aktualisierbare Braillezeile oder ein Braille-Terminal, um die Textausgabe zu lesen.

Gemäß Wikipedia Eine auffrischbare Braillezeile oder ein Braille-Terminal ist ein elektromechanisches Gerät zur Anzeige von Braillezeichen, üblicherweise mit Hilfe von Stiften mit runder Spitze, die durch Löcher in einer ebenen Fläche angehoben sind.

Tools für die Barrierefreiheit von Web Accessibility Vision 11

B) JAWS-Jobzugriff mit Sprache

JAWS ist ein Bildschirmleser zum Testen von Webseiten unter Windows-Betriebssystemen, mit dem sehbehinderte Benutzer den Bildschirm lesen können. JAWS unterstützt alle Versionen von Betriebssystemen und bietet eine aktualisierbare Braillezeile.

Webzugriff 12

Es folgen Tastaturbefehle zur Verwendung von JAWS:

Die Grundfunktionen, die mit Hilfe von JAWS getestet werden, sind:

  • JAWS bietet die Anzahl der Tastenanschläge zum Navigieren auf Webseiten. Zum Beispiel Pfeiltasten, Bild-auf- und -ab-Tasten, Home, Ende und mehrere andere JAWS-Navigationstasten.
  • Links, Bilder und Imagemaps: JAWS bietet Tastenanschläge zum Navigieren von einem Link zu einem anderen auf der Webseite.
  • HTML-Formularfelder und Steuerelemente : JAWS bietet Tastenanschläge zum Navigieren zwischen Formularelementen
  • HTML-Frames : Navigieren Sie mit der Tastatur durch Frames.
  • Tabellen : In Tabellenzellen navigieren

Dies ist ein kurzer Überblick über die verschiedenen Techniken und Werkzeuge, mit denen die Bewertung der Barrierefreiheit durchgeführt wird.

Tipps zur Barrierefreiheit für Entwickler und Tester

  • Haben alle aktiven Bilder Alt-Text, der angibt, was der Link oder die Schaltfläche bewirkt?
  • Haben alle dekorativen und redundanten Bilder null (alt = ””) Alt-Text?
  • Haben alle Informationsbilder Alt-Text, der die gleichen Informationen enthält wie die bereitgestellten Bilder?
  • Ist die Seite mit Überschriften organisiert? Sind sie als Überschriften markiert?
  • Können Sie über die Tastatur auf alles zugreifen?
  • Wird Ihre Seite in einem Screenreader in einer logischen Reihenfolge gelesen?
  • Ist klar, welches Element im Fokus steht, während Sie den Tastaturzugriff verwenden?
  • Sind alle wichtigen Informationen in einem Video über Standard-Audio oder durch zusätzliche Audiobeschreibung verfügbar?

Das Entwicklungsteam kann durch Code-Inspektion und Unit-Tests sicherstellen, dass das Produkt der Barrierefreiheit entspricht.

Typische Testfälle:

  • Stellen Sie sicher, dass alle Funktionen nur über die Tastatur verfügbar sind (verwenden Sie nicht die Maus).
  • Stellen Sie sicher, dass Informationen sichtbar sind, wenn die Anzeigeeinstellung in den kontrastreichen Modus geändert wird.
  • Stellen Sie sicher, dass die Bildschirmlesewerkzeuge den gesamten verfügbaren Text lesen können und jedem Bild / Bild ein entsprechender alternativer Text zugeordnet ist.
  • Stellen Sie sicher, dass produktdefinierte Tastaturaktionen keine Auswirkungen auf Tastaturkürzel für Eingabehilfen haben.

Fazit

Die Barrierefreiheit im Internet bietet viele Möglichkeiten für behinderte Benutzer. Wir müssen jedoch die Tatsache anerkennen, dass es schwierig ist, für alle Arten von Behinderungen oder Schwierigkeiten, die einen Benutzer daran hindern könnten, den Inhalt einer Website zu erreichen, vollständigen Zugriff zu gewähren.

Es können Schritte unternommen werden, die jedoch möglicherweise nicht 100% betragen. Wenn wir die in diesem Artikel beschriebenen Standards bereits in der Anfangsphase der Entwicklung befolgen, können wir für die meisten Benutzer problemlos eine zugängliche Website erstellen.

In den Kommentaren unten können Sie weitere Tools und Tipps zum Testen der Barrierefreiheit vorschlagen.

PREV Tutorial | ERSTES Tutorial

Literatur-Empfehlungen

^