För att arbeta på liknande sätt med laddning av innehåll i våra olika tjänster har vi tagit fram riktlinjer för hur vi kan visualisera och informera om laddning. Vi har identifierat tre olika case:
Knapp när en användare ska skicka något (där vi inte vill att knappen ska klickas på många gånger)
När innehåll ska laddas in på specifik plats (i en behållare som t ex tabell)
En hel sida ska laddas in
Knapp - loading button
.png?version=1&modificationDate=1697031340252&cacheVersion=1&api=v2&width=248&height=161)
Komponenten loading button kan användas när användaren klickat på en knapp för att indikera att tjänsten eller systemet laddar.
Vid användning av en loading button är tillgänglighet viktig. För att användare som har nedsatt syn så är det viktigt att skärmläsare kan berätta att en laddning pågår. För att göra detta så kan aria-attributet aria-live="polite" användas. Det är ett attribut som används för att beskriva dynamiskt innehåll. Undvik att använda =”assertive” så långt som möjligt, denna ska enbart användas om det är kritisk information som måste förmedlas till användaren direkt.
Läs mer på: https://dockyard.com/blog/2020/03/02/accessible-loading-indicatorswith-no-extra-elements
Exempel på användning
Innehåll laddas in på specifik plats
Exempeltext.
Exempel på användning
[Bild här]
Hel sida laddas
Exempeltext.
Exempel på användning
[Bild här]