Popover ist hier besser als details/summary

[Matthias Scharwies]

Servus!

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

Nicht immer alles selber bauen! Standards verwenden! ^[1]

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,

Mach mal! Warum haben die Profis immer so viele Angst vor Neuerungen?

kann mir aber nicht vorstellen, dass das für Navigationen gedacht ist.

Doch!

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

Nein! Es ist semantisch frei, aber völlig zugänglich. Die ganzen role- und aria-Attribute werden schon im Standardverhalten durch den Browser angelegt. Für Nutzer hat es den Vorteil, dass es eben immer die gleiche UI ist.

Herzliche Grüße

Matthias Scharwies

---

1. Ich fand's bemerkenswert, dass @Hörnchen Rolf und mir sagte, dass er anstelle des dialog-Elements ein div mit role="dialog" verwenden würde, weil's besser wäre. ↩︎