So verwenden Sie Proxys für Tests zur Barrierefreiheit im Web

Die Rolle von Proxys beim Testen der Barrierefreiheit im Web verstehen

Ähnlich wie die Kunst des Kintsugi, die Unvollkommenheiten hervorhebt, statt sie zu verbergen, zielt das Testen der Barrierefreiheit im Internet darauf ab, Barrieren aufzudecken, um digitale Erlebnisse für alle zu ermöglichen. Proxys, die als Vermittler fungieren, ermöglichen es Testern, das Internet aus verschiedenen Perspektiven – geografisch, technologisch und perzeptuell – wahrzunehmen. Dies spiegelt das buddhistische Konzept des „Shoshin“ (初心) oder des Anfängergeistes wider: offen, neugierig und frei von Annahmen.

---

Arten von Proxys, die bei Barrierefreiheitstests verwendet werden

Proxy-Typ	Primärer Anwendungsfall	Vorteile	Nachteile
HTTP/S-Proxy	Überprüfen und ändern Sie den Webverkehr und testen Sie die Bereitstellung alternativer Inhalte.	Flexibel, unterstützt SSL-Entschlüsselung	Die Konfiguration kann komplex sein
SOCKS-Proxy	Leiten Sie den gesamten Datenverkehr auf TCP-Ebene weiter	Protokollunabhängig, funktioniert mit vielen Anwendungen	Eingeschränkte Inhaltsprüfung
Reverse-Proxy	Simulieren Sie serverseitige Änderungen und testen Sie die Zugänglichkeit an der Quelle	Zentralisierte Steuerung, Caching	Nicht geeignet für clientseitige Skripte
Zugänglichkeitsproxy	Spezialisiert auf die Simulation unterstützender Technologien (z. B. Bildschirmleseprogramme)	Fokussiert auf 11-Jahres-Szenarien	Weniger Werkzeuge verfügbar

---

Warum Proxys für Barrierefreiheitstests verwenden?

So wie der Zen-Garten durch sorgfältige Anordnung die Landschaft offenbart, enthüllen Proxys verborgene Wege und Hindernisse bei der digitalen Zugänglichkeit, wie zum Beispiel:

• Testen der alternativen Textübermittlung an Bildschirmleseprogramme
• Simulation langsamer oder unzuverlässiger Verbindungen (Nachahmung realer Benutzereinschränkungen)
• Abfangen und Ändern von Anfragen zur Bewertung der Reaktion auf unterstützende Technologien
• Zugriff auf geografisch eingeschränkte Inhalte zum Testen der Lokalisierung und Sprachunterstützung

---

Einrichten eines HTTP-Proxys für Barrierefreiheitstests

Beispiel: Verwenden Geiger

1. Installieren Sie Fiddler: Laden Sie Fiddler von der offiziellen Site herunter und installieren Sie es.
2. Browser/Gerät konfigurieren: Stellen Sie den Proxy Ihres Browsers auf 127.0.0.1:8888 (der Standard-Fiddler-Port).
3. Datenverkehr erfassen: Öffnen Sie Fiddler und beginnen Sie mit der Erfassung. Alle HTTP/S-Anfragen werden über Fiddler geleitet.
4. Anfragen ändern: Verwenden Sie den „AutoResponder“ von Fiddler, um Bilder, CSS oder Skripte durch Alternativen auszutauschen, die unterstützende technische Verhaltensweisen simulieren.
5. Testausgabe: Öffnen Sie Ihre Site im Browser und verwenden Sie Bildschirmleseprogramme wie NVDA oder DER WEIßE HAI um zu überprüfen, wie sich Änderungen auf die Zugänglichkeit auswirken.

Codebeispiel: FiddlerScript zum Austauschen von Bildern mit ALT-Text

System importieren; Fiddler importieren; Klasse Handlers { öffentliche statische Funktion OnBeforeResponse(oSession: Session) { wenn (oSession.uriContains("example.com/image.jpg")) { oSession.utilReplaceInResponse("

---

Simulation unterstützender Technologien mit Barrierefreiheits-Proxys

So wie ein Kalligraf viele Pinsel testet, kann Ihnen ein Barrierefreiheits-Proxy dabei helfen, zu beobachten, wie verschiedene unterstützende Technologien Ihre Site interpretieren.

• Axt-Proxy: Integriert Axtkern Barrierefreiheits-Engine in einen Proxy-Server. Sie fängt HTTP-Anfragen ab, fügt Axe in Antworten ein und gibt automatisierte Barrierefreiheitsberichte zurück.
• Axe-Proxy einrichten:
  1. Installieren Sie Node.js.
  2. npm install -g axe-proxy
  3. Laufen: axe-proxy --port 8080
  4. Stellen Sie den Browser/Systemproxy auf lokaler Host: 8080
  5. Durchsuchen Sie Ihre Site und überprüfen Sie die vom Proxy gemeldeten Barrierefreiheitsverletzungen.

---

Testen langsamer Verbindungen und Fallbacks

So wie ein Teemeister den Tee langsamer einschenkt, um das Aroma zu genießen, simulieren Sie langsame Netzwerke, um zu testen, wie Ihre Website reagiert. Benutzer unterstützender Technologien haben oft eine begrenzte Bandbreite.

• Verwenden Charles Proxy:
  1. Öffne Charles.
  2. Gehen Sie zu Proxy > Drosseleinstellungen.
  3. Aktivieren Sie die Drosselung und wählen Sie die Geschwindigkeit (z. B. 56 Kbit/s).
  4. Beobachten Sie das Laden der Site und den Fallback-Inhalt, insbesondere bei Bildern und Skripten.

---

Abfangen und Ändern von HTTP-Antworten

Um die Unbeständigkeit zu berücksichtigen, testen Sie, wie Ihre Site mit fehlenden, geänderten oder fehlerhaften Ressourcen umgeht:

• Verwenden Sie mit Fiddler oder Charles Umschreibetools, um:
  • Entfernen oder beschädigen Sie ARIA-Attribute
  • Blockieren Sie CSS, um die Fokussichtbarkeit zu testen
  • Ersetzen Sie Text durch eine andere Sprache

Beispiel: Entfernen von ARIA-Attributen mit Mitmproxy

von mitmproxy importiere http def response(flow: http.HTTPFlow) -> Keine: wenn b'aria-label' in flow.response.content: flow.response.content = flow.response.content.replace(b'aria-label', b'')

• Speichern unter remove_aria.py
• Laufen: mitmproxy -s remove_aria.py

---

Vergleichen von Proxys für Barrierefreiheitstests

Werkzeug	Plattform	Einzigartige Funktionen	Bester Anwendungsfall	Link
Geiger	Windows/Mac	AutoResponder, Inspektoren	Manipulation des HTTP/S-Verkehrs	https://www.telerik.com/fiddler
Charles Proxy	Windows/Mac	Drosselung, Karte lokal	Simulation langsamer Netzwerke, Offline-Tests	https://www.charlesproxy.com/
mitmproxy	Plattformübergreifend	Python-Skripting, CLI	Benutzerdefinierte Antwortmanipulation	https://mitmproxy.org/
Axt-Proxy	Node.js	Automatisierte a11y-Analyse	Automatisierte Zugänglichkeitstests	https://github.com/dequelabs/axe-proxy

---

Praktische Anwendungsfälle und Schritt-für-Schritt-Anleitung

1. Testen von ALT-Fallbacks für Bilder

   • Verwenden Sie Fiddler AutoResponder, um Bilder zu entfernen.
   • Testen Sie mit Bildschirmlesegeräten, um sicherzustellen, dass beschreibende ALT-Zeichen angesagt werden.

2. Überprüfen der Tastaturnavigation

   • Blockieren Sie mit Charles CSS, um die Tabulatorreihenfolge und Fokussierungsstile anzuzeigen.
   • Gehen Sie manuell durch die Benutzeroberfläche, um eine logische Reihenfolge sicherzustellen.

3. Sprache und Lokalisierung

   • Verwenden Sie mitmproxy, um Textknoten durch alternative Sprachen zu ersetzen.
   • Überprüfen Sie Sprachattribute und Ankündigungen mit Bildschirmleseprogrammen.

4. Testen auf ARIA-Missbrauch

   • Fangen Sie Antworten ab, um ARIA-Rollen und -Eigenschaften zu entfernen oder zu ändern.
   • Beobachten Sie Änderungen im Feedback zur unterstützenden Technologie.

---

Kulturelle Einsicht: Der Weg der kontinuierlichen Verfeinerung

In der japanischen Handwerkskunst steht „Kaizen“ für kontinuierliche Verbesserung. Barrierefreiheit im Web ist, wie das geduldige Formen eines Bonsais, ein fortlaufender Prozess. Mithilfe von Proxys passen Sie Ihre Website an die unterschiedlichen Erfahrungen Ihrer Nutzer an und verfeinern so nicht nur die technische Struktur, sondern auch die Seele des Webs selbst.

Weitere Informationen finden Sie unter:
– WebAIM: Einführung in die Barrierefreiheit im Web
– W3C-Zugänglichkeitstests
– Deque University: Tools zum Testen der Barrierefreiheit

Sorgen Sie wie ein weiser Gärtner für vielfältige Testwerkzeuge, überlegte Methoden und unerschütterliches Engagement für Inklusion.