Range

Range låter användaren ange ett numeriskt värde som inte får vara mindre eller större än ett givet värde.

Open

1177

 

Open

Inera

 

Innehållsförteckning

Komponentkällor

1177

Inera

Tillgänglighet

Allmänt:

Ha tydliga instruktioner/beskrivning i relation till komponenten så seende och användare med skärmläsare förstår vad som förväntas av dom när de ska välja en input. Förklara vad som är minimum/maximum värdet så användaren vet vad hen ska ange i inputen.

En visuell feedback i form av siffror eller text längs range-komponenten är bra för användaren att se så de förstår vilket värde de står på/väljer. Användare med skärmläsare ska få värdet beskrivet för dom via skärmläsaren när de flyttar markören i range-komponenten.

2.5.3 Label in Name 

Se till att text som är synlig på knappar och andra gränssnittskontroller också finns i, och överensstämmer med, den maskinläsbara etikett som representerar kontrollen i exempelvis program för röststyrning. Använd bara samma maskinläsbara etikett för flera kontroller om de gör exakt samma sak.  (Nivå A) https://webbriktlinjer.se/162

2.5.1 Pointer Gester

Erbjud alternativ till komplexa fingerrörelser exempel: Se till att all funktionalitet går att utföra med flera fingrar även går att utföra med bara ett finger. Eller istället för att behöva svepa med fingret så ska det gå att trycka. (Nivå A)

2.1.2 Ingen tangentbordsfälla

Om tangentbordsfokus kan flyttas till en komponent på webbsidan via ett tangentbord så kan också fokus flyttas bort från samma komponent med hjälp av tangentbordet. (Nivå A)

2.1.1 Tangentbord

All funktionalitet är hanterbar via ett gränssnitt för tangentbord utan att det krävs särskild timing för varje enskild tangenttryckning. (Nivå A)

1.4.10 Reflow 

Skapa en flexibel layout som fungerar vid förstoring eller liten skärm. Layout som fungerar på en 320 pixlar bred skärm utan att information eller funktionalitet går förlorad och utan scrollning i mer än en riktning. (AA)

1.4.11 Non-text Contrast 

Icke-text-objekt som exempelvis: interaktiva komponenter och grafiska objekt ska uppnå mint 3.0 i kontrastvärde. Liten text ska uppnå mint 4.5 och stor text 3.0  i kontrastvärde (Nivå AA)

2.4.7 Synligt fokus

Användargränssnitt som styrs via tangentbord har ett sätt att visa var fokus är vid tangentbordsnavigering. (Nivå AA)

1.3.4 Orientation

Innehållet ska inte vara begränsat till en specifik vy, innehållet ska vara responsivt ifall användaren vill ha liggande läge på exempelvis surfplatta utan att funktionalitet eller information försvinner eller går sönder. (Nivå AA)

4.1.2 Namn, roll, värde

För alla komponenter i ett användargränssnitt (inklusive, men inte begränsat till formulärelement, länkar och komponenter skapade med script), kan namnet och rollen automatiskt tydliggöras. Status, egenskaper och värden som kan anges av användaren kan bli automatiskt tydliggjord, och meddelande om ändringar i dessa komponenter finns åtkomliga för användarprogram, inklusive hjälpmedel. (Nivå A)

3.3.2 Ledtexter/etiketter eller instruktioner

Det finns Ledtexter/etiketter eller instruktioner när innehåll kräver inmatning från användaren. (Nivå A)

2.4.6 Rubriker och ledtexter/etiketter

Rubriker och ledtexter/etiketter beskriver ämne eller syfte. (Nivå AA)

3.2.2 Vid inmatning

Att ändra inställningarna för en komponent i ett användargränssnitt orsakar inte automatiskt en förändring av sammanhanget, om inte användaren förvarnats om detta innan komponenten används. (Nivå A)

Feedback

Hjälp oss att förbättra den här komponenten genom att ge feedback, ställa frågor och lämna andra kommentarer på Inera UX Slacken i kanalen #komponenter_design eller #komponenter_kod alternativt kan du använda vårt formulär.