Sidjämförelse

Lokalnavigationen är en desktopkomponent som visar artiklar som finns inom samma ämnesområde.

Innehållsförteckning

Komponentkällor

1177

Inera

Designspecifikation

Lokalnavigationen är en desktopkomponent som visar artiklar som finns inom samma ämnesområde, dvs den underlättar för navigering mellan relaterade artiklar som t.ex. bor under samma nod i strukturen. Komponenten kan innehålla en undernivå, men inte fler än två nivåer.

Lokalnavigationen placeras ovanför På sidan-navigering om sådan finns. Lokalnavigeringen finns bara på desktop och används endast på artikelsidor.

1177

Lokalnavigeringen är färgkodad röd: röda rubriker (secondary-darkPrimary30) på vit bakgrund, med röda streck mellan. Hover och aktiv Aktiv sida visas med rött vertikalt streck (mainPrimary40) till vänster om rubriken. Vid hover visas vertikalt streck till vänster och färg ändras till mörkare röd (Primary30).

Inera

Lokalnavigeringen har gröna rubriker (Accent40) på vit bakgrund, med grå streck mellan. Hover och aktiv Aktiv sida visas med grönt vertikalt streck (Accent40) till vänster om rubriken. Vid hover visas vertikalt streck till vänster och färg ändras till mörkare röd (Primary30).

Tillgänglighet

---

WCAG-kriteriet 1.4.1

1.4.1 Användning av färg: Använd inte enbart färg för att kommunicera information eller förändringar på webbsidor, eftersom skärmläsare inte kan uppfatta visuella förändringar. Nivå A

 

WCAG-kriteriet 1.4.11

1.4.11 Kontrast för icke-text: Se till att alla visuella element på webbsidan har tillräckligt kontrast (minst 3:1) mellan elementets färg och bakgrundsfärgen för att göra dem tydliga och läsbara. Nivå AA

 

WCAG-kriteriet 1.4.3

1.4.3 Kontrast mellan text och bakgrund: Se till att all text har tillräckligt högt kontrast mot bakgrunden, vanlig text ska ha minst 4,5:1 i kontrastvärde. Nivå: AA

 

WCAG-kriteriet 2.1.1

2.1.1 Tangentbord: Alla interaktiva element och funktionaliteter på webbsidan ska vara åtkomliga och kontrollerbara med hjälp av tangentbordet utan att kräva specifika tidslag för tangenttryckningar. Nivå A

 

WCAG-kriteriet 2.4.4

2.4.4 Skriv tydliga länkar: Se till att syftet med länkarna är så tydligt som möjligt även om de är tagna ur sitt sammanhang. Det ska vara lätt för användaren att förutse vart länken går så de kan avgöra om det vill klicka på länken eller inte. Nivå A

 

WCAG-kriteriet 2.4.1

2.4.1 Hoppa över block: Det ska finnas en mekanism som låter användare hoppa över innehåll som upprepas på flera webbsidor för att öka tillgängligheten och förbättra navigeringen. Nivå A

 

WCAG-kriteriet 2.4.5

2.4.5 Flera vägar: Se till att användare har flera sätt att hitta en webbsida, utom när sidan är resultatet av en process. Detta för att öka användbarheten och tillgängligheten på webbplatsen. Nivå AA

 

WCAG-kriteriet 3.2.3

3.2.3 Konsekvent navigering: Navigationsmenyer som upprepas på flera webbsidor ska ha samma ordning såvida inte användaren själv har initierat en förändring, för att skapa en förutsägbar och konsistent användarupplevelse. Nivå AA

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.