April månads tips (5 månader kvar) Animationer för alla

Vi möter video och animerade budskap varje dag på webben och i våra olika sociala kanaler. Rörlig bild väcker användarens intresse och kan förmedla en känsla på ett helt annat sätt än en statisk bild eller en text. Rörlig bild kan också vara en bra väg att gå om du vill erbjuda ett alternativt sätt för användaren att ta till sig information. Vi är alla olika och föredrar att ta till oss innehåll på olika sätt.

Här följer tre tips på hur du kan inkludera fler när du jobbar med animeringar:

1 Erbjud alternativ

Återge samma information både visuellt och med ljud i din animering så når du ut till fler med ditt budskap. Personer som inte kan se behöver få det som syns men inte hörs i animeringen förklarat med ord, genom så kallad syntolkning. Syntolkningen berättar vad som händer (”dörren öppnas”) men kan även läsa upp text som är skriven på textplattor i animationen. Att få texten i animationen uppläst kan även underlätta för personer som har svårt att läsa text. Låt känslan och uttrycket som du använder visuellt återkomma även i ljud genom att välja berättarröst med omsorg och förstärka känslan med musik eller subtila ljudeffekter. Se dock till att bakgrundsljudet inte stör det talade ljudet.

Att texta animationen är nödvändig för att personer som inte kan höra ska kunna ta del av innehållet, och det kan även vara ett extra stöd för till exempel personer med svenska som andraspråk. Att texta filmen underlättar också i situationer när vi av olika anledningar inte kan ha ljud på, till exempel om vi sitter i en offentlig miljö som på ett kafé eller på en buss.

2 Ha tillräckliga kontraster

Att ha bra kontraster i animeringen hjälper inte bara personer med synnedsättning att ta del av innehållet, utan är även bra för mobil visning. Ofta surfar vi på mobilen utomhus eller i skiftande ljusförhållanden, och kan då uppleva samma svårigheter att uppfatta informationen på skärmen som om vi hade en synnedsättning. Se därför till att kontrasterna på text och viktiga grafiska element är tillräckliga. Sikta på ett kontrastvärde över 4,5:1 för text och 3.0:1 för grafik. Du kan enkelt själv kontrollera kontrasterna med olika verktyg. Ett exempel är Color Contrast Analyser från Paciello Group som är gratis att ladda ner och använda.

Colour Contrast Analyser, öppnas i nytt fönster

3 Tänk på tempot

Säkerställ att din animering har ett lagom tempo för att användaren ska hinna uppfatta och ta till sig innehållet. Om du använder text i animeringen behöver du se till att texten ligger kvar tillräckligt länge för att även personer med läs- och skrivsvårigheter och svenska som andraspråk ska hinna läsa. Om du är osäker på hur lång tid en text behöver ligga kvar kan du alltid testa med användare. Ta hjälp av en kollega eller en vän som ser filmen för första gången, hinner den läsa och förstå budskapet? Försök att korta ner animerade texter till korta, kärnfulla budskap, så underlättar det för alla!

Ge användaren möjlighet att pausa animeringen. Det är också bra om animeringen stannar av sig själv efter några sekunder. För personer med kognitiva funktionsnedsättningar kan det skapa illamående och åksjuka med rörliga objekt. Om animationerna innehåller blinkningar som är fler än tre gånger per sekund kan det trigga epileptiska anfall. Den typen av animationer är inte tillåtna enligt WCAG 2.1, även om det finns möjlighet att pausa eller stänga av dem.

Vilka framgångskriterier och krav är kopplade till animeringar?

WCAG 2.1 AA:

1.2.1
1.2.2
1.2.3
1.2.5
1.4.1
1.4.2
1.4.3
1.4.11
2.2.2
2.3.1

Bara månader kvar tills din webbplats måste vara tillgänglig!

Kontakt