GAAD2021: Fronta11y-Artikelserie

[Marc]

Hej alle,

Noch etwas Lesefutter für lange winterabende ;-)

Müsste auch was von mir kommen.

https://www.fronta11y.org/ak-barrierefreiheit/artikelserie-zum-globalaccessibilityday-2021/

Marc (marctrix)

[Matthias Scharwies]

Servus!

Hej alle,

Noch etwas Lesefutter für lange winterabende ;-)

Müsste auch was von mir kommen.

https://www.fronta11y.org/ak-barrierefreiheit/artikelserie-zum-globalaccessibilityday-2021/

Sehr interessant. Könntest Du etwas zum Global Accessibility Awareness Day (GAAD) für unseren Blog schreiben? Im Mai ist da noch nichts vorhanden!

Herzliche Grüße

Matthias Scharwies

[Marc]

Hej Matthias,

Könntest Du etwas zum Global Accessibility Awareness Day (GAAD) für unseren Blog schreiben? Im Mai ist da noch nichts vorhanden!

Leider nicht, ehrlich gesagt. Ich weiß da nicht viel drüber, außer dass damit Aufmerksamkeit erzeugt werden soll und dass der Tag jährlich statt findet.

Das reicht nicht für einen Artikel und ich habe leider bis mindestens Ende dieses Monats so viel Arbeit, dass ich es nicht schaffe, einen vernünftigen Artikel über so etwas zu schreiben, was ich noch nicht ordentlich recherchiert habe.

Ich halte es mal im Hinterkopf. Vielleicht fällt mir etwas ein was ich "einfach so unterschreiben" kann, weil ich das nicht groß recherchieren muss.

Bin echt im Stress aktuell…

Marc (marctrix)

[JürgenB]

Hallo Marc,

ich habe deinen Beitrag zum Anlass genommen, im Tutorial den Link zur aktuellen Seite so darzustellen:

<li aria-current="page"><a tabindex="0">Link zur aktuellen Seite</a></li>

#sitenav li[aria-current] a[tabindex]::before { ... }

Als Platzhalter für den Linktext steht im Tutorial „Link zur aktuellen Seite“, auf meiner Site habe ich den Originaltext stehen gelassen. Was ist da besser?

Warum wird tabindex="0" empfohlen? Wenn ich mich durch die Linkliste durchtabbe, muss ich den Link zur aktuellen Seite doch nicht mitnehmen, oder?

Gruß
Jürgen

[Marc]

Hej JürgenB,

ich habe deinen Beitrag zum Anlass genommen, im Tutorial den Link zur aktuellen Seite so darzustellen:

<li aria-current="page"><a tabindex="0">Link zur aktuellen Seite</a></li>

#sitenav li[aria-current] a[tabindex]::before { ... }

Als Platzhalter für den Linktext steht im Tutorial „Link zur aktuellen Seite“, auf meiner Site habe ich den Originaltext stehen gelassen. Was ist da besser?

aria-current, weil das in der Sprache vorgelesen wird, in der der Screenreader betrieben wird und somit so, wie der Nutzer es gewohnt ist. Selbst auf Deutsch könnte der Screenreader ja etwas anderes ausgeben. Dann kann es verwirren, wenn da etwas anderes gelesen wird als auf anderen Webseiten.

Statt "Link zur aktuellen Seite" sollte da auf jeden Fall der name der Seite stehen, so wie sonst auch.

Warum wird tabindex="0" empfohlen? Wenn ich mich durch die Linkliste durchtabbe, muss ich den Link zur aktuellen Seite doch nicht mitnehmen, oder?

Dann erfahren Blinde ja nciht, auf welcher Seite Sie gerade sind. 😉

Sie erfahren auch cniht, wo die Seite in den Seitenbaum eingeordnet ist. Die Navigation ist eigentlich ein wichtiges Hilfsmittel zur Orientierung - bei Navigationen, die die meiste Zeit zu sind, ist das natürlich nicht mehr so offensichtlich wie bei den früher üblichen Navigationen an der Seite. Die BLE hat das noch. Nur die ersten beiden Ebenen sind in der horizontalen Navigation, alles andere ist übersichtlich auf der rechten Seite dargestellt.

Hier zum Beispiel:

https://www.ble.de/DE/Themen/Landwirtschaft/Biologische-Vielfalt/Nationales-Fachprogramm-Pflanzen/nationales-fachprogramm-pflanzen_node.html

Marc (marctrix)

[JürgenB]

Hallo Marc,

Statt "Link zur aktuellen Seite" sollte da auf jeden Fall der name der Seite stehen, so wie sonst auch.

geändert.

Warum wird tabindex="0" empfohlen? Wenn ich mich durch die Linkliste durchtabbe, muss ich den Link zur aktuellen Seite doch nicht mitnehmen, oder?

Dann erfahren Blinde ja nciht, auf welcher Seite Sie gerade sind. 😉

eigentlich sollten sie doch wissen, wohin sie surfen 😀

Sie erfahren auch cniht, wo die Seite in den Seitenbaum eingeordnet ist.

das ist der entscheidende Tipp.

Danke.

Gruß
Jürgen

[Marc]

Hej JürgenB,

Dann erfahren Blinde ja nciht, auf welcher Seite Sie gerade sind. 😉

eigentlich sollten sie doch wissen, wohin sie surfen 😀

Nur der Vollständigkeit halber: wissen sie vermutlich auch, der Seitentitel wird ja auch ausgegeben. Aber der ist ja auch nicht immer aussagekräftig. Und häufig hat man ja auch einfach einen Link in einer Suchmaschine angeklickt und ist dann halt "irgendwo" gelandet.

Marc (marctrix)

[Marc]

Hej JürgenB,

Statt "Link zur aktuellen Seite" sollte da auf jeden Fall der name der Seite stehen, so wie sonst auch.

geändert.

Du solltest nicht zu viel Arbeit rein stecken, denn grundsätzlich ist die Verwendung von details und summary ein Hack. Ich habe das schon früher mal erwähnt, bin dann hier aber überstimmt worden, wenn ich mich recht erinnere - zumal ich ja ursprünglich auch von der Idee so überrascht war, dass ich einfach mal geschaut habe, ob das so funktioniert. Tut es, aber es gibt gute Argumente Navigationen nciht mit diesen Elementen zu Aufklappbaren Boxen machen. Natürlich finde ich die gerade nicht...

Marc (marctrix)

[JürgenB]

Hallo Marc,

Du solltest nicht zu viel Arbeit rein stecken,

ich verwende die Navigation auch auf meiner Site, daher habe ich schon ein Eigeninteresse.

… details und summary ein Hack

na ja, ist die Anreicherung von LIs mit reichlich Aria-Labeln und deren Auf- und Zuklappen mit Javascript nicht auch ein Hack?

… gute Argumente Navigationen nciht mit diesen Elementen zu Aufklappbaren Boxen machen.

Die habe ich auch gelesen, aber nicht für gut befunden. Die waren eher in die Richtung „Unterstützen Screenreader denn schon details/summary?“ oder „Warum, es gibt doch schon Lösungen.“

Gruß
Jürgen

[Marc]

Hej JürgenB,

Du solltest nicht zu viel Arbeit rein stecken,

ich verwende die Navigation auch auf meiner Site, daher habe ich schon ein Eigeninteresse.

… details und summary ein Hack

na ja, ist die Anreicherung von LIs mit reichlich Aria-Labeln und deren Auf- und Zuklappen mit Javascript nicht auch ein Hack?

Nicht wirklich. Erst mal ist eine verschachtelte Liste genau die Form, wie man eine verschachtelte Seitenstruktur abbilden soll. Nichts anderes in HTML passt da besser.

Die Frage ist eher: warum diese tolle Orientierungshilfe verstecken?

Mir persönlich ist ein details-Element sympathisch, in dem der ganze Seitenbaum zu sehen ist (sofern es sich um eine kleine Site handelt, sondern der Baum der Oberrubrik, in dem man sich befindet).

Die bleibt dann auch offen, bis der Nutzer sich entscheidet, den Baum zuzuklappen, weil er ihn nicht mehr benötigt.

Aber "die beste" Lösung gibt es nciht. Sie hängt von Nutzungsszenarien, Einsatzzweck, Umfang der Site usw ab.

… gute Argumente Navigationen nciht mit diesen Elementen zu Aufklappbaren Boxen machen.

Die habe ich auch gelesen, aber nicht für gut befunden. Die waren eher in die Richtung „Unterstützen Screenreader denn schon details/summary?“ oder „Warum, es gibt doch schon Lösungen.“

Für mich entscheidend: so weit ich mich erinnere habe ich deine Lösung im Wiki mit Tastatur usw getestet und egal ob es theoretisch bessere Dinge gibt: man kommt mit dieser Navigation zurecht auch wenn man in dieser oder jener Hinsicht eingeschränkt ist. Und letztlich kommt es auf den Nutzer an.

Insofern war ich da vielleicht heute morgen etwas zu harsch.

Ich neige dazu Lösungen, die letztlich für die meisten oder alle gut funktionieren abzulehnen, wenn ich hoffe, da müsse ss doch noch etwas passenderes, richtigeres geben. Es fühlt sich nach wie vor komisch an. Aber das ist ja nicht wirklich ein Argument. 😉

Ein plus jedenfalls auch von mir für Deine letzte Antwort!

Marc (marctrix)