Marc: Popover ist hier besser als details/summary

Beitrag lesen

problematische Seite

Hej Matthias,

Falls geplant ist, doch eine auf details/summary basierende Navigation anzubieten, wir hatten das schon mal. Da war fast alles drin, was so gefordert wird. Nur die Bedienung mit den Pfeiltasten fehlte noch.

Im Prinzip geht es ja um ein disclosure widget.

Nicht wirklich, es ist ein flyout-Menü. Es gibt Gemeinsamkeiten und Unterschiede zwischen beidem.

Das wird im oberen Beispiel (Flyout-Menü mit toggle-Button) von Hand nachgebaut; als scheinbar einfachere Alternative wird eine Variante mit details/summary angeboten.

Die Kritik der mangelnden Semantik hat @Marc entkräftet, da er nach Rücksprache mit SR-Nutzern uns mitgeteilt hat, dass dies Screenreadern-Nutzern als gewohnt vorkommt.

Das war eine Annahme, ich habe keine Umfrage dazu gemacht.

Problem an den Eigenbaulösungen ist, dass jeder Webentwickler und jedes Framework eine eigene Variante hat.

Was uns aber nicht abhalten muss, eine weitere anzubieten für Leute, die hier Hilfe suchen, weil sie noch keine entsprechende Variante haben.

Und es wäre natürlich ideal, wenn es nicht so eine "kann keine offizielle Barriere finden"-Lösung wäre, sondern ein best practice.

Im Grunde so etwas wie beim W3C gezeigt.

Das ist aber auch noch recht rudimentär, insbesondere hat es keine deutschsprachigen Erläuterungen und als jemand, der nicht programmiert, kann ich nicht sagen, ob das verwendete JS auf aktuellem Stand ist.

Mehr dazu gibt es bei Heydon Pickerings inclusive design components.

Mit dem Hintergrundwissen kann man ein best practice erstellen und die Erstellung auf deutsch erläutern.

Mittlerweile gibt es mit popover eine barrierefreie, native HTML-lösung, die in allen Browsern außer dem Firefox funktioniert. Mit FF125 auch dort, sodass der Polyfill dann nach ca. 6 weiteren Monaten überflüssig sein wird.

Das habe ich noch nicht getestet, kann mir aber nicht vorstellen, dass das für Navigationen gedacht ist.

Dürfte ebenso "mittelprächtig" sein wie die Lösung mit details und summary

Die Signatur findet sich auf der Rückseite des Beitrags.

Hmmm - sehe ich nicht. Brauche ich dafür einen Flachbildschirm oder einen Röhrenmonitor?

Barrierefrei ist das aber nicht. Schreib es doch auf die Vorderseite!

Marc (marctrix)

--
Ceterum censeo Google esse delendam