Hvor mange i Danmark har en funktionsnedsættelse?

Global Accessibility Awareness Day er den 17. maj

I Danmark fører vi ikke registre over personer med funktionsnedsættelser, så tallene her stammer fra undersøgelser og interesseorganisationer.

  • Flere end 2/3 over 18 år bruger synshjælpemidler,
  • 700.000 har gigt,
  • 600.000 har tinnitus,
  • 400.000 har læsevanskeligheder,
  • 320.000 har diabetes
  • 300.000+ er erkendte ordblinde,
  • 250.000 har et bevægelseshandicap,
  • 120.000 har hjerneskade,
  • 80.000+ har demens,
  • 55.000 har epilepsi,
  • 50.000 er synshandicappede,
  • 25.000 er blinde,
  • 4.000 er døve.

Listen repræsenterer jo bare et meget lille udsnit af alle de forskellige typer funktionsnedsættelser, som i princippet kan ramme alle og enhver.

Du kan bruge den internationale tilgængelighedsdag, i dag den 17. maj, på at reflektere over, hvad de forskellige typer funktionsnedsættelser betyder i forhold til at anvende digitalt indhold. (Tip: De har allesammen indflydelse!)

Vil I gerne i gang med at gøre jeres indhold tilgængeligt for så mange som muligt, så start med min omfattende side med ressourcer og værktøjer om tilgængelighed.

Vil du vide, hvorfor jeg bruger begrebet ‘funktionsnedsættelse’ og ikke ‘handicap’? Så læs min artikel om handicaps og funktionsnedsættelser: “Hvad er et handicap?”.

Lær tilgængelighed på nettet
Netvenlig laver kurser og workshops om digital tilgængelighed for alle, der arbejder med indhold til nettet. Læs om jeres muligheder, eller kontakt mig på telefon 40 93 21 98 / lmsoren@netvenlig.dk

Tilgængelighed på nettet: De bedste ressourcer at komme i gang på

Tilgængelighed kan været et overvældende emne at tage hul på. Men er I et offentligt organ, så er det nu, I skal komme i gang. 23. september 2018 vedtager Folketinget den nye tilgængelighedslov og indhold produceret efter den dato, skal som udgangspunkt overholde WCAG 2.0, niveau AA.

Her er min liste over de bedste ressourcer og værktøjer til at komme op i hastighed med. Står I foran et større projekt, er det måske en ide at kontakte mig og høre om mulighederne for jeres eget tilgængelighedskursus eller workshop, frem for at lære det på den hårde måde.

WCAG 2.0-standarden og støttedokumenter

Værktøjer til bedre tilgængelighed

The A11y project
Et brugerdrevet community, der har fokus på tilgængelighed. Masser af “How to”-artikler og muligheder for praktisk læring.

Web Accessibility Initiative (WAI)
WAI er et W3C-projekt og der er virkelig, virkelig mange ressourcer på sitet. Faktisk vil jeg sige, det er en lille smule overvældende at finde rundt i. Men du kan for eksempel prøve om Easy Checks er noget for jer. Eller måske der det store WCAG-EM Report Tool?

Microsoft: Inclusive Design
Omfattende ressource med håndbog, aktiviteter til workshops og videoer (synstolkede – WCAG 1.2.5), produceret med henblik på at skabe empati blandt designere, projektfolk og udviklere. Absolut anbefalet! Grafikken til denne artikel er taget fra dette værktøj.

IBM Accessibility Handbook
Håndbogen gennemgår på 32 sider principperne for tilgængelighed i IBMs produkter.

Principperne spiller godt sammen med WCAG 2.0.

Indeholder forskellige designaktiviteter, som har til formål at hjælpe designere og udviklere forstå, hvad det vil sige at være ramt af et handicap.

Contrast Ratio: Easily Calculate Color Contrast Ratio
Hurtig og overskuelig side at beregne kontrastforhold mellem to farver.

Colour Contrast Analyser
Godt værktøj til at analysere tekstfarver og -størrelser for tilgængelighedsproblemer.

Programmet kan vise, hvordan websider fremstår for farveblinde og svagtseende.

Kan afvikles på computer og fra en USB-stick. Gratis og kan downloades til Windows og Mac.

Color Safe: Accessible Web Color Combinations
Især god til tekstfarver på hvid baggrund. Giver en palette med farver, der opfylder WCAG AA og AAA.

NVDA Screen Reader
Skærmlæser til blinde og svagtseende. Gratis og fungerer fint, men som meget andet software har den ikke dansk tale som standard. Installer den på en maskine eller en brugerkonto, du ikke skal bruge, da den overtager alle funktioner, også i styresystemet.

Chris Pedericks Web Developer:
Med denne udvidelse kan du slå stylesheets fra, skjule billeder, analysere alt-tekster og meget, meget mere. Et virkelig godt værktøj i kassen!

WAVE Evaluation Tool: Dette tilgængelighedsplugin er udviklet af WebAIM, en førende non-profit-organisation, der også står bag WCAG Checklist, som du kan downloade længere oppe.

Artikler om tilgængelighed

SI Digital: Designing for Colour Blindness
Hurtige tips til at sikre, at indholdet kan ses af farveblinde

Jon Yablonski: Design Principles for Reducing Cognitive Load
Alle har prøvet at være kognitivt belastet. Det er ikke rart. Og endnu mindre, hvis det er en permanent tilstand. Læs om, hvordan man undgår at stresse sine læsere.

GOV.UK: How to create content that works well with screen readers
Sådan fungerer en skærmlæser, og gode råd om at skrive til blinde og svagtseende.

Lars Michael Sørensen: Hvad er et handicap?
Handicapbegrebet forklaret. En artikel fra Netvenlig.

Lars Michael Sørensen: Tilgængelighed – principper og retningslinjer
En oversigt over WCAG 2.0 og de vigtigste principper for hver retningslinje. Del den med dine kolleger og gør dem klogere på, hvad tilgængelighed er.

Lars Michael Sørensen: Hvor mange i Danmark har en funktionsnedsættelse?
Liste. Flere end 2/3 af alle over 18 år bruger synshjælpemidler som læsebriller, kontaktlinser eller forstørrelsesglas. Hver 10. dansker har Tinnitus.

Blogs og nyhedsbreve

GOV.UK Accessibility Blog
Det engelske svar på Digitaliseringsstyrelsen. Deres blogs om User Experience og tilgængelighed er absolut værd at følge!

Ability.net
Britisk interesseorganisation, med formål at gøre det lettere for handicappede og ældre at bruge nettet på arbejdet og i hjemmet. Udgiver artikler af ganske høj kvalitet.

Bøger om tilgængelighed

Jeg linker ofte til Amazon.co.uk, fordi det er nemt. I flere tilfælde vil Saxo.com nemt kunne matche prisen, så se dig for, før du køber. Og nej, jeg får ikke avance for at linke 🙂

Jeff Johnson: Designing User Interfaces for an Aging Population
Min personlige favoritbog om tilgængelighed. Fordi bogen sigter mod at gøre indhold lettere for ældre mennesker, kommer den automatisk til at inkludere alle i spektret, uden at fokusere specielt meget på andet end de ‘naturlige’ funktionsnedsættelser som rammer de fleste, fra de passerer 55+.

Sarah Horton, Whitney Quesenbery: A Web for Everyone
Omfattende og velskrevet bog. Tager delvist udgangspunkt i et antal modelbrugere (personas) med funktionsnedsættelser. Er tydeligvis skrevet med WCAG 2.0 i tankerne, men refererer ikke som sådan til standarden før i appendix’et. Kan læses hurtigt, hvis du allerede er fortrolig med usability og user experience. Bogen har sin egen podcast

Laura Kalbag: Accessibility for Everyone
Har du gået på mit kursus i tilgængelighed, har du nok allerede have læst bogen. En kort og hurtigt læst introduktion til tilgængelighed. Er nem at læse flere gange og god at have i nærheden. Vil især være god at dele med kolleger og chefer, som har brug for at komme hurtigt i gang med emnet, uden at få for mange detaljer i hovedet.

Geri Coady: Color Accessibility Workflows
En fin og hurtig introduktion til at arbejde med farver og tilgængelighed. Især for udviklere og grafiske designere, men også for andre som behøver vide noget om tilgængelighed generelt.

Lær tilgængelighed på nettet
Netvenlig laver kurser og workshops om digital tilgængelighed for alle, der arbejder med indhold til nettet. Læs om jeres muligheder, eller kontakt mig på telefon 40 93 21 98 / lmsoren@netvenlig.dk

Mobile websider: Danske sider er blandt de langsommeste

Resume: Danske mobilsider ligger i bund, når det gælder indlæsningstider. Det er ikke godt, i en tid hvor tålmodigheden er mindre end nogensinde. I kan selv gøre noget for at optimere hastigheden. (opdateret 4. december 2017 med en ekstra graf)

3 sekunder. Så lang tid har I til at få noget på skærmen, når kunder eller brugere går på mobilen for at løse en opgave. Går der længere tid, så forlader de jer med stor sandsynlighed igen.

Det er de barske tal. Hvordan er virkeligheden så? Nedslående.

Danske mobilsider har faktisk nogle af de langsommeste indlæsningstider i Europa, viser en analyse fra Google.

En oversigt over indlæsningtider i Europa. Danske mobilsider er i gennemsnit 9,5 sekunder om at læse ind.
Danmark har nogle af de langsommeste mobilsider i Europa, viser en analyse fra Google.

Langsomme mobilsider frastøder folk

Når indlæsningstiden overstiger 3 sekunder, er der 53 procent sandsynlighed for, at en bruger forlader sitet.

5 sekunder og sandsynligheden stiger til 90 procent. You do the math.

Konverteringsraten stiger, når indlæsningstiden holder sig under 3 sekunder. Derefter falder den drastisk i takt med, at folk opgiver at vente på, at sitet skal læse ind.
Indlæsningstiden har stor betydning for hvor længe besøgende holder ud at vente på jer. Allerede ved 3 sekunder er konverteringsraten for nedadgående. Det betyder færre kunder i butikken, færre læsere eller flere opkald til supportlinjen. Grafik: LukeW.com

Og læg så oven i, at vi i stigende grad anvender mobilen til at gå på nettet med. Både derhjemme, på arbejde og i forretningerne. Så har vi en seriøs udfordring.

Optimer jeres indhold til mobil, teknisk og indholdsmæssigt

Hvis indlæsningstiden skal ned kræver det sandsynligvis en tur til teknikeren, da en del af processen vil involvere optimering af html, css og javascript-filer.

En overhaling af htmlkoden er som regel aldrig forkert. Mange hjemmesider er bygget efter forældede metoder med unødig meget kode. Det skal væk.

Hvis teknikerne pludselig begynder at snakke om at “gzippe”, “minificere” og “sprites”, så skal I ikke gå i panik. Det betyder nok bare, at de ved, hvad de taler om

I vil også gerne høre dem tale om Progressive Web Apps (PWA) og Accelerated Mobile Pages (AMP), men få det lige forklaret ordentligt.

Komprimer billeder og illustrationer

Der er heldigvis rigtig meget, I selv kan gøre for at komme i gang.

Komprimer jeres billeder så meget, det er muligt. Der er forskel på at downloade 700 kb eller 140 kb, især på en langsom forbindelse.

Derfor må I at vælge det mest optimale billedformat.

Om det skal være JPEG, GIF eller PNG afhænger af flere ting. GIF bruger I udelukkende til grafik og lignende, men om et foto er mest optimalt i JPG eller PNG er ikke altid til at gennemskue på overfladen.

Content Delivery Network (CDN): Send indholdet fra en server tæt på

Hvis jeres website er hostet i udlandet, eller I henvender jer til et internationalt publikum, så få et Content Delivery Network – CDN.

Et CDN kopierer webindhold ud til flere webservere, spredt over hele internettet. Når en webside kaldes, får brugeren altid den version, som er tættest på, hvor man er. Det vil nedsætte indlæsningstiden væsentligt, især hvis I har indhold, som fylder meget.

Der findes masser af udbydere og prisen er som regel ganske rimelig.

Bruger I WordPress, er det oplagt at undersøge WordPress.com’s gratis CDN, som man forbinder til gennem Jetpack.

Brug html fremfor alt

Nettet er hypertekst. Det fungerer mest effektivt når indholdet er i html. Undgå så vidt det overhovedet er muligt at lægge jeres indhold ud som PDF.

PDF er dårligt på så mange måder, men især på mobil, fordi et PDF-dokument som regel er optimeret til print og ikke til små skærme.

Så lad være med at falde for fristelsen, brug html.

Skriv til nettet – og til små skærme

Optimer jeres indhold til modtagerne. Har I mange mobile brugere, så skal I naturligvis skrive, så det kan læses på små skærme. Overhold de grundlæggende regler for godt netindhold: Skriv kort, skriv skanbart og undgå unødigheder.

Jeg kan lære jer at skrive til nettet.

Test din egen mobilhastighed

Google har et fint værktøj til at undersøge jeres indlæsningshastighed.

Du indtaster din webadresse og får en grafik som nedenstående. Men er du som de fleste, når pilen altså op i det røde område.

Netvenlig.dk kan læses ind på 3 sekunder
Indlæsningstiden for Netvenlig.dk er 3 sekunder. Det er væsentligt lavere end andre sider i it- og teleindustrien og resten af Danmark. Artikler på Netvenlig.dk indlæses via Google AMP-projekt og kan ses næsten øjeblikkeligt, når de søges i Google.

Webdesign: Anvendeligt slår pænt

Skal vi vælge mellem et webdesign, der er “let at finde rundt i” eller “smukt”, så er valget let (ahem!).

En undersøgelse fra CRM-tjenesten Hubspot viser, at 3 ud af 4 adspurgte foretrækker nem adgang til det, de kommer efter. Kun 10 procent prioriterer “et smukt udtryk” og lidt færre vil hellere have “en topmoderne, interaktiv oplevelse”.

Tre ud af fire forbrugere vil hellere have et webdesign, der er let at finde rundt i, end et lækkert og moderne webdesign. Kilde: Hubspot
“Websitet skal gøre det let for mig at finde det, jeg leder efter” siger tre ud af fire forbrugere. Kun hver 5. vil hellere have et smukt og moderne webdesign.

Heldigvis, er det sjældent at vi står over for det valg, og forhåbentlig bliver det aldrig nødvendigt med et ‘enten eller’. Godt webdesign er nemlig en vigtig faktor, når det gælder om at orientere sig på et website.

Tallene giver dog god mening. Funktionalitet har altid slået glimmer på nettet. Også dengang, et godt webdesign inkluderede midst 1 roterende logo og lignende.

Vi går ikke på nettet for at “opleve” og se på lækkert design eller nye måder at lave navigation på.

Vi går på nettet for at få noget gjort: Få svar på et spørgsmål, løse et problem, holde 5 minutters pause eller lære noget nyt.

At finde ud af hvordan et website hænger sammen, er noget af det vi har mindst lyst til at bruge vores tid på.

Vi vil bare løse det vi kommer for, og bagefter vil vi gerne videre med vores liv.

Du har for eksempel fået opfyldt dit informationsbehov nu. Om lidt finder du på noget andet at lave.

Hvis I forsvandt i morgen, hvem ville så savne jer?

Her er lidt at tænke over:

60 procent af alt indhold der produceres har ingen tydelig værdi for modtagerne.

Problemet har været kendt i årevis. Alle mine kursister og studerende er blevet tudet ørerne fulde med det her. Men her ser vi så resultatet dokumenteret, sort rødt på hvidt.

Ingen ville bekymre sig over det, hvis tre fjerdedele af virksomhederne verden over, forsvandt i morgen. Vi savner virksomheder og organisationer, der er vedkommende og enagerende og vi savner især relevant indhold med høj kvalitet. Kilde: Havas Group.

Det er en af mange årsager til, at vi ikke læser særlig meget på nettet: Vi starter med en forventning om, at det her møde nok ikke kommer til at gå særlig godt, allerede inden vi har taget det første skridt. Derfor vil vi også gerne have det overstået hurtigt, så vi kan komme videre.

Forbrugere leder efter engagement og vedkommende indhold. Virksomheder og brands, som kan gøre en positiv forskel i vores liv. Og hvad får vi? Marketing og hype.

Ikke underligt, at de færreste ville savne jer, hvis I forsvandt i morgen.

Her er tre spørgsmål, I kan stille jer selv:

  • Hvor godt kender I egentlig jeres kunder/læsere/modtagere?
  • Hvor meget arbejdstid bruger I på at skabe indhold uden værdi?
  • Hvis I fik al den tid til overs, hvad ville I så bruge den til i stedet?

Undersøgelsen er foretaget af Havas Group blandt 300.000 mennesker i 33 lande.

Dårlig streaming på mobilen stresser

Vi bruger mobil til stort set hvad som helst, nu om dage. Men især video er vi rigtig glade for at streame ned. Så når forbindelsen ind i mellem ryger en tur, så bliver vi stressede. Rigtig stressede.

En undersøgelse fra Ericsson ConsumerLab i 2015 viser, at det faktisk kan være mere beroligende at se en skrækfilm, end at opleve et stop i en Youtube-video.

Billedteksten læser: The level of stress caused by mobile delays was comparable to watching a horro movie
“Kognitiv belastning” er betegnelsen for mængden af information, vi kan håndtere i visse dele af hjernen. Når den kognitive belastning overstiger 0,7 anses det for meget højt og stressende. Kilde: Ericsson ConsumberLab, 2015

Blot 2 sekunders ventetid på en Youtube-video kan øge den kognitive belastning målbart, mens en ufrivillig pause når videoen er gået i gang, vil næsten fordoble stressniveauet, viser undersøgelsen.

Undersøgelsen blev i øvrigt foretaget i København, og omfattede smartphonebrugere mellem 18 -52 år.

Kilde: Ericsson Mobility Report “The Stress of Streaming Delays”, 2016 (Ikke tilgængelig på nettet)

Hvad er et handicap?

Resume: Begrebet ‘handicap’ dækker over en kombination af nedsat funktionsevne og samfundsskabte barrierer. Tilgængeligt design kan nedsætte barriererne og give alle lige mulighed for at være sig selv. [Opdateret]

Definitionen af et handicap

I gamle dage talte man om at være “født med et handicap”. Blev man født døv var man så at sige dømt til at være handicappet hele livet. Man var “invalid” – som i øvrigt betyder “ugyldig”. Det var et stempel, som rask væk blev svinget over alle, der ikke var normale som flertallet.

I dag tager man udgangspunkt i mennesket og i konkrete situationer:

  • Når en blind skal krydse en vej vil hun nogle gange have brug for hjælp fra mennesker eller teknologi. I den konkrete situation er hun derfor “handicappet”.
  • Når hun senere sidder og taler med en veninde, så er de på lige vilkår, og derfor er der ikke noget handicap.

Den internationale definition af begrebet ‘handicap’ tager udgangspunkt i FNs konvention om rettigheder for personer med handicap, også kaldet Handicapkonventionen.

I Handicapkonvention er ‘personer med handicap’ defineret som:

… personer, der har en langvarig fysisk, psykisk, intellektuel eller sensorisk funktionsnedsættelse, som i samspil med forskellige barrierer kan hindre dem i fuldt og effektivt at deltage i samfundslivet på lige fod med andre.

Konventionen har blandt andet affødt EU-direktivet om tilgængelighed, som blev vedtaget i slutningen af 2016. Direktivet ventes at blive omsat til dansk lov i efteråret 2018.

Handicapkonventionens definition kan omskrives til en simpel formel:

Handicap = funktionsnedsættelse + samfundsskabt barriere

Funktionsnedsættelser og samfundsskabte barrierer

Med andre ord, er en person med en funktionsnedsættelse altså ikke som udgangspunkt ‘handicappet’ 24 timer i døgnet. Når personen er ligestillet med ‘normale’ mennesker, så er hun ikke handicappet. En blind er for eksempel udmærket i stand til at føre en normal samtale med en seende.

Konflikten opstår, når den blinde skal overkomme en forhindring, som for eksempel at finde den rigtige vare fra en hylde i supermarkedet, læse et vejskilt eller anvende et dårligt designet website.

Samfundsskabte barrierer er altså menneskeskabte forhold, der påvirker nogles muligheder for at kunne udfolde sig uafhængigt af andre.

Det er med andre ord forhold, vi har mulighed for at gøre noget ved. Sænker vi barriererne, fjerner vi handicappet, fordi alle kan deltage på lige fod.

Fire grupper og tre grader af handicaps

Handicaps fordeler sig især i fire hovedgrupper:

  • Fysisk: Alle bevægelseshæmmede
  • Psykisk: Stress, depression, demens
  • Intellektuel: Hjerneskade, ordblindhed
  • Sensorisk: Syn, hørelse, følesans

Funktionsnedsættelser inddeles i 3 grader:

Grad Eksempel
Permanent Kronisk sygdom, Blindhed, amputation, lammelse, gigt
Midlertidig Øjenopereret, brækket arm, hjernerystelse
Situationel Blændet af solen, bære en tung kuffert i den ene hånd

Hver 2. dansker har en funktionsnedsættelse

Før eller senere rammes stort set alle af funktionsnedsættelser i kroppen eller intellektet. Det er en uundgåelig del af livet at blive gammel og slidt.

I Danmark fører vi ikke centrale registre om handicappede, men tallene nedenfor stammer fra forskellige interesseorganisationer og giver godt indblik i, hvor mange mennesker, der er ramt af forskellige funktionsnedsættelser:

  • Hver 2. dansker bruger synshjælpemiddel,
  • 700.000 har gigt,
  • 400.000 har læsevanskeligheder,
  • 300.000+ er erkendte ordblinde,
  • 250.000 har et bevægelseshandicap,
  • 120.000 har hjerneskade,
  • 80.000+ har demens,
  • 55.000 har epilepsi,
  • 50.000 er synshandicappede,
  • heraf 25.000 blinde,
  • 4.000 er døve.

Tilgængeligt design kan nedsætte barrieren

Når vi arbejder med tilgængelighed på nettet, arbejder vi altså på at give alle adgang til så meget indhold, som muligt.

Vi fokuserer på at jævne gnidningspunkterne ud, så blinde kan anvende tekstbaseret indhold, døve kan forstå hvad der siges i en video eller vi nedsætter antallet af klik for at gøre det mindre besværligt for bevægelseshæmmede.

Som en bonus gør vi det ikke bare lettere for personer i en ‘ekstrem’ ende af spektret at anvende vores indhold. Vi hjælper også personer i den lette ende: Personer med læsebesvær, personer som ikke kan tænde for lyden, fordi de sidder i stillekupe og vi gør det lynhurtigt for rutinerede brugere at gennemføre en opgave uden brug af mus.

 Kursus: Tilgængelighed på nettet – forstå WCAG 2.0. Tilmeld dig nu! 

Bonus: ‘Handicap’ er et skældsord i udlandet

Et slidt handicapsymbol med hvid kørestol på blå baggrund, malet på jorden
Det internationale handicapsymbol blev designet af danske Susanne Koefoed i 1968. Foto: Frank Farm, flickr.com (CC-BY)

Mens ‘handicap’ og ‘handicappet’ er normalt anvendte og neutrale begreber på dansk, så er ordene noget mere kontroversielle i udlandet.

Nogle mener, at ordet ‘handicap’ kommer af ‘cap in hand’, altså en person, som tigger. Den forklaring er der stillet spørgsmålstegn ved, og oprindelsen er nok nærmere et gammelt engelsk spil fra 1500-tallet.

Det ændrer ikke på, at i engelsktalende lande giver ordet meget negative associationer, og det er bedst at undlade at bruge det på engelsk.

Brug i stedet: ‘disabled’ eller ‘disability’.

Kursus: Lær tilgængelighed og giv alle lige adgang til nettet

Offentlige institutioner har siden 2008 været forpligtet til at sikre alle borgere lige adgang til informationer og muligheder. Alligevel er det langt fra alle, der har gjort noget ved det endnu.

23. september vedtager Folketinget den ny tilgængelighedslov. Efter den dato skal alt indhold på offentlige websteder overholde WCAG 2.0, niveau AA. Der er med andre ord ikke meget tid at løbe på, hvis I ikke allerede er i gang.

Netvenlig holder kursus i tilgængelighed på nettet. Kurset afvikles på Teknologisk Institut i Høje Taastrup og Aarhus. Lær principper og metoder til at forbedre tilgængeligheden på jeres webindhold.

 Kursus: Tilgængelighed på nettet – forstå WCAG 2.0. Tilmeld dig nu! 

Hvad er tilgængelighed på nettet: 4 principper, mange anbefalinger

Resume: Tilgængelighed handler om at give alle mulighed for at deltage i samfundet på lige vilkår. WCAG 2.0 er en international standard til at øge tilgængeligheden på nettet. [Opdateret]

Introduktion: Tilgængelighed og WCAG 2.0

Begrebet “Tilgængelighed” handler om at gøre indhold findbart og anvendeligt for alle, men især for handicappede, altså personer med nedsatte fysiske, kognitive, sproglige eller motoriske evner.

Erfaringen viser, at øget tilgængelighed kommer alle til gode, uanset alder og evner. Det er altid en god investering at arbejde for at gøre sit indhold bedre og lettere at forbruge.

Web Content Accesibility Guide, WCAG 2.0, er den tilgængelighedsstandard som danske organisationer og virksomheder arbejder ud fra. Det er også den standard, som Digitaliseringsstyrelsen anbefaler for offentlige websteder.

3 niveauer med forskellig sværhedsgrad

Standarden er inddelt i 3 niveauer (A, AA og AAA), hvor niveau A er det niveau, der er lettest at opfylde, mens AAA typisk vil kræve en del flere ressourcer.

Offentlige websteder skal opfylde niveau AA eller bedre.

Reglerne for at opfylde et niveau er simple: For at opfylde niveau AA skal man både opfylde niveau A og AA. For at opfylde AAA skal man opfylde AA og A.

Niveau AAA er det højeste niveau, og er en smule udfordrende. Overholder man nogle retningslinjer øger man godt nok tilgængeligheden for visse personer, men nedsætter den måske for andre.

 Kursus: Tilgængelighed på nettet – forstå WCAG 2.0 – Tilmeld dig nu! 

Ikke en udtømmende guide til WCAG 2.0

WCAG består af 4 hovedprincipper og 27 retningslinjer for tilgængelighed på nettet.

Denne artikel er en kort introduktion til tilgængelighedsprincipperne, med fokus på udvalgte retningslinjer og succeskriterier.

Der er links i artiklen til de forskellige, relevante afsnit i WCAG 2.0, jeg omtaler. Det er desværre ikke altid muligt at linke direkte til afsnittet, så du må nogle gange lede lidt.

Oversigt over Web Content Accessibility Guide 2.0
Der er 4 principper og 12 anbefalinger i WCAG 2.0. Til anbefalingerne er der retningslinjer for hvert niveau. Download oversigten i højopløsning

1. princip: Opfattelig (Perceiveable)

Fire symboler der signalerer tilgængelighed for personer med forskellige handicaps - motorisk, koginitive, høring og syn
Tilgængelighed handler om at gøre indhold brugbart for andre end personer med perfekt syn, hørelse, forståelse og bevægelighed.

1.1: Ikke-tekstbaseret indhold skal kunne forstås af alle (1.1)

Begrebet “Ikke-tekstbaseret indhold” dækker først og fremmest over indhold med informationsværdi, som:

  • Grafik, fotos og illustrationer,
  • Inputfelter,
  • Lyd,
  • Video.

For at gøre den type indhold tilgængeligt for alle er vi nødt til at beskrive det for de brugere, som ikke kan se, høre eller fornemme indholdet.

Reglen er, at ikke-tekstbaseret indhold som udgangspunkt skal beskrives med tekst i en form, der kan tolkes af læseren, uanset hvordan hun modtager indholdet. (1.1.1)

Altså: Beskriv, hvad handler videoen om, hvem er med, hvem siger hvad, hvem gør hvad og så videre.

En simpel metode er som oftest almindelig tekst, der både kan læses i en skærmlæser eller zoomes ind og ud efter behov. I andre tilfælde, er det nødvendigt at ty til andre midler.

Tabellen nedenfor giver mulige løsninger på, hvordan de forskelige typer indhold kan håndteres.

Indholdstype Mulig løsning
Video Transkription, synstolkning, tegnsprog
Infografik, kurver, grafer Billedtekst, Uddybende beskrivelser
Illustrationer Billedtekst, Alt-tekst, Title-tekst
Lyd Resume, afskrift
Dekoration Bør ikke beskrives, da det kan forvirre.
Placer det som baggrundsbillede

1.3: Bevar informationer og struktur selv om præsentationen ændres (1.3)

Der er vide rammer for, hvordan indholdet kan præsenteres, så længe at meningen bevares.

I HTML5, som er  den seneste standard for html, er der kommet mange muligheder for at indikere, hvordan siden er struktureret i navigation, indhold og sektioner.

Selv om det visuelle layout er forskelligt fra den måde indholdet er struktureret i HTML-koden, skal skærmlæsere stadig kunne finde logikken på siden, ved at tolke kodernes semantiske betydning. (1.3.1)

1.4: Gør det let at se og høre indhold (1.4)

Animation, der viser farvede bolde gennem forskellige filtre til at illustrere farveblindhed med
Animationen viser, hvordan forskellige typer farveblindhed ændrer opfattelsen af den originale farve. Foto: Yotan Vered, flickr.com. Collage: Netvenlig.dk

Hver 12. mand og hver 200. kvinde er ude af stand til at skelne visse farver fra hinanden. Det er ganske mange mennesker, og for mange til, at vi kan ignorere deres behov.

Undgå at bruge farve som det eneste middel til at signalere navigation eller vigtig information. Der vil være brugere, som ikke kan se det. (1.4.1)

Er I i tvivl, kan I prøve at lave Keith Instones Navigation Stress Test.

Lav kontrast mellem tekst og baggrund ser måske moderne ud, men det rammer endnu flere end blot farveblinde. Stort set alle over 40 vil finde det irriterende i større eller mindre grad at skulle sidde med sammenknebne øjne, for at læse en tekst. Don’t do it! (1.4.3 og 1.4.6)

Det anbefalede kontrastforhold er mindst 4,5:1 for almindelig brødtekst.  Store typer over 24px (normal) kan nøjes med 3:1. Den letteste måde at konstatere om I er på den rigtige side, er at bruge Lea Verous Contrast Ratio-tjeneste. Er I hardcore, downloader I Colour Contrast Analyser fra Paricello Group.

Til sammenligning har sort tekst på hvid baggrund et kontrastforhold på 21:1

Hold unødvendig lyd til et minimum

Du kender det: Du sniger dig til at læse lidt nyheder i arbejdstiden. Pludselig overfaldes du af lyd fra en selvstartende reklame eller video, og alle i lokalet er klar over, at du ikke passer det, du får løn for. Ikke rart, vel?

Skærmbillede af artikel fra politiken.dk. Artiklen har en video og en tekst. Billeder linker til artiklen, hvor videoen starter automatisk.
Politiken.dk starter som standard videoafspilleren så snart, siden er indlæst. For blinde vil det blive sværere at bruge en skærmlæser, hvis videolyden forstyrrer skærmlæserens oplæsningsstemme. For andre kan det skabe en pinlig stemning, i situationer, hvor smuglæsning ikke er velset. Klik på billedet og oplev på eget ansvar.

Blinde navigerer nettet ved hjælp af lyd og kan man ikke høre sin skærmlæser, kan det blive svært at finde den knap på siden, som kan slukke for lyden.

Varer en lyd over 3 sekunder skal der altid skal være en mulighed for at slå lyden fra. (1.4.2)

Endnu bedre er det at lade være med at autostarte lyd  og video i det hele taget. Det gør alle glade, også dine kolleger på kontoret.

2. princip: Anvendelig (Operable)

“Brugergrænsefladekomponenter og navigation skal kunne anvendes”

2.1: Websider bør kunne betjenes via et tastatur (2.1)

Denne retningslinje er et eksempel på, hvordan tilgængelighed kan gavne både handicappede og ikke-handicappede.

For mange bevægelseshæmmede er en mus udelukket til navigation. I stedet bruger nogle en simpel pind, de holder i munden, andre bruger kontakter, de kan aktivere med hovedet. I et system, der ofte kræver stor nøjagtighed at betjene, er ingen af delene særlig effektive.

Tabulator-tasten (den med de to pile og ordet: “TAB”) er ofte et alternativ til at bruge musen.

Tasten er især effektiv, når man skal arbejde sig gennem en længere formular. Når man trykker på den, bringer cursoren automatisk næste inputfelt i fokus.

For almindelige links vil du se en stiplet linje omkring elementet (2.4.7). Vælg det med mellemrumstasten.

Tabulator-navigation og genvejstaster gør det samtidig lynhurtigt for rutinerede, ikke-handicappede brugere at betjene en side. Her for alle noget for pengene!

2.2: Giv folk en chance for at følge med (2.2)

Mange bruger karruseller på forsiden til at vise forskelligt indhold fra websitet.

Desværre er karruseller ofte så dårligt udført og så fuld af tekstindhold, at det kræver særdeles gode læseevner at kunne følge med inden de skifter til næste billede.

For ordblinde og læsesvage er karruseller en ekstra pine, fordi de når at få læst endnu mindre end en normaltlæsende.

Anbefalingen er derfor at have en pauseknap, der kan standse rotationen i tide. (2.2.2)

Skærmbillede af NaturErhvervs forside. Der er en karrusel og mulighed for at pause rotationen.
NaturErhvervstyrelsen har en karrusel på forsiden. Rotationen stoppes ved at vælge pauseknappen nederst til højre i det blå område.

2.3 Undgå at give folk epilepsianfald (2.3)

Blink, glimt og hurtige farveskift på mere end 3 gange i sekundet kan forårsage epileptiske anfald hos nogle. For andre vil det bare være ubehageligt at se på.

Så lad være. Det er egentlig en no-brainer.

2.4 Hjælp folk med at navigere rundt på sitet (2.4)

Skriv tydelige overskrifter, der forklarer indholdets emne eller formål (2.4.2). Det har alle glæde af, både normaltlæsende, svage læsere og søgemaskiner.

Mange skærmlæsere kan springe indhold over, hvis det er korrekt mærket op. Her på Netvenlig.dk vil det første tabulatortryk på siden afsløre en skjult knap i øverste venstre hjørne, der siger: “Skip to content”. På den måde behøver man ikke vade gennem navigation og højrespalter, for at finde indholdet på siden (2.4.1).

3. princip: Forståelig (Understandable)

“Information og betjening af brugergrænsefladen skal være forståelig”

Retningslinjerne i dette princip er grundlæggende gode, sunde usabilityregler. Kan I overholde dem, kan I snildt overholde princippet om forståelighed.

3.1 Gør tekstindhold læseligt og forståeligt (3.1)

På det laveste niveau A, kræver princippet, at websiderne identificerer hvilket sprog de er skrevet på. Er de på dansk, bør der i htmlkoden være tilføjet et <lang=”da”> i headeren.

Der er ingen retningslinjer på niveau AA, men vil I være gode ved jeres læsere, er det her, I har mulighed for at tilføje ordbøger og encyklopædier til jeres indhold. (3.1.3 og 3.1.4).

Er teksternes sværhedsgrad over ca. 8. klasses niveau kan I overveje, om der skal skrives flere versioner af det samme indhold. (3.1.5)

Mindst 700.000 danskere er enten ordblinde eller svage læsere. I mange tilfælde er det en god investering.

 Kursus: Skriv til nettet og mobil. Afholdes flere steder i landet 

3.2 Gør websitet forudsigeligt (3.2)

Det skaber tryghed og tillid at kunne forudsige, hvad der sker, hvis man foretager en bestemt handling:

  • Links, der åbner på samme måde gennem hele webstedet
  • Ikoner, der ligner og opfører sig på samme måde, som vi kender fra resten af nettet
  • Overskrifter, der fortæller hvad vi kan forvente at finde, hvis vi klikker på dem

Al den viden vi har om nettet, har vi samlet op over tusindvis af besøg på andre websteder og tjenester. Når vi kan bruge den viden, kan vi løse vores opgaver og komme videre med livet.

Skal vi pludselig til at lære et websted at kende, så falder lysten til at bruge det tilsvarende med indlæringskurven.

3.3 Hjælp folk til at undgå at lave fejl (3.3)

Fejl sker, uanset hvor godt vi sikrer os mod det. Nogle gange er det brugeren, andre gange er det systemet, der fejler.

Begge dele er i vid udstrækning noget, vi kan forhindre.

Systemfejl kan forebygges ved hjælp af tests. Intet system bør slippes løs uden at være testet adskillige gange.

Brugerfejl kan undgås ved at reducere mængden af potentielle misforståelser og tvetydigheder i kommunikationen.

Hvis en dato i en webformular kun kan skrives ind på en bestemt måde, skal det være let at

  1. forstå, hvad det er vi forventer af brugeren,
  2. indtaste datoen efter de krav, vi har stillet,
  3. forstå, hvis vi alligevel har gjort det forkert (3.3.5)
  4. rette fejlen – uden at skulle begynde forfra på formularen.

(3.3.1 til 3.3.3)

Hvis de oplysninger vi afgiver kan have personlige konsekvenser, økonomisk eller juridisk, skal det for eksempel være muligt at

  • fortryde eller rette sine indtastninger,
  • få tjekket sine input, før de afsendes eller
  • bekræfte sine oplysninger, inden de indsendes,

hvor det er relevant. (3.3.4)

4. princip: Robust (robust)

“Indholdet skal være robust nok til at kunne anvendes på stabil vis af en bred vifte af brugeragenter, herunder kompenserende teknologier.”

I gamle dage var det ikke ualmindeligt at blive bremset af en stor disclaimer, som advarede mod at bruge et websted med den forkerte browser. Typisk lød det: “Denne sider er optimeret til Internet Explorer 6.0 i skærmstørrelsen 1024×768 pixel med 120 farver og kan muligvis ikke vises korrekt i andre browsere”.

Nogle gange skulle det forstås helt bogstaveligt – siden nægtede at afsløre sit indhold, hvis man så den i Firefox eller Opera (hvis nogen husker den).

4.1: Kompatabilitet er fremtidssikring (4.1)

I dag er det helt uacceptabelt kun at optimere til en bestemt browser, og fænomenet ses ikke særlig ofte længere.

Og så alligevel: hvornår har I sidst tjekket jeres indhold i andet end almindelige, visuelle webbrowsere? Ved I, hvordan en skærmlæser behandler jeres indhold? Kan man stadig få overblik, selv om man zoomer 200 procent ind på siden uden at miste informationer? Har døve mulighed for at forstå jeres instruktionsvideoer? Kan man navigere kun med tastaturet?

4.1.1: God kode giver robust indhold

God tilgængelighed stikker dybt. Helt ned i programkoden.

Tidligere var der ret rigide krav til korrekt opmærkning af indhold. XHTML-standarden var for eksempel meget striks. Det var måske lidt bøvlet for programmørerne, til gengæld var koden robust, fordi der ikke var tvivl om, hvordan de forskellige elementer på siden skulle vises.

HTML5 er derimod mere fleksibel. Visse “containerkoder” behøver nu ikke længere at blive lukket med lukkekode eller ” />”, som tidligere versioner krævede.

Løsere krav til koden, stiller større krav til programmørens disciplin og viden. (4.1.2)

Hjælpeteknologier vil ofte forsøge at reparere dårlig kode, men det kan risikere at blive på bekostning af læsbarhed og forståelse.

Bundlinjen er, at ligesom vi tester indhold og funktionalitet for fejl, så tester vi også vores HTML for fejl. (4.1.1)

Den bedste måde at gøre det, ud over selv at blive ekspert i HTML, er at undersøge koden med en HTML-validator.

Lær tilgængelighed og giv alle lige adgang

Jeg holder kursus i tilgængelighed på Teknologisk Institut.

Kurset giver et dybere kendskab til WCAG 2.0, og hvordan principper og retningslinjer kan implementeres i praksis.

I får også lejlighed til at stifte bekendtskab med forskellige måder og metoder til at undersøge og teste sit indhold.

Tilgængelighed på nettet – forstå WCAG 2.0 Tilmeld jer i dag!

Skriv gode overskrifter til nettet

Resume: Overskrifter på nettet fortæller om indholdets emne eller formål. Overskrifter skal kunne læses som selvstændige enheder, uden hjælp fra det øvrige indhold.

Overskrifter på nettet skal først og fremmest hjælpe os til at kunne løse en opgave af en art: Finde oplysninger, få svar på spørgsmål, foretage en handling.

I sin bog ‘Letting Go of The Words’ har Ginny Redish identificeret tre krav til en god overskrift:

  • Fortælle læserne, at her er noget relevant,
  • Fortælle andre, at det her er ikke relevant,
  • Gøre det let for søgemaskiner at forstå jeres indhold.

Præcise, letforståelige og selvforklarende overskrifter kan opfylde alle tre formål uden besvær.

Overskriften er artiklens varedeklaration

The most important headline rule is: respect the reader experience. In this era of clickbait, it’s more important than ever to write a headline that delivers on its promise.Hubspot + Outbrain: Data Driven Strategies For Writing Effective Headlines

Overskriften er det element, der kortest og mest effektivt skal fortælle kunden, hvad I har at tilbyde her.

En overskrift lover altså læseren, at her kan man finde indhold om et bestemt emne.

En forkert eller vildledende overskrift vil ofte få læserne til at forlade jer øjeblikkeligt.

 Tag på kursus i at skrive til nettet: Afholdes over hele landet. 

Skriv med dine læseres ord

Du er ikke som dine læsere. Det lyder banalt, men det er en pointe som mange overser.

Faktum er, at vi sjældent kan tage vores egne erfaringer med nettet eller viden om bestemte emner, og overføre dem direkte på de, der skal anvende vores indhold.

Bruger du dine læseres ord i overskrifter, sker der to ting:

  • Dine læsere kan finde det de leder efter
  • Søgemaskinerne kan indeksere indholdet bedre

At lære sine læsere godt at kende er altid en god investering i tid og penge.

Skriv langt: 5 ord er godt, 8 er bedre

Hvis din tekst var en krimi, skulle overskriften afsløre, hvem morderen er Borger.dk: Sådan skriver vi på Borger.dk 2.0 (PDF)

For at gøre vores overskrifter selvforklarende er vi nødt til at bruge ord.

En god længde er 5 ord, men undersøgelser peger på, at omkring 8 ord virker endnu bedre.

Bruger vi mange ord, er det lettere for os at kommunikere indholdets budskab. Vi har plads til at skrive hele sætninger og gøre overskrifterne selvforklarende og indlysende, to gode egenskaber for alt indhold på nettet.

Skærmbillede, der viser et Google-kort, som peger på Metalskolen Jørlunde. Siden har overskriften Transport
Overskriften her er en ringe hjælp til at finde vej til Metalskolen Jørlunde. Hvis titlen i stedet havde været: “Find vej til Metalskolen Jørlunde” ville læserens usikkerhed kunne reduceres væsentligt.

Er du i tvivl om, hvad du skal bruge alle de ord til, så brug denne metode:

1: Start med at besvare spørgsmålet: Hvad vil jeg have folk til at gøre med denne side? Måske er formålet, at kunderne skal kunne finde vej til din virksomhed. Så er svaret: “Jeg vil gerne have, at folk skal kunne finde vej til Virksomhed X”

2: Sætningens første udsagnsord er “finde”, et handlingsorienteret og informationsbærende ord.

3: Slet ordene frem til udsagnsordet og du står tilbage med “…finde vej til Virksomhed X”.

4: Skriv om til en helsætning: “Find vej til Virksomhed X”.

Nu har vi en overskrift, som opfylder de nødvendige krav: Den fortæller folk med det samme, hvad siden handler om og søgemaskinerne har nøgleord, der kan indekseres.

Frontloading: Skriv med nøgleord

Når vi ser en overskrift er det ikke sikkert, vi læser mere end de første 2-3 ord i sætningen. Resten skanner vi med vores perifære syn.

Betydningen af de første ord i sætningen kan derfor være afgørende for, om kunden forstår, hvad indholdet handler om.

Metoden kaldes frontloading og kan bruges på alle elementer på siden: Afsnit, mellemrubrikker, lister – og naturligvis overskrifter.

Eksempel på to overskrifter, hvor den ene er frontloadet
Frontloading: Hvilken af de to overskrifter har mest information i starten af teksten?

At blive god til frontloading kræver øvelse, men alle kan lære det i løbet af nogle forsøg.

No one said writing headlines would be easy. But the hard work is worth it because guests rely so heavily on the headings when trying to understand your overall structure, predict content, and make efficient choices.Jonathan & Lisa Price: Hot text (New Riders, 2002)
Kursus: Skriv til nettet
Lær mere om frontloading, overskrifter og at skrive til nettet. Netvenlig holder landets måske bedst evaluerede kursus i digital formidling. Afholdes flere steder i landet. Ring eller skriv: tlf. 40 93 21 98, lmsoren@netvenlig.dk

Brugertest: Test selv for bedre usability

Resume: Her er 5 måder til at lære at undersøge brugervenligheden på dit website. Du kan tage dem i den rækkefølge, jeg har foreslået, eller du kan plukke det ud, du synes er interessant.

En mand og en kvinde udfører en tænke-højt-test på computer
Tænke-højt-test Foto: Thomas Link (CC-BY-SA)

Jeg har undervist i usability i adskillige år og altid insisteret på, at det ikke behøver være den store videnskab at finde ud af, om ens navigation er holdbar, eller om folk kan finde vigtigt indhold på sitet.

Her er 5 muligheder for selv at gå i gang. Er du helt ny, så start fra toppen og arbejd dig igennem listen.

Er du rutineret, så snup bare det, der virker interessant.

 

1: Steve Krug: Rocket Surgery Made Easy
Bogen er en forlængelse af kapitel 9 i Krugs efterhånden legendariske bog: “Don’t Make Me Think”.

Du får den grundlæggende viden om brugertest, og især omkring den populære tænke højt-testmetode.

2: Hoa Loranger: Checklist for Planning Usability Studies
Checklisten er omfattende og udførlig, som alt andet fra NNGroup. Velskrevet og med mange links til mere viden.

Artiklen er som en kondenseret version af “Rocket Surgery…”, skrevet med andre ord, men understøtter Krugs budskab meget fint.

3: The Complete Guide to Usability Testing
Gratis e-bog fra Usertesting.com. Ikke fantastisk dybdegående, men den giver et godt overblik og er et fint supplement til de to andre ressourcer.

E-bogen er især god at stikke i hånden på en chef eller lignende.

4: David Travis: Usability Testing Boot Camp
Et onlinekursus med meget høj værdi. David Travis har mange års erfaring med User Experience og Usability, og hans kursus er nok et af de mest populære af slagsen.

Prisen svinger lidt, men du kan være heldig at få hele kurset til næsten ingen penge, når Udemy.com holder udsalg.

5: Rolf Molich: Regler for standardtest af brugervenlighed (PDF)
Ekspertniveau. Til når du er blevet rigtig hardcore og gerne vil gøre det efter en standardiseret metode.

Dokumentet har flere gode pointer, som du med garanti kan få glæde af, før, under og efter din første test. Hvor mange der anvender hele standarden, kan jeg ærlig talt ikke svare på.

Forfattet af usabilitypioner Rolf Molich, der blandt har udviklet usabilty-heuristikkerne sammen med Jakob Nielsen.

Tag på kursus i usability

Vil du gerne introduceres til usability og testmetoder, så har du flere muligheder:

Er du i tvivl, så skriv til mig eller ring på 40 93 21 98