Riktlinjer i kategori Prototypning
Se till att eventuella samtalsfunktioner är tillgängliga
När det finns funktioner för samtal med röst eller video ska dessa utformas på ett sätt som gör dem tillgängliga för så många som möjligt.
Utforma eventuella reglage så att alla kan använda dem
Sidan är ett utkast
Denna sida är en av flera nya webbriktlinjer som förtydligar och exemplifierar innebörden i de kriterier som går utöver WCAG i standarden EN301549, och som har relevans för DOS-lagen.
Kom gärna med synpunkter!
Exempelvis genom e-post till info@webbriktlinjer.se eller genom kommentarsfunktionen i slutet av sidan.
Denna riktlinje gäller för knappar, spakar, vred och andra reglage – både i hård- och mjukvara – avsedda för slutanvändare för att aktivera, avaktivera eller ställa in en app.
Rekommendationer för tillgängliga reglageLänk hit
- Ställ inte för höga krav på motorisk förmåga.
- Gör det möjligt att avläsa aktuell inställning utan att ändra den.
- Hjälp användaren att undvika oavsiktlig inmatning.
Ställ inte för höga krav på motorisk förmågaLänk hit
Om ett reglage kräver finmotorik såsom förmågan att nypa eller vrida, så måste det finnas alternativa sätt att utföra motsvarande interaktion för användare som saknar sådan förmåga. Alternativen kan vara exempelvis enkla knappar eller tangentbordskommandon.
Användaren ska inte heller tvingas göra flera saker samtidigt, såsom att trycka ner flera olika tangenter eller flera fingrar i kombination.
Detta krav överlappar både R160. Erbjud alternativ till komplexa fingerrörelser och ett kommande kriterium i WCAG 2.2 om drag och släpp, men gäller framförallt för appar, och har ett bredare tillämpningsområde. Till exempel berör inte dessa kriterier samtidig nedtryckning av flera tangenter.
I moderna operativsystem erbjuds alternativ till komplexa tangentkombinationer.
Gör det möjligt att avläsa aktuell inställning utan att ändra denLänk hit
Aktuell status för två- och treställiga reglage ska kunna urskiljas av alla utan att behöva ändra inställning. De måste även kunna avläsas utan syn.
Hjälp användaren att undvika oavsiktlig inmatningLänk hit
Om en tangent hålls intryckt ska det inte behöva leda till teckenrepetering förrän efter två sekunder och därefter maximalt varannan sekund. Se till att detta antingen går att justera med hjälp av inställningar eller att repetition aldrig sker snabbare än så.
Om samma tangenttryckning upprepas (snarare än hålls inne) ska den inte registreras förrän det gått minst en halv sekund, såvida inte användaren har möjlighet att justera tidsgränsen.
Detta berör exempelvis användare med ofrivilliga skakningar och nedsatt finmotorisk precision.
I allmänhet kan användaren genom inställningar för ”tangentrepetition” i operativsystemet påverka detta, men se till att eventuell programkod som lyssnar på tangenthändelser och som inte tar hänsyn till operativsystemets inställningar ändå respekterar dessa gränser. Vi tror inte att detta är vanligt förekommande i digital offentlig service, men det skulle kunna förekomma, till exempel i pedagogiska spel spel.
Relaterade riktlinjerLänk hit
Se särskilt riktlinjerna R160. Erbjud alternativ till komplexa fingerrörelser och R129. Utveckla systemet så att det går att hantera med enbart tangentbordet.
Vad säger standarder och lagar om denna riktlinje?Länk hit
Enligt DIGGs föreskrifter (§4) ska digital service som omfattas av lagen om tillgänglighet till digital offentlig service vara möjlig att uppfatta, vara hanterbar, begriplig och robust.
Eftersom dessa principer är svåra att utan vägledning tillämpa i enskilda detaljer erbjuds i §5 ett konkret sätt att uppfylla dem: Kriterierna i bilaga A i standarden EN301549 v2.1.2 (pdf). Denna webbriktlinje är ett försök att förklara och exemplifiera sju av dessa kriterier:
- 5.5.1 Manövreringsmetod
- 5.5.2 Särskiljande av manövrerbara delar
- 5.6.1 Läge avkänns taktilt eller med ljud
- 5.6.2 Visuellt läge
- 5.7 Tangentrepetition
- 5.8 Acceptans av dubbla tangentnedslag
- 5.9 Samtidiga användaraktiviteter
TerminologiLänk hit
Inställningar för ”tangentrepetition” kallas ibland för ”tangentfilter” eller ”tröga tangenter”.
Termen ”reglage” används här för det som i standarden heter ”manövrerbar del” (operable part på engelska).
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.
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.
Ge möjlighet att ångra, korrigera eller bekräfta vid viktiga transaktioner
Den som råkar göra något fel kan slippa mycket besvär om felet kan upptäckas och åtgärdas direkt.
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.
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.
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.
Använd rätt html-element när ni gör listor
En av poängerna med HTML är att språket kan användas för att märka upp semantiken i ett dokument. Märk upp listor som listor, och se till att inget annat än listor är märkta så. Skärmläsare och andra hjälpmedel behöver korrekt kodade listor för att kunna signalera till användaren att en lista faktiskt är just en lista.
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.
Använd Javascript för att öka tillgängligheten – inte tvärtom
Javascript ger ofta en god användbarhet, och kan bidra till ökad tillgänglighet och effektivitet. Men det finns användare som inte kan eller vill använda Javascript. Se därför till att det går att använda webbplatsens viktigaste funktioner även utan Javascript, och följ riktlinjer för tillgänglig Javascript.
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 för andra att återanvända webbplatsens innehåll
Gör tjänster och information på er webbplats åtkomliga för andra system, så att andra kan återanvända ert innehåll. Överväg att själva syndikera och förädla material för att skapa större nytta åt era användare.
Se till att koden validerar
Se till att er webbplats har sidmallar och stilmallar som har en god kodkvalitet och följer standarder. Det ökar chansen att alla användare kan komma åt informationen och tjänsterna på webbplatsen, oavsett vilka verktyg de använder.
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.
Följ kodstandarder
Använd standarder så långt som möjligt. Ett skäl till att webben har blivit så användbar är att den bygger på öppna standarder. Tack vare detta kan vi utveckla och använda webben med verktyg från olika leverantörer. Öppna standarder möjliggör konkurrens, underlättar innovationer och är ett skydd mot att en eller ett fåtal aktörer tar över och kontrollerar webben.
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.
Bestäm om e-tjänsten behöver e-legitimation och signering
Om era webbtjänster hanterar personlig information, kan användarna behöva identifiera sig och signera med en e-legitimation. Ta beslut om det innan ni bestämmer hur flödet genom e-tjänsten ska se ut.
Visa var i en process användaren befinner sig
Visa användarna tydligt var de befinner sig, när de tar sig igenom en process, till exempel om de håller på att göra en anmälan eller beställning i flera steg. Risken är annars att de blir osäkra och frustrerade, och i värsta fall väljer att avbryta processen.
Gör tydliga användbara knappar
Se till att knappar är lätta att förstå och använda. Namnge knapparna tydligt, och på vedertagna sätt.
Använd standardutseendet på formulärens element
Undvik att ändra utseende på formulärelement som textfält och kryssrutor, så att användarna lätt kan känna igen dem.
Optimera webbplatsen för bästa prestanda
Optimera tjänsten så att den laddar snabbt, svarar snabbt på interaktion och kräver så lite som möjligt av användarens utrustning och uppkoppling. Dålig prestanda leder till negativa användarupplevelser, hinder för användning, försämrat genomslag (till exempel genom sämre rankning i sökmotorer) och slöseri med resurser. Bra prestanda kan till exempel uppnås genom att inte överföra mer data än nödvändigt.
Planera för långsiktigt bevarande redan vid utveckling av webbplatsen
Planera redan i utvecklingsfasen för att bevara och göra informationen på webbplatsen tillgänglig över tid. Det kan innebära lägre kostnad och högre effektivitet för verksamheten.
Gör det möjligt att läsa och söka i diariet
Om din organisation har ett offentligt diarium kan ni öka er transparens genom att publicera diariet på webben. Innan ni gör diariet sökbart för användarna måste dock intresset av ökad insyn ställas mot skyddet av den personliga integriteten.
Använd funktionsbrevlådor
E-post är en vanlig och viktig kontaktväg för användare som vill kommunicera med organisationer. Skapa funktionsbrevlådor för era vanligaste kontaktvägar för att undvika problem när medarbetare slutar på arbetsplatsen eller är tillfälligt frånvarande.
Ge webbplatsen en god läsbarhet
Typsnittet och luftigheten i texten påverkar webbplatsens läsbarhet. Texten bör vara så stor att den är bekväm att läsa. Alltför liten text, stora textmassor och många olika typsnitt gör texterna svårlästa. Begränsa därför antalet typsnitt på webbplatsen och använd alltid flexibla måttenheter, till exempel em eller procent, så att det går att att påverka storleken på texten med webbläsarens inbyggda funktionalitet.
Den största delen information på en webbplats är vanligtvis textbaserad. Underlätta för alla användare genom att anpassa webbplatsen för olika hjälpmedel och ge löptext och övriga textelement god läsbarhet.
Erbjud användarna flera olika sätt att navigera
Användare har många olika strategier för att hitta på webbplatser. Erbjud därför fler sätt att navigera utöver sökfunktionen och den primära navigeringen/menyn.
Länka alla sidor till startsidan
Det går inte att förutse på vilken webbsida användarna börjar sina besök, eller när de behöver hjälp för att leta vidare. Se därför till att alla sidor på webbplatsen har länkar till sidor och funktioner som är viktiga för navigeringen.
Använd startsidan för att ge en introduktion till webbplatsen
Startsidan används ofta av besökare som inte är bekanta med webbplatsen och som inte vet så mycket om hur organisationen är uppbyggd. Den är också en naturlig plats att återvända till om användarna gått vilse i strukturen. Se startsidan som en innehållsdeklaration, där de osäkra användarna får hjälp att hitta det de söker.
Var konsekvent i navigation, struktur och utformning
Konsekvens är mycket viktigt för att användarna ska förstå hur webbplatsen fungerar. Det betyder inte att alla sidor måste se likadana ut, men liknande uppgifter ska utföras på samma sätt oavsett var på webbplatsen man befinner sig.