Hallo an das Team!
Dies ist eher ein kurzer Zwischenbericht. Ich habe in einem anderen Thread bemerkt, dass der Like-Button manchmal keine Zugänglichkeitsbeschriftung hat. Das Muster habe ich noch nicht gefunden. Es könnte jedoch damit zusammenhängen, ob ein Beitrag bereits eine oder mehrere Likes erhalten hat oder noch keine, und das Steuerelement wird entsprechend aufgeteilt. Dann sehe ich zwei Buttons. Einer zeigt die Anzahl an, der zweite ist unbeschriftet.
Marco
Ah, ich glaube, das liegt daran, dass wir hier auf Meta unser Discourse Reactions-Plugin testen (Notice: testing Discourse Reactions here on meta for 1 week!). Das müssen wir beheben! Danke für den Hinweis.
@Ahmed_Gagan Zur Info: Schau dir das bitte unbedingt an.
Ich habe es mit vielen verschiedenen Fällen getestet, konnte das Problem jedoch nicht reproduzieren. Die Beschriftung wurde immer angezeigt, aber beim ersten Mal gibt es eine gewisse Verzögerung – das ist das allgemeine Verhalten des title-Attributs.
Ich gehe davon aus, dass das Problem mit dem Tooltip für den „Gefällt mir"-Button zusammenhängt. Sind wir uns hier einig?
Ich beziehe mich darauf, was der Screenreader für den Button ausspricht, den Sie drücken, um einen Beitrag zu liken. Oder vielleicht können Sie auf irgendeine Weise andere Reaktionen hinzufügen, aber mein Screenreader teilt mir das überhaupt nicht mit. Das einzige Element, das ein Label erhält, ist das, das die aktuelle Anzahl der Likes anzeigt, falls diese 1 oder höher ist. Ist sie 0, existiert dieses Steuerelement nicht. Der Button, den ich drücken muss, um eine „Like“-Reaktion hinzuzufügen, ist für meine Screenreader unter Windows, Mac und iOS jedoch unbeschriftet.
Ich bin blind und verwende daher keine Maus. Außerdem ist das title-Attribut im Allgemeinen ohnehin problematisch für Touch-Interaktionen, da es normalerweise keine einfache Möglichkeit gibt, einen Maus-Hover auszulösen.
Ich hoffe, das hilft weiter…
Um es klarzustellen: Ich beziehe mich auf den Button #discourse-reactions-actions-916340 > div > div.discourse-reactions-reaction-button.my-likes > button. Dieser Button hat weder ein title- noch ein aria-label-Attribut, sondern enthält nur ein SVG, das als aria-hidden markiert ist. Selbst wenn dies nicht der Fall wäre, enthalten das SVG sowie seine Kind-Elemente keine Informationen, die ein Screenreader nutzen könnte. Die Lösung besteht also darin:
#discourse-reactions-counter-916340), sollte wahrscheinlich bessere Informationen darüber erhalten, wer genau mit welcher Reaktion reagiert hat. Ich weiß nicht, wie sehende Personen dies erfahren, wenn Sie auf diese Zahl klicken und dann irgendwo ein Popup erscheint. Aber auch dies muss für Screenreader- und Tastaturbenutzer zugänglich gemacht werden.Derzeit scheint das Widget zumindest für mich nur „Like“-Reaktionen zuzulassen.
Entschuldigen Sie die mehreren Beiträge, aber dies zeigt, wie akribisch es manchmal sein kann, die Ursache für etwas zu finden. Das title-Attribut bei Beiträgen, die nicht von mir stammen, befindet sich derzeit im übergeordneten div des eigentlichen „Like“-Buttons. Damit ein Screenreader es jedoch erfasst, muss das title-Attribut direkt auf dem Button selbst stehen. Screenreader erfassen Titel nicht einfach von irgendeinem Element. Dies wurde in den letzten 25 Jahren zu oft missbraucht, um diese Verallgemeinerung zu rechtfertigen. Wenn Sie das title-Attribut also auf das untergeordnete <button>-Element verschieben, wird der Screenreader es korrekt erfassen.
Danke, @MarcoZehe, dass du genau angegeben hast, wo der Titel benötigt wurde.
Ich habe hier einen PR hinzugefügt, der dein Problem löst.
@MarcoZehe, der PR wurde jetzt gemergt. Du kannst das neueste Plugin pullen und es ausprobieren.
Vielen Dank! Ich warte, bis diese Instanz den neuesten Code für das Plugin zieht. Ich betreibe keine eigene Discourse-Instanz, sodass ich das Plugin nirgendwoher ziehen kann. Vielen Dank für die schnelle Lösung!
Vielen Dank, Marco.
Ich habe die Reaktionen hier gerade erneut bereitgestellt (sollte in etwa 15 Minuten live sein).
Lass uns bitte wissen, ob das Problem behoben scheint.
Hallo @Sam, das Problem sieht für mich definitiv gelöst aus. Danke!
Vielen Dank, Marco, für das Testen!