aria-posinset

Hvornår bruges det

Når DOM ikke indeholder det fulde sæt — virtualiserede lister, der kun renderer synlige punkter, paginerede grids, filtrerede comboboxes, feeds med uendelig scroll. Uden aria-posinset og aria-setsize må skærmlæseren gætte ud fra søskende-tælling og vil annoncere “punkt 1 af 10”, selvom brugeren reelt er på punkt 327 af 5.000.

Gyldigt på punkter inden i beholdere, der er sætlignende af natur: option inden i listbox, menuitem inden i menu, treeitem inden i tree, tab inden i tablist, article inden i feed, row inden i grid.

Hvis DOM naturligt indeholder alle punkter i kildekoderækkefølge, er aria-posinset ikke nødvendig; AT tæller søskende automatisk.

Sådan fungerer det

Værdien er et positivt heltal — det 1-baserede indeks for dette punkt i det komplette sæt. Parres med aria-setsize på det samme punkt; begge attributter hører til på punkterne selv, ikke på beholderen.

Når punkter filtreres, opdatér begge attributter til at afspejle det synlige og relevante sæt, ikke den originale fulde liste. Ellers hører brugerne positioner, der ikke stemmer overens med det, de kan navigere til.

aria-setsize="-1" er gyldigt i tilfælde, hvor totalen reelt er ukendt (et åbent søg-mens-du-skriver-feed). Noget AT annoncerer det som “mange”; andet forbliver tavs.

Hyppige fejl

• Sætning af aria-posinset uden aria-setsize. Halvdelen af informationen mangler; AT kan ikke sige “3 af hvor mange”.
• Glemsel af at opdatere værdier efter sortering eller filtrering. Brugerne hører forældede positioner.
• Placering af attributterne på beholderen i stedet for punkterne.
• Brug af aria-posinset, når DOM allerede afspejler det fulde sæt — AT ville have talt korrekt alligevel, og nu er der to sandhedskilder, der kan komme ud af sync.
• Nul eller negative værdier for aria-posinset (negative er ikke tilladt; kun aria-setsize accepterer -1).
• Positionsnumre, der ikke stemmer overens med den visuelle rækkefølge — en skærmlæserbruger læser “punkt 5”, mens det tredje synlige punkt er fremhævet.

Eksempel

<!-- Virtualiseret listbox: kun punkter 12-16 er i DOM, men sættet er 5.000 langt -->
<div role="listbox" aria-label="Customers">
  <div role="option" aria-posinset="12" aria-setsize="5000">Customer 12</div>
  <div role="option" aria-posinset="13" aria-setsize="5000">Customer 13</div>
  <div role="option" aria-posinset="14" aria-setsize="5000" aria-selected="true">Customer 14</div>
  <div role="option" aria-posinset="15" aria-setsize="5000">Customer 15</div>
  <div role="option" aria-posinset="16" aria-setsize="5000">Customer 16</div>
</div>