Suche einen Sorting-Button bzw. ein Sorting Icon

[marctrix]

Hej JürgenB,

<button type="button" class="sortbutton sortedasc" aria-current="true">
  <span class="visually-hidden">Sortiere aufsteigend nach </span>
  <span class="visually-hidden">Sortiere absteigend nach </span>
  Vorsilbe
</button>

1. "Sortiere aufsteigend nach" und "Sortiere absteigend nach" wird blinden immer vorgelesen, egal wodrauf der Button steht. Sollte natürlich nur das jeweils richtige sein.

Einer der beiden Texte wird per css/Javascript mit display: none; versehen. Wird er dann trotzdem vorgelesen?

Nein, das sorgt dafür, dass der Text nicht mehr dargestellt wird. Nicht optisch, nicht akustisch, überhaupt nicht. 😉

Besser fände ich nach einigem Nachdenken: ohne JavaScript "Sortiere nach Vorsilbe" und mit Java Script sortiere <span>aufsteigend | absteigend</span> nach Vorsilbe"…

Macht dann immer Sinn, aber mit JavaScript ist es besser (progressive enhancement)…

Das ist dann ein echtes best practice example!

Marc