Statusmeldinger

Silktide ber deg kontrollere at statusmeldinger – toast-varsler, snackbars, varslingsbannere samt bekreftelser og feilmeldinger – er satt opp slik at kunngjør dem når de vises.

Dette er en : Automatisering kan ikke pålitelig fastslå hvilke elementer som er statusområder (klassenavn, språk og minifisert markup varierer uendelig), så Silktide viser spørsmålet på hver side, og en person bekrefter det.

<!-- Silent: screen readers won't announce this when it appears -->
<div class="toast">Item added to cart</div>

<!-- Announced: role="status" makes it a live region -->
<div class="toast" role="status">Item added to cart</div>

Hvorfor dette er viktig

Statusmeldinger rapporterer resultatet av det en bruker nettopp gjorde: «Skjema lagret», «Vare lagt i handlekurven», «3 resultater funnet», «Noe gikk galt». Seende brukere legger merke til at de vises; en skjermleser leser det som har fokus, og en melding som vises et annet sted på siden, sier ingenting. Brukeren sender inn et skjema og hører stillhet – de kan ikke vite om det fungerte, mislyktes eller fortsatt lastes inn.

Når meldingen merkes som et , får beskjed om å kunngjøre den i det øyeblikket den vises, uten å flytte brukerens fokus.

Hva du skal kontrollere

Finn alle statusområder på siden (toast-varsler, snackbars, flash-meldinger, innebygde bannere for bekreftelser/feil og oppdateringer av resultattall).
Bekreft at hvert av dem – eller en permanent beholder som det skriver til – har role="status", role="alert", role="log" eller aria-live="polite" / aria-live="assertive".
Foretrekk en beholder for live-området som finnes når siden lastes inn, og sett bare inn meldingsteksten under kjøring. Live-områder som opprettes samtidig med meldingen, blir ofte ikke kunngjort.

Hvis siden ikke har noen statusmeldinger, eller alle kunngjøres korrekt, funnet.

Slik løser du det

Legg til en rolle for live-området i meldingsbeholderen:
- role="status" for vanlige oppdateringer, for eksempel bekreftelser og resultattall.
- role="alert" for viktige, tidskritiske meldinger, for eksempel feil.
Eller bruk -attributtet direkte: aria-live="polite" (venter på en pause i talen) eller aria-live="assertive" (avbryter umiddelbart).

Slik tester Silktide dette

Silktide kan ikke pålitelig oppdage statusområder automatisk – gjetting basert på klassenavn skaper falsk trygghet og overser generert eller ikke-engelsk markup – så denne kontrollen viser ett spørsmål om gjennomgang per side, med en beskrivelse av hva som skal kontrolleres.