Navigation | role=menubar is wrong (Bug in Contao 3.5.x and Contao 4.x)

[MacKP]

As mentioned at the conference from Sonja Weckenmann and @mayerhh the role menubar is wrong here. We can use the role 'navigation' at this point.
Also we can delete menuitem and menu here, because it is not necessary.
Everything else should be done from the developer himselve (when it is an flyout Navigation ore something else) by editing the template.

Here is an link to the old Ticket where we implemented this -> #6217

When you wish I can make an PR for that.

regards

[MacKP]

And here is an Link to the slide -> https://pbs.twimg.com/media/Ci4xIYSUgAAz_J0.jpg:large

[MacKP]

Some more Information about this -> http://w3c.github.io/aria/practices/aria-practices.html#landmark-navigation
I think we can't give it an default aria-labelledby :(

[NinaG]

Ursprünglich fand ich die menubar-Version logisch, aber mittlerweile habe ich das überdacht (insbesondere aufgrund des Artikels von Therill Thompson, den ich weiter unten verlinkt habe).

Vereinfacht ausgedrückt ist die Situation zurückzuführen auf die Frage "Wie interpretiert man eine Webnavigation?

role="navigation" ist eine allgemeine 'Landmark Role', das heißt, sie dient als Markierung eines Navigationsabschnitts auf der Website damit z.B. ein Screenreader-Nutzer diesen Abschnitt schnell anvisieren kann.

role="menubar" wird genutzt um (meist horizontale) Menüleisten zu gestalten, wie man sie aus klassischer Software (Desktop-Applikationen) kennt. Laut ARIA Spezifikation bietet das Menü eine Auswahl üblicher Aktionen und Funktionen, die der Nutzer auslösen kann.

Die Lösung liegt aus meiner Sicht darin, sich zu fragen, was die häufigste Aufgabe und Darstellungsart einer Web-Navigation ist. Insbesondere, weil wir im Contao-Template eine Lösung brauchen, die auf den Großteil der Navigationen passt. Die meisten Contao-Nutzer werden die Angaben nämlich 1:1 übernehmen und nicht anpassen.

Ersteres (role="navigation") passt natürlich immer, zweiteres (role="menubar") passt in bestimmten Fällen. Interessant finde ich an der Stelle die Definition von Terill Thompson ( http://terrillthompson.com/blog/47 ). Er argumentiert, dass menubar eher nicht für eine klassische Web-Navigation passt, weil die Web-Navigation keine Liste von "Aktionen oder Funktionen" (wie für role="menubar" gefordert), sondern einfach nur "Links enthält. Zudem verweist er darauf, dass Links mit der role="menuitem" von Screenreadern nicht mehr wie Links wahrgenommen werden (also z.B. nicht in der Linkliste des Screenreaders aufgeführt werden).

Wenn man Thompsons Ausführungen folgt (und das ist imho eine gute Idee), sollten wir in Contao für die Website-Navigations-Templates nicht mehr die Rollen "menubar, menu oder menu-item" nutzen. Es macht aber natürlich weiterhin Sinn, dass wir die Verbindung zwischen den verschiedenen Navigations-Levels kennzeichnen.

Als erste Schritte fände ich also sinnvoll:

• role="menubar", role="menu", role="menu-item" entfernen
• dem nav-Element die role="navigation" geben
• aria-haspopup="true" auf den Links, die ein Submenü enthalten, macht weiterhin Sinn

Darüber hinaus können wir imho nichts in das Standard-Template aufnehmen, da weitere ARIA-Angaben (aria-expended, aria-labelledby, etc) zu sehr davon abhängen, in welcher Form eine Website-Navigation eingesetzt wird. Das müssten dann wohl die Nutzer (die es interessiert) selbst spezifisch ergänzen, wenn es Sinn macht.

[MacKP]

Ich steh da fast voll und ganz hinter dir @NinaG allerdings bin ich mir bei aira-haspopup nicht sicher. Wenn ich mir das so durchlese https://www.w3.org/TR/wai-aria/states_and_properties#aria-haspopup , dann sollte man bei true eine Verknüpfung mit aria-owns herstellen -> https://www.w3.org/TR/wai-aria/states_and_properties#aria-owns Das sollte man aber nur machen, wenn der DOM das nicht wieder spiegelt. Das kann der Fall sein (bei einer getrennten Navigation für das Submenü), muß aber nicht (wenn das Menü einfach verschachtelt ist). Von daher sollten wir das glaube ich auch weg lassen, da das wieder individuell gesetzt werden müßte.

Wenn ich das gerade falsch interpretiere schiebe ich das einfach auf die Uhrzeit ;-) und bin gespannt, wie es richtig gemacht werden sollte ;-)

Viele Grüße

[MacKP]

Wobei sich das etwas anders liest: https://msdn.microsoft.com/de-de/library/jj152135%28v=vs.85%29.aspx

[leofeyer]

Geändert in f6116da.