Presentera innehållet i en meningsfull ordning

Därför ska innehållet vara maskinläsbart och presenteras i en meningsfull ordning

Alla personer tar inte del av information på samma sätt och i samma ordning. En visuell presentation kan till exempel använda kolumner och rutnät för att fördela innehållet i två dimensioner, medan en skärmläsare presenterar innehållet sekventiellt. Samma sak gäller i appar där hjälpmedel går igenom innehållet i en meningsfull ordning.

Att innehållets maskinläsbara läsordning är meningsfull och begriplig kan även hjälpa personer som tar del av innehållet i olika fönsterstorlekar (viewport) eller med egna stilmallar. I appar kan det på motsvarande sätt hjälpa när layouten anpassas efter skärmstorlek, textstorlek eller orientering.

Även när innehållet växlar mellan vänsterställd och högerställd ordning är det viktigt att läsriktningen är förväntad.

Vad innebär kravet?

Om innehållets ordning spelar roll för att förstå innehållet, måste samma meningsfulla ordning gå att uppfatta även utan att se den visuella presentationen. Det gäller både på webben och i appar.

Kravet handlar inte om att det bara ska finnas en enda möjlig ordning. Det handlar om att när ordningen har betydelse, ska den ordning som förmedlar rätt innebörd också vara den som hjälpmedel får tillgång till.

• Undvik att enbart flytta runt innehåll visuellt om det gör att uppläsningen hamnar i en annan ordning.
• Om en vy i en app är uppbyggd som ett rutnät eller flera kolumner: bestäm en tydlig ordning som fungerar när innehållet läses sekventiellt, till exempel rad för rad.
• Se till att rubriker kommer före det innehåll som de hör ihop med.
• Vid dynamiskt innehåll: undvik att nya element bryter en pågående läsning eller flyttar fokus på ett sätt som gör ordningen svår att följa.

Formulär

Ledtext och instruktioner ska förmedlas maskinläsbart före det fält det hör till. Om det finns hjälptext, se till att den förmedlas på ett meningsfullt sätt i den kontexten.

Exempel

Struktur med puffar: uppläsningen av innehållet ska följa en meningsfull ordning. Till exempel kan det vara att visuellt är en bild först i ordningen. Därefter kommer en länk och sist ett stycke med beskrivning.
När innehållets struktur presenteras i två kolumner, se till att det förmedlas maskinläsbart. Säkerställ att innehållet läses konsekvent (t.ex. rad för rad) och att användaren inte får information från ”fel” kolumn mitt i.

Så testar du läsordning för webbinnehåll

Oftast, men inte alltid, presenteras innehållet i rätt ordning av exempelvis uppläsande hjälpmedel om det förekommer i rätt ordning i html-koden. Därför kan ett enkelt snabbtest vara att avaktivera stilmallar. Om ordningen är begriplig utan CSS-mallar är sannolikheten stor att webbplatsen kommer att presenteras i en logisk ordning även av hjälpmedel.

Testa även läsordningen genom att granska sidan i fönster med olika storlekar och genom att lyssna igenom innehållet med en skärmläsare.

Så testar du läsordning för appar

1. Navigera genom vyn med skärmläsare genom att använda svepgester (nästa/föregående objekt).
2. Kontrollera att ordningen är meningsfull och rubriker och ledtexter kommer före den information som den hör ihop med.
   
3. Testa i olika skärmstorlekar och orientering om appen anpassar layouten.
   
4. Om innehåll uppdateras: kontrollera att ordningen inte bryts när nya element läggs till.
   
5. Om du är osäker: använd ett inspektionsverktyg för tillgänglighet för att se i vilken ordning elementen exponeras.