Her på siden har vi opsat et eksempel med en lang, teksttung indholdsside, hvor content navigation-modulet i højre side gør det simpelt at hoppe mellem overskrifter. Teksten er lånt fra vores WCAG-guide.
Første overskrift
Brugeren skal tydeligt kunne forstå dit website, også selvom de bruger en hjælpeteknologi. Hvis du har en besøgende på dit site, som gør brug af en skærmlæser, skal vedkommende kunne forstå dit site akkurat som en person uden en skærmlæser.
Rent lyd- og videoindhold er en lydoptagelse eller en videooptagelse der står alene. Det vil sige en video uden lyd, eller et lydspor uden video. Det er vigtigt, at brugere med eksempelvis nedsat syn kan tilgå og læse rent videoindhold, på niveau med personer som ikke har nedsat syn. Det samme gør sig gældende for personer med nedsat hørelse og rent lydindhold. Derfor skal der tilbydes et alternativ - f.eks. via tekst.
Elementer på dit site, som er placeret i en rækkefølge der er nødvendig for forståelsen af indholdet, skal læses op på samme måde af skærmlæseren som uden. Et eksempel kunne her være personer, som bruger et program der læser siden op for dem. Her er det vigtigt, programmeringsmæssigt, at bestemme læserækkefølgen så den giver mening for brugeren.
For at forstå dette kriterie kan man forestille sig en avis, hvor alle kolonnerne, artiklerne og billederne vil blive læst i en særlig rækkefølge af øjet. Denne rækkefølge skal via HTML'en på din hjemmeside fastlægges, så personer uden syn vil få indholdet præsenteret i en naturlig, logisk rækkefølge.
En underoverskrift
Indhold som har betydning, men som ikke er tekst, skal have et tekstalternativ til blinde og svagtseende. Dette gælder indhold såsom billeder, animationer, videoer, iframes og lydelementer. En skærmlæser skal kunne adskille disse elementer fra hinanden, ved hjælp af det, der kaldes en “alt-tekst” eller en "title" attribut. Teksten bliver læst op af skærmlæseren, når der f.eks. bliver kørt hen over et billede med skærmlæseren.
Hvis der anvendes genvejstaster på dit website skal mindst én af følgende muligheder virke: Det skal være muligt for slutbrugeren at slå genvejstaster fra, ændre genvejen eller at genvejstaster kun er aktive når indholdselementet er i fokus.
Anden overskrift
Brugeren skal kunne anvende dit website enten vha. tastaturet eller anden hjælpeteknologi. Indholdet på dit website skal kunne tilgås og anvendes vha. tastaturet. Anvendelsen må ikke være afhængig af brugerens timing af tastaturtryk. Der kan være undtagelser, hvis funktionaliteten på websitet er afhængig af brugerens handlinger. F.eks. hvis brugeren skal tegne en underskrift.
Brugeren skal let kunne skifte fokus mellem indholdselementer med tastaturet. Hvis der er særlige måder at skifte fokus på, skal brugeren have metoden forklaret. Du skal undgå, at brugeren havner i en "tastaturfælde", som f.eks. kan være et søgefelt: Når en person bruger tastaturet til at navigere med, og kommer til søgefeltet og åbner det, er det vigtigt at personen kan komme ud af feltet igen med tastaturet. Hvis brugeren ikke kan det, er det et eksempel på en tastaturfælde.
Indhold på website som automatisk bevæger sig, blinker, scroller eller lignende skal kunne sættes på pause, skjules eller stoppes. Dette gælder også hvis det varer mere end 5 sekunder, eller hvis det vises samtidigt med andet indhold. For indhold som automatisk opdateres skal det også være muligt for brugeren at styre hvor ofte det bliver opdateret. Et klassisk eksempel på indhold som dette kunne være en billedslider, som automatisk skifter mellem billeder. Her skal du implementere en pauseknap.
Tredje overskrift
Dine brugere skal kunne forstå informationerne på dit website, og hvordan de bruger det. Der skal programmeringsmæssigt tilføjes en "lang" attribut i <HTML> elementet der omgiver ens website. Dette fortæller browseren, hvilket sprog websitet er skrevet i. Dette er bl.a. vigtigt for, at skærmlæseren kan identificere hvilket sprog den skal læse op for brugere med nedsat eller intet syn.
Når et navigationselement bliver repeteret på op til flere sider skal det bevare konsistens og have en ensartet rækkefølge ned igennem strukturen. Elementet må altså ikke ændre sig med mindre at brugeren har foretaget en handling der skaber denne ændring.
F.eks. skal ens hovednavigation forblive ens når man som bruger navigerer ned igennem sitets struktur.
Indhold på website som automatisk bevæger sig, blinker, scroller eller lignende skal kunne sættes på pause, skjules eller stoppes. Dette gælder også hvis det varer mere end 5 sekunder, eller hvis det vises samtidigt med andet indhold. For indhold som automatisk opdateres skal det også være muligt for brugeren at styre hvor ofte det bliver opdateret. Et klassisk eksempel på indhold som dette kunne være en billedslider, som automatisk skifter mellem billeder. Her skal du implementere en pauseknap.
Hvis brugeren indtaster en fejl i f.eks. en formular på dit site, skal det tydeligt angives for brugeren, at der er tale om en fejl. Det kan være en email der ikke møder op til emailfeltets krav, et telefonnummer hvor der mangler et tal eller lignende. Her skal du oplyse brugeren om, at de har indtastet en fejl.
Sidste overskrift
Alle elementer på dit website skal være tilgængelige med hjælpeteknologi, og skal opdateres i takt med teknologierne.
Statusbeskeder kan f.eks. være, når brugeren på et website tilføjer tre varer til en indkøbskurv, og kurven derefter vil få tilføjet et tretal i en rød cirkel ved siden af kurven. Det kunne også være et ikon der indikerer, at brugeren har gemt sine ændringer.
Statusbeskeder kan bestemmes i HTML'en gennem f.eks. “role” attributten. Det er vigtigt, at statusbeskederne er skrevet med korrekt HTML, da personer med skærmlæsere ikke vil få læst beskederne korrekt op, hvis HTML'en ikke er korrekt.
Når HTML “parser” vil det sige, at det er semantisk korrekt. Det er skrevet korrekt og kan køres igennem en HTML validator uden at give fejl. Kør koden på dit website gennem en HTML validator og find i samarbejde med din leverandør ud af, hvad i kan gøre for at koden validerer bedre, så du står med et mere robust og tilgængeligt website. Ideelt set skal du have 0 fejl i HTML validatoren.
Klik dig igennem dit website og undersøg, om der er steder hvor du ville finde det naturligt som bruger at få en besked eller notifikation omkring en ændring på dit site. Hvis du opdager steder som disse, noter dem, og udarbejd i samarbejde med din leverandør og/eller designer notifikationer og statusbeskeder, der fremadrettet skal optræde på dit site.