Gör inte identifiering beroende av bara en biometrisk egenskap

Eftersom människors kroppar är lite olika (exempelvis har inte alla fingrar) måste identifiering kunna ske med mer än igenkänning av en enda biologisk egenskap.

Gör tillgänglighetsfunktioner åtkomliga

Tänk efter och testa så att ni inte råkar göra funktioner för ökad tillgänglighet (exempelvis lyssnafunktion eller syntolkning) omöjliga att nå för målgruppen.

Se till att allt innehåll presenteras rätt oavsett skärmens riktning

Alla människor har inte möjlighet att vrida på sin skärm. Vissa måste välja ett läge (stående eller liggande) och alltid använda detta, exempelvis med skärmen fast monterad på en rullstol. Skapa därför en design så att innehåll och funktioner är tillgängliga oavsett skärmens riktning. Då kan var och en välja det läge de föredrar.

Det finns inget som hindrar att presentationen av innehållet och funktionerna skiljer sig åt mellan de båda lägena så länge innehållet är tillgängligt och funktionerna är åtkomliga och har normal funktion.

I riktlinjen finns undantag för när funktionaliteten är beroende av att användaren har skärmen i en viss riktning, till exempel ett pianoprogram där liggande läge är nödvändigt för att alla tangenterna ska få plats. Informera användaren om när en viss riktning av skärmen är nödvändigt.

Se till att hjälpmedel kan presentera meddelanden som inte är i fokus

Se till att de som använder tekniska hjälpmedel som exempelvis skärmläsare och förstoringsprogram kan göras uppmärksamma på viktiga meddelanden även om de presenteras utanför det område på sidan som användaren har i fokus.
Ange med hjälp av attributen role eller aria-live var viktiga meddelanden kan förekomma, så får hjälpmedel kännedom om dessa och kan presentera dem för användaren vid ett lämpligt tillfälle.
Berörda användare riskerar annars att missa varningar, upplysningar och felmeddelanden.

Erbjud alternativ till rörelsestyrning

Se till att funktioner som aktiveras genom att användaren till exempel skakar, vrider, rör vid eller viftar framför enheten kan stängas av. Funktionerna ska även kunna aktiveras på något annat sätt.

Detta hjälper personer som till exempel har enheten fastsatt vid en permobil eller som av någon annan anledning inte har fysisk möjlighet att utföra liknande rörelser. Det finns också användare som oavsiktligt kan aktivera den här typen av kontroller på grund av ofrivilliga skakningar (så kallad essentiell tremor) eller andra motoriska störningar.

Se till att text på knappar och kontroller överensstämmer med maskinläsbara etiketter

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.

Den som använder röststyrning säger vanligtvis det som står på en knapp för att använda knappen. Detta fungerar om det som står på knappen motsvarar den maskinläsbara texten. Upplevelsen för seende som använder skärmläsare blir också bättre om uppläst text matchar det som visas på skärmen.

Gör det möjligt att ångra klick

Den som använder pekskärm eller pekdon som exempelvis mus behöver kunna ångra sig om knappen eller trycket skedde av misstag. Erbjud därför minst en sådan möjlighet.

Möjligheten att ångra ett påbörjat klick är värdefull därför att den minskar risken för att aktivera funktioner av misstag. Vem som helst kan råka trycka vid fel plats eller tillfälle, och det är extra lätt hänt för personer med vissa funktionsnedsättningar (exempelvis begränsad motorisk kontroll eller synnedsättning).

Denna riktlinje berör dig som programmerar användargränssnitt (“front-end”) med exempelvis Javascript, men inte dig som enbart jobbar med text, bild och formgivning.

Erbjud alternativ till komplexa fingerrörelser

Alla personer kan inte hantera komplexa rörelser på en pekskärm, så kallade fingergester. Detta gäller till exempel att svajpa (swipe) och gester som kräver flera fingrar (multi-touch) såsom dra isär och nyp ihop. Det kan bero på motoriska eller kognitiva begränsningar, vilket hjälpmedel en användare har eller användarens brist på kunskap om gränssnittet. Komplettera därför alltid sådana med enklare interaktion såsom klick, dubbelklick eller tryck, såvida inte rörelsen är avgörande för funktionaliteten.

Observera att riktlinjen bara gäller webbplatsens eller appens gränssnitt. Det gäller inte operativsystemets eller webbläsarens funktioner, såsom horisontell svepning för att navigera i sidhistoriken.

Riktlinjen undantar funktionalitet som naturligt kräver mer komplexa rörelser, till exempel att skriva sin signatur.

Popup-funktioner ska kunna hanteras och stängas av alla

Innehåll, till exempel popup-rutor, som dyker upp vid tangentbordsfokus eller när användaren för muspekaren (hovrar) över ett visst objekt ska kunna uppfattas och hanteras av alla – även av användare som har förstorat sidan eller tar längre tid på sig att komma till innehållet. Det är särskilt viktigt att innehållet enkelt kan tas bort eller stängas.

Det kan till exempel gälla undermenyer, inforutor (tooltips) och icke-modala popup-fönster.

Tyvärr skapar sådant innehåll annars ofta tillgänglighetsproblem, till exempel för att:

• användaren inte har aktiverat funktionen med avsikt,
• användaren inte blir medveten om att det har dykt upp nytt innehåll eller
• det nya innehållet stör användarens förmåga att genomföra en uppgift.

Se till att det går att öka avstånd mellan tecken, rader, stycken och ord

Många användare, till exempel dyslektiker och personer med nedsatt syn, behöver kunna påverka avståndet mellan stycken, rader, ord och tecken för att lättare kunna läsa. Gör det därför möjligt för användaren att påverka avstånden utan att innehåll eller funktionalitet krockar eller gömmer sig bakom annat innehåll.

Denna riktlinje är närliggande riktlinjen Se till att text går att förstora utan problem (R127) men gäller alltså mellanrummen och inte själva tecknen.

Användaren ska ha möjlighet att öka avstånd åtminstone upp till följande relativa gränsvärden:

• Radavstånd ska kunna ökas minst 1,5 gånger teckensnittets storlek.
• Teckenavstånd ska kunna ökas minst 0,12 gånger teckensnittets storlek.
• Avståndet mellan ord ska kunna ökas minst 0,16 gånger teckensnittets storlek.
• Avståndet mellan stycken ska kunna ökas minst 2 gånger teckensnittets storlek.

Förstoring av mellanrum kan ske på olika sätt. Till exempel med hjälp av en bookmarklet som ökar avstånden, med ett förstoringshjälpmedel eller genom att ställa in webbläsaren att tillämpa användarens egen css-kod.

Riktlinjen gäller inte för öppna undertexter i video och inte heller för text som förekommer i bilder (vilket i och för sig ofta bör undvikas, se Använd text, inte bilder, för att visa text (R128)). För närvarande är även PDF undantaget.

Använd tillräckliga kontraster i komponenter och grafik

Personer med nedsatt syn har ofta svårt att urskilja visuella kontraster mellan exempelvis en symbol och dess bakgrund, och riskerar därför att missa information. Designa därför webbplatsen så att komponenter i gränssnittet och informationsbärande grafik har tillräckliga kontraster. Som komponenter räknas till exempel knappar och formulärfält. Som grafiska objekt räknas exempelvis ikoner och betydelsefulla delar av illustrationer och diagram (till exempel kurvor och pilar).

Denna riktlinje liknar Använd tillräcklig kontrast mellan text och bakgrund (R126) (som motsvarar WCAG-kriteriet 1.4.3). Men nu gäller alltså motsvarande krav även för innehåll som inte är text.

Gör en logisk tab-ordning

Testa tab-ordningen genom att granska en sida av varje sidtyp utan hjälp av tryckkänslig skärm, mus eller annat pekdon.

Ge användarna möjlighet att justera tidsbegränsningar

Användare behöver ibland möjlighet att justera tidsbegränsningar som finns inbyggda i systemet, till exempel i en beställningsfunktion. Ge dem det!

Utför inga oväntade förändringar vid fokusering

Utför ändringar när användaren har anledning att förvänta sig dem.

Utför inga oväntade förändringar vid inmatning

Utför ändringar när användaren har anledning att förvänta sig dem.

Ge användaren möjlighet att pausa, stänga av eller sänka ljud

Det ska alltid vara möjligt att pausa, stoppa eller sänka sådant ljud som spelas upp automatiskt.

Markera tydligt vilket fält eller element som är i fokus

Den som navigerar med t.ex. tab-tangenten behöver få veta var fokus ligger. Standardmarkeringen är ofta en tunn linje som är svår att se.
Gör markeringen tydlig, till exempel med en CSS-regel.

Använd tillräcklig kontrast mellan text och bakgrund

Bra kontrast mellan text och bakgrund är viktigt för läsbarheten, särskilt för personer med nedsatt synförmåga.

Texta inspelad rörlig media (video, ljud, animationer…)

Inspelad digital video ska ha undertexter (kallas även textbeskrivningar eller textremsa) och för ljudinspelningar (till exempel podcasts) med mera ska en textversion erbjudas.

Använd webbvideo för att öka tillgängligheten

Använd gärna video som komplement eller alternativ till andra presentationsformat. Texta och syntolka filmerna så kan fler ta del av innehållet.

Ge ordförslag vid sökning och inmatning

Underlätta för användarna genom att ge dem förslag på sökord när de utför en sökning på en webbplats. Funktionen ger bättre sökträffar, underlättar för vissa personer med skrivsvårigheter samt kan spara tid och förenkla för alla användare.

Anpassa webbplatsen även för små skärmar

Allt fler använder mobilen eller andra enheter med små skärmar för att besöka webbplatser och använda tjänster och program. Anpassa därför information, funktioner och gränssnitt för alla typer av skärmar.

Skapa kortkommandon med varsamhet

Kortkommandon kan göra att det går snabbare att navigera på webbplatsen, men de bör användas med försiktighet.

Det finns en risk att webbplatsens kortkommandon förväxlas med kortkommandon som användarens webbläsare, operativsystem eller hjälpmedel erbjuder. Kortkommandon som bara består av ett tecken kan dessutom orsaka problem för personer som använder röststyrning eller råkar klicka på fel tangent, exempelvis på grund av skakningar i händerna.

Riktlinjen påverkar inte funktioner såsom listboxar och rullgardinsmenyer där användare kan göra sitt val genom att en eller flera tangenter trycks ned, eftersom detta bara går att göra när komponenten är i fokus.

Erbjud möjlighet att hoppa förbi återkommande innehåll

Bygg in genvägar i strukturen. Det kan ta lång tid att ta sig till olika delar av ett dokument när man navigerar med tangentbord, eftersom man normalt måste stega sig förbi varje länk. Webbplatser som har ett omfattande och komplext menysystem med många länkar kan försvåra avsevärt för många användare.

Utforma webbadresser med omsorg

Se till att era webbadresser kommer att vara tydliga och fungera bra, även på papper. Webbadresser behöver vara enkla att uppfatta. De kan behöva användas till exempel från utskrivna e-brev eller tryckta material, eller läsas upp i etermedier. Det finns risk att användarna uppfattar dem fel. Utforma därför webbadresserna med omsorg.

Ange om ett dokument är en del av ett större dokument

Om ett dokument är en del av ett större dokument, eller är nära relaterat till andra material, länka dit och använd relevanta attribut som beskriver relationen. Till exempel kan varje kapitel av en rapport ligga på varsin sida, med länkar sinsemellan, som har attributen ”prev” och ”next” . Det finns också särskilda attibut för tillhörande ordlistor, upphovsrättsinformation med mera. De underlättar för användare och sökmotorer att förstå att, och hur, dokument hör ihop.

Stryk aldrig under text som inte är länkad

När text är understruken signalerar det till användarna att den är klickbar.

Markera obligatoriska fält i formulär

Informera användaren om vilka fält i ett formulär som är obligatoriska, för att minska risken att onödig tid läggs på rättning av felaktigt eller ofullständigt ifyllda formulär.

Se till att bakåtknappen fungerar

Webbläsarens funktion för att backa är en av de mest använda funktionerna för att navigera på webben, både inom en webbplats och mellan webbplatser. Se därför till att den fungerar.

Utnyttja webbläsarnas inbyggda funktioner för utskrift

Använd en stilmall för att låta användarna skriva ut från webbplatsen. Då kan de förhandsgranska utskrifter via webbläsarens inbyggda funktion och kontrollera hur tabeller, text och andra sidelement ska sidbryts. För beräkningar, kvittenser, mottagningsbevis och liknande kan det dock vara motiverat att erbjuda särskilda utskriftsversioner.

Gör webbadresser bokmärkningsbara

Se till att användare som gör bokmärken till sidor kommer tillbaka till rätt sida i framtiden.

Använd inte ramar

Använd i första hand serverbaserade tekniker för att infoga innehåll i sidor. Använd inte ramar (frames) för att utforma webbplatsen. Det orsakar nämligen en rad problem med användbarhet och tillgänglighet.

Skapa en flexibel layout som fungerar vid förstoring eller liten skärm

Skapa en layout som fungerar på en 320 pixlar bred skärm utan att information eller funktionalitet går förlorad, utan scrollning i mer än en riktning. I praktiken innebär det responsiv design och att att riktigt långa ord behöver avstavas. Att behöva scrolla i sidled är besvärligt och försämrar upplevelsen. Många använder små skärmar och personer som på grund av nedsatt syn förstorar innehållet har liknande behov.

Gör det möjligt att prenumerera på information

Gör det möjligt att prenumerera på information från er webbplats. Då kan användarna enkelt hålla sig underrättade om vad som händer inom ert område.

Basera inte viktig funktionalitet på format som kräver insticksprogram

Flash, Quicktime och liknande ger ofta problem för de som använder hjälpmedel, eller som inte använder mus, även när webbläsaren har ett insticksprogram för att hantera dem. Låt därför ert viktigaste innehåll vara användbart även utan insticksprogram.

Använd inte tabeller för layout

Formge inte er webbplats med hjälp av tabeller. Det finns nämligen en risk att användare som använder läshjälpmedel får informationen i tabellerna i fel ordning eller inte alls, beroende på hur komplexa tabellstrukturer som används. Även om tabellstrukturen fungerar så kommer vissa hjälpmedel att läsa upp information om tabellerna, vilket gör det svårare för användarna att förstå innehållet.

Ge tydlig återkoppling i e-tjänster

Ge tydlig återkoppling till användarna i ärenden som utförs via webben och e-tjänster. Vanliga automatiserade funktioner för kommunikation är meddelande, granskning, kvittens och mottagningsbevis.

Integrera externa tjänster så att de smälter in

Tjänster som utvecklas och driftas externt blir allt vanligare. Även tjänster som utvecklas internt utvecklas ofta i separata system, och är skilda från webbplatsen. Sträva efter att integrera dem på webbplatsen så pass mycket att användaren inte upplever att de är fristående och så att de inte ser märkbart annorlunda ut. De ska smälta in i det grafiska formspråket och inte ha andra interaktionsmönster än webbplatsen i övrigt. På så vis förbättrar ni användarupplevelsen och tillgängligheten på webbplatsen.

Var tydlig med förutsättningar för att kunna använda e-tjänsten

Användarna ska inte behöva avbryta en process för att de inte har förberett information som krävs för att slutföra processen. Var tydlig med vilken information som tjänsten kommer att begära.

Kräv inte säkrare inloggning än vad informationen kräver

När ni väljer om en e-tjänst ska ha stöd för identifiering eller signering ska ni ta hänsyn till vilken information det gäller. Ha inte en för hög säkerhetsnivå. Det blir onödigt krångligt för användarna. Ha givetvis heller inte en för låg säkerhet som kan få negativa konsekvenser för användarna.