Tastaturnavigation für Modul Menü & Kontextmenü

|Oliver Bartsch
Beitragsbild für Artikel Keyboard Navigation for Module Menu & Context Menu

Navigiere mit weniger Klicks durch deine TYPO3-Installation.

Barrierefreiheit war schon immer einer der wichtigsten Prioritäten von TYPO3. Entsprechend wurde vor einigen Jahren ein wichtiger und geschätzter Teil des TYPO3-Projekts, das TYPO3 Accessibility Team gegründet. Ihre Arbeit führte bereits zu erheblichen Verbesserungen im Backend, wie z. B. durch das Hinzufügen der Tastaturunterstützung für den SVG-basierten Seitenbaum in TYPO3 v10.

Des Weiteren bringt TYPO3 Version 11 die Tastaturunterstützung für einige weitere Komponenten im Backend, wodurch es für immer mehr Benutzer zugänglich wird.

Modul Menü

Das Modul Menü ist das Hauptmenü eines jeden TYPO3-Backends. Es ist auch der Einstiegspunkt, da es die erste Komponente ist, die beim Navigieren mit der Tastatur den Fokus erhält. Das Modul Menü unterstützt jetzt die Tastaturnavigation, wie von den ARIA Authoring Practices vorgegeben. Das bedeutet, dass die richtigen HTML-Attribute verwendet werden, um die Elemente und die verschiedenen Ebenen im Menü zu beschreiben.

Während es bereits generell möglich war, durch das Modul Menü zu navigieren, bringt Version 11 zusätzlich folgenden Funktionen, um dich in deinem täglichen Arbeitsablauf zu unterstützen:

  • Verwende die „Leertaste“ und „Eingabetaste“ zum auf- und zuklappen von Untermenüs. Durch gleichzeitiges Drücken der „Pfeil nach rechts“ Taste kann zudem der Fokus auf den ersten Punkt des Untermenüs gelegt werden.
  • Verwende die „Pfeil nach oben“ und „Pfeil nach unten“ Tasten, um innerhalb der aktuellen Ebene des Menüs zu navigieren.
  • Als Erweiterung zum ARIA-Pattern kann mit der „Strg“ bzw. „Command“ Taste und der „Home“ bzw. „Ende“ Taste durch die erste Ebene des Hauptmenüs navigiert werden.
  • Verwende die „Pfeil nach links“ und „Pfeil nach rechts“ Tasten innerhalb eines Untermenüs, um zum vorherigen oder nächsten Untermenü zu wechseln.
  • Verwenden die „Esc“ Taste, um zum übergeordneten Element eines Untermenü-Elements zu wechseln.

Hilfe Menü

Das Hilfe Menü in der oberen Leiste des Backends unterstützt jetzt auch die Tastaturnavigation, mit der gleichen Funktionalität wie das Modul Menü.

Kontextmenü

Aktives kontextsensitives Menü

Das kontextsensitive Menü, das spezifische Aktionen für jeden Datensatz bereitstellt, wird angezeigt, wenn auf das entsprechende Symbol des Datensatzes geklickt wird. Diese Funktionalität ist im gesamten Backend zu finden. Um die Zugänglichkeit dieser häufig verwendeten Komponente zu verbessern, wurde in Version 11 unter Beachtung der ARIA Authoring Practices ebenfalls die Tastaturunterstützung hinzugefügt. Daher ist es nun möglich, diese Komponente ausschließlich mit einer Tastatur zu verwenden. Es bedeutet auch, dass Screenreader das Kontextmenü jetzt richtig erkennen können. Um das Kontextmenü eines Datensatzes mit der Tastatur zu öffnen, fokussiere auf den Datensatz (Symbol) und drücke „Umschalt+F10“.

In dem geöffneten Menü kann mit den Pfeiltasten sowie den „Home“- und „Ende“ Tasten navigiert werden. Mit der „Leertaste“ wird eine Aktion aktiviert oder ein Menü der zweiten Ebene geöffnet.

Aktives kontextsensitives Menü

Datei- und Ordnerbäume

In TYPO3 v11 wurden die Datei- und Ordnerbäume aktualisiert und basieren nun ebenfalls auf der SVG-basierten Baumkomponente. Diese wurde in v9 eingeführt und vom Seitenbaum verwendet. Da die SVG-basierte Baumkomponente in v10 bereits mit der Tastaturunterstützung ausgestattet wurde, profitieren davon nun Ordner und Dateibäume, die entsprechend die gleiche Funktionalität bereitstellen.

Alle Bäume bieten Tastaturunterstützung

Mit TYPO3 v11 wurde ein großer Schritt nach vorne in Bezug auf zugängliche Bäume erreicht. Alle Bäume unterstützen nun, gemäß den ARIA Authoring Practices, vollumfänglich die Navigation per Tastatur.

Tastatur unterstützender Ordnerbaum in der Dateiliste
Tastatur unterstützender Ordnerbaum in der Dateiliste

Multi Record Selection und Zwischenablage

Wie im entsprechend Artikel über die neue Multi-Record-Selection-Komponente beschrieben, ist es jetzt - dank TYPO3 v11 - möglich, die Zwischenablage nur mit der Tastatur zu verwalten. Bei der Integration der Multi-Record-Selection-Komponente war Barrierefreiheit eine der Hauptprioritäten. Dies führte daher zu einer vollständigen Tastaturunterstützung sowie zu einigen Tastaturkürzeln, die du sicher nicht mehr vermissen möchtest.

Verbessert den Arbeitsablauf aller

Viele Menschen verwenden nur die Tastatur zum Navigieren – entweder aus Vorliebe oder aufgrund der Umstände. Die Möglichkeit, nur mit der Tastatur durch das Backend von TYPO3 zu navigieren, unterstützt daher jeden Backend-Benutzer und macht Arbeitsabläufe effizienter. Die Arbeit zur Verbesserung der Tastaturunterstützung fließt in Screenreader und andere unterstützende Technologien ein. Nutzt du bereits die neue Tastaturunterstützung? Wenn nicht, solltest du es unbedingt ausprobieren.

Bei b13 haben wir die Barrierefreiheit immer im Blick.

Wenn Du an diesem Thema interessiert bist oder Bereiche gefunden hast, die verbessert werden sollten, kontaktieren uns. Wir freuen uns sehr, von Dir zu hören.

Let's connect