Se till att innehållet anpassas efter skärmens riktning
Du kan aldrig veta vilken typ av skärm en person använder när hen besöker din webbplats eller hur hen väljer att vända skärmen – liggande eller stående. Därför ska innehåll och funktioner alltid fungera oavsett skärmens riktning.
Därför ska du anpassa innehåll för både stående och liggande skärmläge
Alla människor har inte möjlighet att vrida på sin skärm. Personer som exempelvis har sin digitala enhet fastmonterad på en rullstol kan behöva välja en skärmorientering och alltid använda denna. Skapa därför en design så att innehåll och funktioner kan hanteras oavsett skärmens riktning. Då kan var och en välja den skärmorientering de föredrar.
Vad kräver lagen?
Innehåll får inte begränsas till en enda skärmorientering
Det finns inget som hindrar att presentationen av innehåll och funktioner skiljer sig åt mellan liggande och stående skärmläge, så länge allt innehåll och alla funktioner är åtkomliga och går att använda oavsett skärmorientering.
Använd CSS-regler
Du kan få presentationen av innehåll och funktioner att fungera oavsett skärmriktning genom att en och samma uppsättning CSS-regler passar för båda ledderna. Det går även att använda olika CSS-regler anpassade för olika ledder och skärmbredder.
Undantag från lagkraven
Funktioner som är beroende av att användaren har skärmen i en viss riktning är undantagna från lagkravet.
Det kan till exempel vara ett pianoprogram, där liggande läge är nödvändigt för att alla tangenterna ska få plats.
Så testar du skärmorientering
Använd en mobil eller surfplatta och kontrollera att innehållet och funktioner anpassar sig och kan användas oavsett om mobilen eller surfplattan hålls i stående och liggande läge.
Utdrag ur WCAG
WCAG 1.3.4 (AA) Orientering
Innehållet är inte begränsat till en skärmorientering, exempelvis porträtt – eller lanskapsläge, utom i de fall där en specifik skärmorientering är nödvändig.
Originaltext på engelska: Success Criterion 1.3.4 Orientation (w3.org) Länk till annan webbplats.
Därför länkar vi till WCAG på svenska och engelska
Relaterade riktlinjer
Skapa en flexibel layout som fungerar vid förstoring eller liten skärm
Ditt svar hjälper oss att förbättra sidan
Senast uppdaterad: