axe DevTools Pro

Ich werde versuchen, Ihnen einige Dinge zu zeigen, die meiner Meinung nach nützlich und wichtig sind über axe™ DevTools und dabei so wenige Worte wie möglich zu verwenden.

axe DevTools enthält eine Browsererweiterung, für deren Nutzung keine besonderen Kenntnisse erforderlich sind.

Sie installieren sie wie jede andere Erweiterung aus den Erweiterungsverzeichnissen.

Es ist ein Tab neben Ihren anderen DevTools.

Er ist vielleicht ganz rechts. Ich ziehe ihn gerne per Klick neben den Elements-Tab.

Jetzt kann ich meine Seite scannen und 57% der Barrierefreiheitsprobleme finden, zusammen mit Hilfe bei deren Behebung.

Hier ist ein <iframe> auf CodePen, dem ein title-Attribut fehlte.

Die Informationen in der Erweiterung selbst sind sehr hilfreich bei der Behebung des Problems, aber ich kann auch zu Deque University wechseln, um sehr klare, detaillierte Informationen über das Problem, wen es betrifft und wie es behoben werden kann, zu erhalten. Für das oben genannte Problem

Screenreader-Benutzer haben die Möglichkeit, eine Liste von Titeln für alle Frames auf einer Seite anzuzeigen. Das Hinzufügen von beschreibenden, eindeutigen Titeln ermöglicht es den Benutzern, den benötigten Frame schnell zu finden. Wenn keine Titel vorhanden sind, kann die Navigation durch Frames schnell schwierig und verwirrend werden.

axe DevTools Pro schaltet Intelligent Guided™ Tests frei, was bedeutet, dass wir 83% aller Barrierefreiheitsprobleme beheben können.

Es gibt viele Barrierefreiheitsprobleme, die eine statische Code-Analyse nicht erfassen kann. Hat Ihre Website zum Beispiel ein Modal? Wenn ja, erfordert dessen Testung einige Schritt-für-Schritt-Tests. Welche Schaltflächen öffnen es (da der Fokus dorthin zurückkehren muss)? Kann das Modal gefunden werden, sobald es geöffnet ist? Fängt es den Fokus ein? Ist es schließbar? Dies sind wichtige Probleme, an die man sich selbst nur schwer erinnern kann und die statisch nicht testbar sind. Aber Sie haben Glück, die Intelligent Guided Tests (die Sie durch ein Upgrade auf axe DevTools Pro erhalten) machen Probleme leicht erkennbar, da sie Sie durch jeden Schritt führen.

„Sorgen Sie für Axe-Sauberkeit, bevor Sie pushen.“ ist ein Teil der Unternehmenskultur, den ich unterstützen kann.

Sie committen keine Syntaxfehler im Code. Sie committen keinen schlecht formatierten Code. Committen Sie auch keine Barrierefreiheitsfehler. Öffnen Sie axe DevTools und sorgen Sie für Axe-Sauberkeit, bevor Sie neue Commits hochladen.

Freunde lassen Freunde keinen unzugänglichen Code ausliefern.