Forside

Internett for alleEt hefte om hvordan gjøre internett tilgjengelig for synshemmede

Logo: Blindeforbundet.

Illustrasjon: En gutt med mørke briller og ryggsekk stikker den ene hånden inn i en PC-skjerm. En strøm av muligheter renner ut av PC-en. Mulighetene er illustrert som en jordklode, en bok, ent informasjonstegn, et ukeblad, et brev og en telefon. Forsideillustrasjon: Martin Bøchman.

Innhold:Kolofon:Hvorfor er universell utforming viktig?Lovverk og standarder

Diskriminerings- og tilgjengelighetslovenLov om offentlige anskaffelserW3C og WAI-retningslinjer

Synshemmedes arbeidsmåterBruk av hjelpemidlerForskjellige former for tilpasningerVisuelle tilpasninger i nettleser eller operativsystemetBruk av hurtigtaster

Hvordan opplever synshemmede internett?Når en ikke ser altNår en ikke ser i det hele tatt

Tilgjengelig innholdSidetitlerLenkerOverskrifterBilderListerTabellerRammerSkjemaerNedlastbare dokumenterJavascriptFlash, Java og rike internett applikasjoner

PresentasjonFarger og kontrasterSkrifttype (font)Forstørring og skalerbarhet til innhold og tekst

RessurserBrukertestNettsteder hvor du kan teste nettsiders tilgjengelighet.Firmaer som kan gi faglig og profesjonell hjelp til testing og produksjon av nettsider og løsninger.

Aktører som kan gi generell informasjon.

Kolofon:Utgitt av Norges Blindeforbund 2010ISBN: 978-82-92998-11-3Skrevet av: Sverre Andreas Hilditch Holbye, Include AS.Redaksjonen: May Britt Haug (redaktør), Aage Auby, Mia Jacobsen, Terje André Olsen, Kristin Ruud og Arild Øyan.Rådgiver: Stian Larsen.Illustrasjoner: Sverre Andreas Hilditch Holbye, Anne Rita EgelandFoto: Norges Blindeforbund alle steder der det ikke er spesielt beskrevet. Layout: Anne Rita Egeland.Trykk: 07 Gruppen AS.Skrift: The Sans Semi Bold 13/15,6p.Opplag: 3.000Utgitt med støtte fra ExtraStiftelsen Helse og Rehabilitering.

Bilde: En mann og en dame foran en PC med sterkt forstørret skjermbilde. De øver på data. Foto: Siri Berrefjord

Den teknologiske utviklingen har gitt oss alle utvidede muligheter for deltagelse; Fra det å kjøpe varer og tjenester, til det å delta i den offentlige debatt, skaffe seg nye venner, eller tilbringe tid på Facebook. Via internett kan vi handle varer, utføre banktjenester eller bestille billetter til fly, kino eller tog. Internett har gitt nye åpninger for det å være delaktig.

Internett er kanskje også den viktigste markedsføringskanalen for mange firmaer, og det offentliges tjenester blir mer og mer digitalisert. Vi er i økende grad i dialog med kommuner, offentlige etater, venner og familie, og aktører som er ute etter meningsutvekslinger. Det bør være et mål for det offentlige, vare- og tjenesteleverandører, og folk generelt at alle kan få tilgang til denne informasjonen. Dette krever universell utforming av internettbaserte løsninger og nettsider.

Det finnes ingen oversikt over hvor mange som er blinde eller svaksynte i Norge, men det antas at 2-3 prosent av befolkningen har så stort synstap at de ikke kan oppfatte store deler av den informasjonen andre tar som en selvfølge. Blir samfunnets informasjon tilrettelagt for synshemmede, vil man gjøre den mer tilgjengelig for alle.

I denne publikasjonen gir vi en introduksjon til hvorfor universelt utformede nettsider er viktig, hva det vil si å være synshemmet internettbruker, og hvordan universelt utformede nettsider skal utformes. Vi vil fokusere på synshemmede og deres behov.

Bilde: En gutt sitter med ryggen til. Han har ansiktet tett opp til en dataskjerm. Skjermbildet er sterkt forstørret.

Hvorfor er universell utforming viktig?

Universelt utformede nettsider vil si at disse kan betjenes og leses av flest mulig mennesker, uavhengig av deres valg av hjelpemidler og teknologier.

Det er viktig å understreke at digital publisering av informasjon i seg selv ikke er ensbetydende med at den er tilgjengelig for alle. Digital publisering av informasjon må skje på en måte som også sikrer at tilgjengelighet til informasjonen ivaretas.

Universell utforming er altså et sentralt virkemiddel for å gi alle mennesker de samme mulighetene for selvstendighet og deltagelse. Dette skaper en rekke fordeler for deg som avsender:

få flere besøkende. få et mer lojalt publikum. flere kunder. økt synlighet i søkemotorer som Bing og Google. overholde gjeldende lovverk. webstandarder legger opp til bedre muligheter for økt gjenbruk. webstandarder gir redusert vedlikehold av nettstedet.

Bilde: En hvit stokk ligger sammenbrettet oppå boken Norges Lover.

Lovverk og standarder

For å sikre at det som produseres på nettet er universelt utformet finnes det eget lovverk som spesifikt omhandler og omtaler universell utforming.

Diskriminerings- og tilgjengelighetsloven

”Loven skal bidra til nedbygging av samfunnsskapte funksjonshemmende barrierer og hindre at nye skapes.” (Utdrag fra lovens § 1, formål.)

§ 9, Plikt til generell tilrettelegging (universell utforming).En hver virksomhet har en generell plikt til å sørge for at virksomhetens hovedløsning som er rettet mot allmennheten er universelt utformet. IKT-løsninger er fremhevet i lovparagrafen.

§ 11, Universell utforming av IKT.

Hovedløsninger rettet mot allmennheten skal være universelt utformet, noe som innebærer at flest mulig mennesker skal kunne bruke disse. Den enkelte virksomhet som faller innenfor lovens rammer (gjelder både offentlig og private aktører) må sørge for at de har løsninger som er universelt utformet.

Lov om offentlige anskaffelser

§ 6, Livssykluskostnader, universell utforming og miljø stiller krav til det offentlige. De har en plikt til å sørge for at de tar hensyn til universell utforming, noe som i praksis tilsier at de må stille krav til universell utforming i en anskaffelse. Dette innebærer at man i forarbeidet til en anskaffelse er forpliktet til å dokumentere hvilke hensyn man skal ta, samt krav man har til produktet eller tjenesten som skal anskaffes. For leverandører betyr dette at de må levere anbud som tilfredsstiller kravene til universell utforming.

Logo: W3C

W3C og WAI-retningslinjer

W3C (World Wide Web Consortium) setter viktige standarder for hva tilgjengelighet på internett skal være.

W3C har etablert en egen arbeidsgruppe, WAI (Web Accessibility Initiative), som har som ansvar å utvikle “strategier, retningslinjer og ressurser med det formål å gjøre internett tilgjengelig for mennesker med funksjonshemning”.

WAI har laget flere retningslinjer som angår tilgjengelighet og internett. Av interesse i vår sammenheng er det først og fremst:• WCAG 2.0 (Web Content Acccessibility Guidelines).WCAG beskriver retningslinjer og prinsipper for tilgjengelighet til innhold på websider. WCAG 2.0 er WAIs overordnede retningslinje for tilgjengelig på web og er basert på fire prinsipper: Nett-sider skal være gjenkjennbare, anvendelig, forståelige og robuste. WCAG spesifiserer hvordan de ulike innholdselementene skal legges til, hva de skal inneholde av beskrivelser (attributter) og når man skal bruke de ulike typene innholdselementer.• ATAG 2.0 (Authoring Tool Accessibility Guidelines).ATAG beskriver krav til forfatterverktøy, html-editorer og andre verktøy som skal brukes for å produsere innhold til web slik at innholdet følger retningslinjene i WCAG. • ARIA 2.0 (Accessible Rich Internet Applications). ARIA beskriver hvordan interaktive applikasjoner bør implementeres. Det vil si teknologier som i stor grad benytter seg av teknologier som AJAX, HTML, Javascript. ARIA beskriver standarder for at hjelpemidler lettere skal identifisere interaktive elementer på en nettside og hvilken tilstand (for eksempel aktiv eller inaktiv) slike elementer er i.

Bilde: Hender som skriver på et tastatur med leselist.

Synshemmedes arbeidsmåter

Synshemmede er ingen homogen gruppe, derfor er det selvsagt ikke mulig å si at alle synshemmede jobber slik eller sånn. Hva slags synshemming man har, og hvilke konsekvenser den gir, vil i stor grad påvirke hva slags tilrettelegging eller hjelpemidler som brukes for å best mulig kompensere for sitt synstap.

I all hovedsak er det tre måter å kompensere på. De utelukker ikke hverandre, og det er ikke uvanlig at det benyttes en kombinasjon. Tilpasninger i nettleser og/eller i datamaskinens operativsystem. Forstørringsprogram. Skjermleser.

En skjermleser er et program som gjør teksten på skjermen tilgjengelig i punktskrift/Braille, ved hjelp av en leselist, og/eller opplest ved syntetisk tale.

Hvorvidt en bruker spesialiserte hjelpemidler eller egne tilpasninger som er med på å kompansere vil det uansett ha konsekvenser for hvordan en arbeider på datamaskinen.

Illustrasjon: Øverst et bilde av en typisk internettside. Eksemplet er en faksimile fra Dagbladet. Under bildet er det satt opp tre piler som peker både mot internettsiden og mot en bjelke som ligger under. På hver pil står det en tekst, henholdsvis: Struktur, innhold, navigasjon. På bjelken som er et slags filter, er det skrevet: Hjelpemiddelteknologier. Fra underkanten av bjelken er det tre piler som kommer ut. De leder mot bokser hvor det er skrevet: Lenker, overskrifter, forstørring, syntetisk tale, leselist og markørfølging. Under disse boksene er det en tegning av en mann og en dame. Illustrasjon: Sammensatt av istockphoto.com og faksimile Dagbladet.

Bruk av hjelpemidler

Hjelpemidler for synshemmede, skjermlesere og forstørringsprogram fungerer som et bindeledd mellom hjelpemiddelet og det som leses opp eller forstørres. Det vil si at tilgangen til nettsiden ikke er direkte mellom leser og nettsiden, men går via hjelpemiddelet før innholdet når leseren. Nettsidens visuelle utforming vil ikke en sterkt svaksynt eller blind få med seg. Hjelpemidler for denne gruppen er derfor i stand til å formidle og representere innholdet på nettsiden, for eksempel presentere det i lyd og punktskrift.

Ta for eksempel overskrifter. Typiske kjennetegn for en overskrift er at bokstavene er litt større og kanskje litt tykkere enn i teksten for øvrig. En som ikke kan se går glipp av slike visuelle kjennetegn og er avhengig av at nettsidene er utformet slik at hjelpemiddelet kan hente ut informasjon om at et gitt innholdselement er av typen overskrift.

Når overskrifter og andre innholdselementer på en nettside er riktig utformet kan dette formidles av hjelpemiddelet i form av syntetisk tale, punktskrift eller ved visuelle forsterkninger. Resultatet er at brukere av hjelpemidler oppnår effektiv navigasjon og orientering i dokumentet.

Bilde: En rød, sterkt forstørret musepil som peker på en farget tekst på en dataskjerm.

Forskjellige former for tilpasninger

Tilpasninger kan gjøres i form av maskinvare eller i form av innstillinger i ordinær programvare og operativsystem. Det er ikke uvanlig med kombinasjoner av forskjellige tilpasninger, slik at en totalt sett får en tilpasning som passer den enkelte så optimalt som mulig.

Bilde: Blindeforbundets nettside tilpasset slik at bakgrunnen er sort og teksten er gul.

Visuelle tilpasninger i nettleser eller operativsystemet

Mange har behov for å endre på visuelle forhold, som tekststørrelser, farger og kontrastforhold. Her finnes det ingen standard, og variasjonen mellom hver enkelt synshemmet er stor. Bruken av slike tilpasninger forekommer ofte, nettopp fordi mulighetene er så mange og effektene relativt gode. Ofte vil endringer i størrelse og fargeforhold få påvirkninger på den generelle presentasjonen av nettsider.

Bilde: Nærbilde av hender på et tastatur.

Bruk av hurtigtaster

Blinde og sterkt svaksynte databrukere kan ikke bruke mus, de bruker tastatur og hurtigtaster. Å bruke tastaturet fremfor mus kan være svært vanskelig, spesielt dersom innhold på nettsidene er basert på at en funksjon kun kan utføres ved bruk av musen. Det er derfor viktig at man ikke baserer seg på at en gitt oppgave kun kan løses ved bruk av mus.

Bilde: To personer sitter ved hver si dataskjerm. Den ene har en sterkt forstørret tekst på skjermen i tillegg til hodetelefoner for opplesing av tekst.

Hvordan opplever synshemmede internett?

Så hva betyr det egentlig å bruke hjelpemidler eller tilpasninger når det kommer til det å faktisk bruke internett? Hva løser slike tilpasninger og hva for slags nye problemstillinger kommer som en konsekvens?

Først og fremst gjelder følgende dersom man bruker hjelpemidler eller tilpasninger:

En ser deler av informasjonen om gangen, ikke hele bildet. Dette gjør at det er fort gjort å gå glipp av informasjon på nettsiden.

En leser ikke nødvendigvis nettsiden i den rekkefølgen designet visuelt er lagt opp til.

Når en ikke ser alt

Hørselen og den taktile sansen (følesansen) er ikke spesielt godt egnet til raskt å fange opp innhold i brukergrensesnittet fordi det er begrenset hvor mye og hvor effektivt informasjon kan overføres til hjernen. Synet derimot er en svært effektiv sans som kan oppdatere hjernen med informasjon i løpet av ett blikk.

Illustrasjon: Utsnitt av en nettside. Viser et bilde av en dame med en sleiv foran det ene øyet og en overskrift.Tekst til illustrasjon: Blindeforbundets hjemmeside i forstørret visning. Innholdet utover nyheten er utenfor synsrekkevidde.

Illustrasjon: En hel nettside. Mye informasjon. Utsnittet som er beskrevet over er markert med rød ramme. Resten av siden er duset ned.Tekst til illustrasjon: Blindeforbundets hjemmeside i ordinær visning. Det forstørrede området vist i forrige bilde er uthevet.

Konsekvensen av slike arbeidsmetoder er at man ikke ser alt, men bare deler av en helhet. Man må først oppfatte en ting eller egenskap ved noe, før man deretter oppdager neste del, før man så setter disse bitene sammen til et helhetlig bilde. Dette påvirker både navigasjon og orientering. Det gir nye problemstillinger: Hvor er menyen? Må jeg navigere til høyre, oppover eller nedover?

Når en ikke ser i det hele tatt

Seende lar blikket forflytte seg raskt over nettsiden, en blind derimot leser siden omtrent som en bok. Man begynner på toppen og må lese linje for linje nedover.

Illustrasjon: Skjermdump av en nettside. Logo, illustrasjoner og tekst, samt navigeringsfelter vises.Tekst til illustrasjon: Toppen av Blindeforbundets nettside slik den fremstår visuelt.

Illustrasjon: Skjermdump av samme nettside. Her er det ingen bilder. Kun blå tekst.Tekst til illustrasjon: Toppen av Blindeforbundets nettside slik en blind bruker oppfatter den.

Illustrasjon: Skjermdump av tekst satt opp i to kolonner som viser henholdsvis overskrifter og lenkeliste for en nettside.Tekst til illustrasjon: Til venstre: Overskriftsliste for Blindeforbundets forside. Til høyre: Lenkeliste for den samme siden.

Viktige hensyn ved utforming av nettsider: Tenk over plasseringen av menyer og bruk av visuelle signaler og

farger. Tenk over hvilken struktur du har på nettsiden. Hvilke seksjoner eller

deler har sidene, og hvilken rekkefølge kommer disse i? Tenk på hvordan du gir tilbakemeldinger til brukeren på handlinger som

er utført på nettsiden.

Bilde: En ung mann sitter med hodet nært en dataskjerm. Det er en sterkt forstørret tabell på skjermen. En rød musepil peker på tabellen.

Tilgjengelig innhold

Det er ikke bare nettsidens tekst og bilder som gir informasjon til leseren. Måten innholdet er strukturert og formatert på formidler også informasjon.

Struktur innebærer å definere hva innholdet er, for eksempel lenker, overskrifter og lister. Formatering innebærer å definere hvordan noe skal se ut, for eksempel hvordan overskriften skal se ut, at noe skal ha understreking, bruk av farger eller tekststørrelser.

For personer med normalt syn er det ofte tilstrekkelig å se tekstens visuelle struktur og formatering for å skaffe seg nødvendig oversikt. De med nedsatt syn klarer derimot ikke å få med seg det visuelle uttrykket som formidles av struktur og formatering på samme måte.

Hjelpemidlet vil formidle både innholdet, strukturen og formateringen i dokumentet til leseren. Forutsatt at slik informasjon er lagt til innholdet.

Vi skal se nærmere på hvilke hensyn som må tas ved utforming og bruk av: Sidetitler. Lenker. Overskrifter. Bilder. Lister. Tabeller. Rammer. Nedlastbare dokumenter. Javascript.

Illustrasjon: Skjermdump av sidetittelfeltet på en nettside.

Sidetitler

Sidetittelen er leserens første møte med en nettside. Det er denne som vises øverst i vinduet til nettleseren. Ikke bare er dette noe av det første vi ser, men det er også det første en skjermleser vil lese opp når en side besøkes.

Viktige forhold når det gjelder sidetitler: bruk alltid sidetitler på alle sider på nettstedet. sidetittelen må beskrive innholdet på denne bestemte siden. sidetittelen kan også reflektere den aktuelle sidens organisering i

forhold til nettstedet som helhet.

Lenker

Lenker er helt sentralt for internett, og utformingen av disse vil derfor ha stor betydning. Lenken og lenketeksten må kunne brukes uavhengig av hva slags metoder som benyttes for å aktivere lenken, samt leses og forstås uavhengig av sammenhengen lenken står i.

Illustrasjon: Eksempel med to artikler. Overskriten i fet skrift. Begynnelsen av artikkeln i normal sort skrift. ”Les mer ” lenkene er utformet i blått med understrek.Tekst til illustrasjon: Korrekt utforming av ”Les mer” lenker på www.blindeforbundet.no

Hjelpemidler som benyttes av synshemmede identifiserer en lenke, og lister opp alle lenker som befinner seg på en side. Da kan man navigere pr. lenke og slippe å bla gjennom hele siden for å komme til lenken man er ute etter.

Viktige forhold når det gjelder lenker:

Lenker må kunne brukes, enten det er med tastatur eller mus. Dersom du benytter Javascript må du benytte metoder som kan håndteres uavhengig av maskinvaren.

Lenker må kunne leses. Har du for eksempel benyttet et bilde som en lenke, er det viktig at du gir både bildet og selve lenketeksten en fornuftig alternativ beskrivelse.

Lenker må kunne forstås. Optimalt skal en kunne forstå hva lenken vil føre til ved å se på lenketeksten alene.

Lenketekst må være unik, det vil si at du må ikke bruke samme lenketekst på lenker som peker forskjellige steder. Ett typisk eksempel på repeterende lenketekst er ”Les mer”. Når det finnes ti ”les mer”-lenker på en nettside, hvilken av disse er det da som leder til akkurat det du er interessert i? Benytt ”Les mer om ....” som lenketekst.

Bilde: Dataskjerm med tekst og bilder. Overskriften er ringet inn med rødt.

Overskrifter

Overskriftselementer skal brukes for å formidle nettsidens struktur. Nettopp på grunn av dette kan ikke overskrifter undervurderes i forbindelse med tilgjengelighet. Ikke bare kan de gi en svært god oversikt over innholdet på nettsiden, men hjelpemidlene tilbyr opplistingsverktøy som gjør at brukeren, uavhengig av sin plassering på nettsiden, kan hoppe direkte til en overskrift og dermed spare seg for leting med påfølgende navigasjon.

Det finnes seks nivåer for overskrifter: H1-H6, der H1 betegner det øverste nivået og H6 det laveste nivået. H står for det engelske ordet ”heading”. Overskriftene må altså opprettes slik at de følger denne inndelingen. Det er med andre ord ikke gyldig HTML å benytte en overskrift på nivå to uten en forutgående overskrift på nivå en.

Viktige forhold når det gjelder overskrifter: Bruk overskriftstagger når du skal lage overskrifter.

Ikke simuler en overskrift ved å benytte ulike former for formatering, for eksempel fete typer, tekststørrelse, farger også videre på ordinær tekst.

Overskriftene bør beskrive innholdet de faktisk er overskrift for. Hjelpemiddelenes overskriftslister fungerer som en form for innholdsfortegnelse for nettsiden og vil gi god oversikt over siden som helhet. En fin bonus er at Googles søkeroboter også setter pris på dette.

Overskriftene må følge en logisk struktur. Det betyr at overskrift på nivå 1 må komme før overskrift på nivå to osv.

Bilde: Dataskjerm med sterkt forstørret foto av en telefon og en PC.

Bilder

Mange har vansker med å se detaljer i bilder, og andre kan ikke se bilder i det hele tatt. Bilder benyttes til forskjellige formål.

Vi kategoriserer bruk av bilder i tre kategorier: Bilder som formidler et enkelt budskap, for eksempel ikoner og

fotografier som har en direkte sammenheng med innholdet. Bilder som formidler et sammensatt budskap, for eksempel en graf eller

en mer kompleks illustrasjon. Bilder som kun er dekorative og som utelukkende skal gi en visuell

opplevelse, for eksempel bakgrunnsbilder.

De to første punktene dreier seg om bilder som formidler et budskap eller en mening. Siste punkt dreier seg om en ren dekorativ (estetisk) bruk av bilder. I HTML kan bilder ha en egen attributt for å legge til alternative beskrivelser. Hjelpemidler som leser opp nettsider vil da lese opp den alternative beskrivelsen dersom denne er registrert.

Viktige forhold når det gjelder bruk av bilder: Bruk alltid alt-attributtet for bildene på nettsiden. Er bildet av dekorativ art, kan alt-attributtet stå tom (alt=” .) Beskriv alltid bilder som formidler et budskap.

Beskrivelsen av bildet må være presis og ikke for lang fordi dette kan skape støy for en som bruker opplesing for alt innholdet på nettsiden.

Formidler bildet et sammensatt budskap som krever en lengre beskrivelse bør man benytte Longdesc-attributtet slik at denne beskrivelsen kommer på en egen side.

Bilde: Mann som ser på en forstørret liste på en dataskjerm.

Lister

Lister finnes i hovedsak i to varianter. Uordnede lister som ofte kalles ”kulepunkter” og ordnede lister som ofte kalles ”nummererte lister”. Akkurat som med overskrifter tilbyr de fleste hjelpemidler en metode for å gå direkte til (eller hoppe over) lister. I tillegg vil hjelpemiddelbrukeren også få informasjon om hvor mange punkter som finnes i listen, slik at en på forhånd er informert om det som kommer. Lister brukes for å gruppere informasjon som hører sammen. Menyer på nettsteder er et eksempel på informasjon som med fordel kan samles i lister.

Viktige forhold når det gjelder bruk av lister: Bruk ordnede lister dersom det er rang mellom punktene. Bruk uordnede lister dersom det ikke er noen rang mellom punktene.

Bruk stilark for å presentere listene med andre formateringer, for eksempel uten kulepunkter og horisontalt fremfor vertikalt osv.

Tabeller

Tabeller kan være vanskelig å orientere seg i og navigere i for dem som bruker hjelpemidler. Korrekt merking og bruk av overskriftsrader er avgjørende for tilgjengeligheten.

Illustrasjon: Tabell som viser 3 kolonner og 2 rader. Øverste raden i hver sin kolonne står det ”Karakter A”, ”Karakter B” og ”Karakter C”. Nederste raden står det tallene 2, 5 og 4. Tallet 5 er ringet inn med rødt.

En person som leser tabellen over ved hjelp av tale (opplesing) får bare høre tallet 5 når han står i cellen som er merket med rødt dersom det ikke er definert en overskrift for kolonnen. Hvis du definerer raden med ”Karakter A”, ”Karakter B” og ”Karakter C” som overskrifter, vil vedkommende også få opplest at tallet 5 representerer karakteren B.

Noen ganger er det ikke nok med to dimensjoner i en tabell. For å dekke behovet for mer komplekse tabeller setter en ofte inn en tabell i tabellen.

Slike er svært vanskelige å bruke med hjelpemidler fordi det er vanskelig å knytte celleinnhold til en bestemt overskrift.

Illustrasjon: Tabell som viser 3 rader. Øverste raden er delt i tre kolonner og hver sin kolonne står det ”Karakter A”, ”Karakter B” og ”Karakter C”. De to nederste radene er delt i seks kolonner. I annenhver kolonne av den øverste av disse to radene, står det Kvinner, menn, kvinner, menn, kvinner, menn. Nederste raden står det tallene 1, 1, 2, 3, 2, 5. Ordet Menn og tallet 3 er ringet inn med rødt.

I eksempelet over vil det kunne bli utfordrende å forstå at verdien 3 gjelder antallet menn med karakteren B. Jo større og mer kompleks tabellen er jo vanskeligere blir den å forstå og navigere i for en som benytter skjermleser.

Viktige forhold når det gjelder tabeller: Definer alltid kolonneoverskrifter for tabellen. Der det er mulig bør overskrifter for rader defineres. Spesielt gjelder

dette dersom tabellen inneholder mye informasjon med flere kolonner. Unngå komplekse tabeller som bruker tabeller i tabellen. Må du bruke

en kompleks tabell så sørg for å ha en lengre beskrivelse av tabellen like etter tabellen, alternativt lenker du til en egen beskrivelse av tabellen.

Rammer

Vanligvis er en nettside bygget opp av et enkelt HTML-dokument. Rammer kan benyttes når man ønsker å bygge en nettside basert på informasjon i flere forskjellige HTML-dokumenter. Dette er ikke nødvendigvis klart for den som besøker nettsiden. Rammer benyttes sjeldnere og sjeldnere, og undersøkelser viser at rammer ikke gir spesielt god brukervennlighet.

For skjermleserbrukere vil en nettside bestående av rammer ikke oppfattes som en helhetlig side, men som flere separate dokumenter. Rammer er altså ikke sømløst for alle brukere.

Noen hjelpemidler (og nettlesere) gir brukeren mulighet for å vise innholdet i hver enkelt ramme som frittstående sider. Dersom denne muligheten benyttes er det viktig at hvert enkelt HTML-dokument som benyttes i rammer også kan leses som frittstående dokumenter.

Viktige forhold når det gjelder rammer: Rammer må gis navn som beskriver innholdet i rammene. HTML-dokumentet i hver enkelt ramme bør ha en sidetittel. Støtte for at de som ikke kan eller ønsker å bruke rammer også kan

bruke siden.

Skjemaer

Skjemaer benyttes i stor grad, og det finnes et skjemafelt på omtrent hvert eneste nettsted, for eksempel for søk. Som med overskrifter tilbyr hjelpemidler forskjellige mekanismer for å arbeide med skjemafelter på en side.

Illustrasjon: Skjermdump av et skjema fra en nettside.Tekst til illustrasjon: Eksempel på opplisting av skjemafelter i et kontaktskjema. Bildet viser noen obligatoriske felter (markert med *). Det er viktig at skjemaer som inneholder obligatoriske felter tydelig viser hvilke felter som er obligatoriske.

Skal slike verktøy ha noen verdi er det viktig at hvert felt i skjemaet får et unikt navn. Hvis ikke vil feltene ikke bli vist korrekt i slike oversikter. Slike navn gis med HTML-taggen <label>. opplistingsverktøy av skjemafelter.

Når man benytter skjemavalidering for å undersøke om felter er korrekt utfylt er det viktig at tilbakemeldinger til bruker er tydelige på hva som er feil og i hvilke(t) felt det er manglende informasjon.

Ved utforming av skjema må du ta hensyn til følgende forhold: Gi alle skjemafelt en etikett (label).

Denne benyttes av hjelpemidler for å unikt identifisere et felt, og er derfor svært viktig.

Gruppér skjemafelter som hører sammen. Dersom flere skjemafelt hører sammen (for eksempel postadresse) knytt de eksplisitt sammen med <fieldset>-elementet slik at dette oppfattes av hjelpemidlene.

Gjør informasjon om obligatoriske felter tydelig. Her vil ikke bruk av farger alene være tilstrekkelig. Helst bør du gjøre slike indikasjoner som en del av etiketten for feltet.

Sørg for at tilbakemeldinger til brukeren vedrørende validering er tydelige og finnes i umiddelbar nærhet av skjemaet dersom valideringsresultatet skal vises i dokumentet.

Nedlastbare dokumenter

Moderne IKT-hjelpemidler for synshemmede har god støtte for de mest brukte dokumentformatene ODF, DOC/DOCX og PDF , men det er ikke på langt nær alle som har det mest moderne.

Det viser seg at selv om PDF-formatet (Portable Document Format) lagres riktig er det problematisk eller umulig å bruke for synshemmede med hjelpemidler. Det er viktig å presisere at dette ikke er en egenskap ved formatet som sådan, men måten PDF-dokumenter produseres på. PDF blir ofte lagret som et bilde, som det er umulig for en skjermleser å oppfatte. Derfor må dokumenter parallellpubliseres i et tekstformat.

Vil du vite mer om hvordan du kan produsere tilgjengelige dokumenter anbefaler vi deg å besøke nettsidene til Direktoratet for forvaltning og IKT (Difi), www.difi.no. Der finner du en egen veileder for hvordan man skal produsere universelt utformede dokumenter i ulike formater.

Illustrasjon: Skjermdump av en nettside med brosjyre for nedlasting. Det er mulighet for å laste ned både PDF og et word-dokument.Tekst til illustrasjon: PDF-dokumenter må parallellpubliseres i et rent tekstformat.

Javascript

HTML benyttes for å legge til og beskrive innhold på en nettside. HTML kan ikke benyttes for å implementere logikk eller hendelser som skal skje med innholdet som en følge av handlinger som gjøres. Til dette formålet benyttes Javascript i kombinasjon med HTML.

For eksempel benyttes HTML for å utforme et skjema, men javascript benyttes for å kontrollere (validere) om et skjema er korrekt utfylt og eventuelt gi beskjed om hvilke felter som mangler informasjon.

Bilde: Nærbilde av en dataskjerm fylt med datakoder. Foto: istockphoto.com.

Tekst til bildet: Eksempel på programmering i javascript

Javascript kan forbedre brukervennlighet og tilgjengelighet om det er brukt riktig, men det er viktig at man også støtter de som ikke er i stand til å bruke javascript, enten det er på grunn av forhold i nettleseren eller det er forhold til hjelpemiddelet.

Det er ikke javascript i seg selv som er utfordrende for hjelpemiddelbrukere. men bruken av javascript, og da spesielt javascripthendelser. En javascripthendelse kan være noe som skal skje dersom man peker med musen på noe, eller dersom man plasserer skrivemarkøren i et skjemafelt.

Det man må være spesielt oppmerksom på er å ikke benytte hendelser som er knyttet til bruken av en spesifikk maskinvare, for eksempel bruk av mus. Dersom brukerne av en eller annen grunn benytter en annen maskinvare, for eksempel tastatur, vil naturligvis hendelsene som skal utløses når sluttbrukeren utfører slike handlinger ikke bli aktivert. Dermed reduseres brukeropplevelsen, og i verste fall ødelegges den.

Viktige forhold ved bruk av javascript: Sørg for at siden også er anvendelig dersom javascript ikke er støttet av

nettleseren eller i hjelpemiddelet som er i bruk. Dersom du benytter onMouseOver eller OnMouseOut må du kombinere

disse med henholdsvis onFocus og onBlur. Hendelsen onDblClick har ikke noen tilsvarende erstatninger for

tastaturbrukere og bør ikke benyttes.

Bilde: En ung mann ser på en dataskjerm.

Flash, Java og rike internett applikasjoner Selv om de fleste sider på internett i utgangspunktet består av sider utviklet i HTML og CSS er det en økende tendens til å bygge nettsider som ikke oppfører seg som rene dokumenter, men mer som ordinære programmer. Til dette benyttes for eksempel Adobe Flash, Adobe Flex, Adobe Air, Java-applets, Microsoft Silverlight eller AJAX-teknologier.

Uansett valg av teknologi er det viktig å være oppmerksom på at denne typen web-innhold kan medføre store utfordringer, spesielt for blinde og svaksynte som benytter ikt-hjelpemidler som skjermleser og forstørringsprogram. For hjelpemiddelbrukere vil det svært ofte være problematisk å få innholdet lest opp, eller i det hele tatt oppfatte at applikasjonen finnes på nettsiden, og at det er innhold i applikasjonen.

Også for de som ikke bruker spesifikke hjelpemidler kan slikt innhold være en utfordring. Å endre på farger, kontraster, bokstavtyper og størrelser er for eksempel ikke mulig å gjøre gjennom de vanlige innstillingene i

operativsystemet eller i nettleseren. Dette betyr at dersom du lager slike applikasjoner er det viktig at du sørger for at applikasjonen tilbyr funksjoner for å kunne endre på disse forholdene.

Dersom man kan lage applikasjonen gjennom bruk av webstandarder (HTML, javascript og CSS) er dette sterkt å anbefale, fremfor en av de ovennevnte teknologiene. Dersom du allikevel er nødt til å lage applikasjonen din i en av disse teknologiene vil du måtte utvikle disse på en måte som gjør at innholdet blir tilgjengelig for hjelpemiddelteknologier.

Det er utenfor denne publikasjonens område å gå detaljert inn i hvordan man kan utvikle tilgjengelige applikasjoner, og det vil være til dels store forskjeller i fremgangsmåte avhengig av hvilken teknologi man velger å benytte. Undersøk med produsenten hvorvidt det er mulig å lage tilgjengelige applikasjoner, hvilke begrensninger som eventuelt foreligger og hvordan du skal gå frem.

Bilde: En ung mann betaler regninger i nettbanken, Sterkt forstørret skjermbilde.

Presentasjon

Visuell presentasjon og layout bør først og fremst styres gjennom stilark (CSS) og ikke gjennom bruk av formateringer i HTML-dokumentet.

CSS gir mange fordeler. Sett i fra et tilgjengelighetsperspektiv er det kontrollen over det visuelle uttrykket som peker seg ut. Stilark gir mulighet til å overstyre den stilen som er beskrevet i stilarket, med sitt eget stilark eller forhåndsdefinerte stilark via for eksempel plugins og hjelpemidler. Tekststørrelser, fargekombinasjoner og layout er de vanligste elementene som overstyres.

Illustrasjon: Noen teksteksempler med gode kontrasterSvart på hvitt. Hvitt på svart. Gult på svart. Svart på gult. Hvitt på blått. Blått på hvitt.

Farger og kontraster

Kontrast er noe som skiller seg ut fra bakgrunnen. Kontraster hjelper oss blant annet med å fokusere og skille objekter fra hverandre, en avgjørende faktor for at vi skal kunne lese. Hvilke fargekombinasjoner som oppleves som gode kontraster, vil variere fra person til person.

Farger benyttes til å formidle informasjon. Det er lett å tenke at alle ser det samme som en selv, men det er ikke lurt å anta at det du opplever som høy kontrast, oppleves likt for en med en synshemming.

Tilby gjerne ulike stilark for nettstedet som tilbyr ulike farge- og kontrastvisninger av innholdet. Når man trenger raster (bakgrunnsfarge) som et virkemiddel er det svært viktig at man lar det være god kontrast mellom raster og tekst. Metningen må ikke overstige ti prosent.

Dersom farger benyttes for varsling, ikke bruk farger som eneste indikator, men beskriv det også med tekst og/eller ikoner. For eksempel at et manglende felt i et skjema gis en rød farge. Dette er selvsagt problematisk for de som ikke kan se farger.

Skrifttype (font)

En skrifttype kjennetegnes ved at den har lik stil og profil på hvert enkelt tegn (bokstaver, tall og symboler) som finnes for den aktuelle skrifttypen. Noen er utviklet for trykk (på papir), noen for bruk på skjerm og andre er utviklet for begge deler.

For en stor gruppe svaksynte vil rene skrifttyper i den groteske familien (for eksempel Arial eller Verdana, eller gratisfonten Tiresias) være å foretrekke. Dette er skrifttyper uten seriffer, hvor hvert tegn er sammensatt med lik tykkelse (vekt) i streken. Ikke bruk for mange skrifttyper på nettsiden og ikke ta i bruk uvanlige skrifttyper.

Illustrasjon: Bokstaven M gjengitt i en variant med seriffer og en variant uten.Tekst til illustrasjon: Fonter uten seriffer og med jevn tykkelse på alle strekene i bokstavene foretrekkes av svaksynte framfor fonter med seriffer og hårstreker.

Illustrasjon: Et rødt felt med tekst i liten, sort skrift.Tekst til illustrasjon: Teksten til venstre er satt i Times 11p med 16p skytning. Sort tekst på rød eller andre mørke bunnfarger kan være vanskelig å lese.

Illustrasjon: Fonten Tiresias. Tekst i illustrasjonen: Det engelske blindeforbundet (RNIB) har forsket mye påhva som er brukbar skrift for svaksynte. De har utvikletseks fontsett, Tiresias, med spesiell vekt på at de skal kunne benyttes både på papir, skilt og skjerm, samt unngå misforståelser under lesing.Fontsettene er gratis. www.tiresias.org/fonts/index.htm.

Bilde: Nærbilde av en internettside.

Forstørring og skalerbarhet til innhold og tekst

Alle nettlesere og diverse hjelpemidler tilbyr ulike former for forstørring av innhold. Det er derfor viktig at du tenker på at tekst kan bli forstørret når du planlegger layout for nettsiden. Nettsider bør som minimum takle visning av største tekststørrelse i Internet Explorer.

Det bør brukes stilark for å kontrollere nettsidens layout og tekstens størrelse. Det er viktig at stilarket angir størrelser i en form som kan forstørres. Slike relative størrelsesenheter er ”em”, ”%”, og ”XX-small” til ”XX-large”.

Bilde: Flere personer i et rom. De gjennomfører brukertester av nettsider.

Ressurser

Brukertest

Det å gjennomføre brukertester i utviklingsprosessene er uhyre viktig for å sikre at løsningene en har valgt faktisk fungerer slik man har tenkt og ønsker. En brukertest er den sikreste kilden til å avdekke styrker og svakheter ved brukervennligheten. Hensikten med brukertesten er å få reell tilbakemelding fra brukere av tjenesten, for så å bruke resultatene fra testen til å forbedre tjenesten.

Synshemmede har egenerfaring om hvordan det er å være synshemmet internettbruker, og det er de som dermed kan mest om hvordan de opplever løsningene som er valgt. Avdekker en brukertest problemområder anbefales det å innhente profesjonell bistand fra firmaer som kjenner synshemmede, samt krav til universell utforming, deretter teste på nytt. Blindeforbundet har tett medlemskontakt og bidrar gjerne med å finne testpersoner til ulike oppdrag.

Nettsteder hvor du kan teste nettsiders tilgjengelighet.www.egovmon.no/enwave.webaim.orgkvalitet.difi.nowww.snook.ca/technical/colour_contrast/colour.html

Firmaer som kan gi faglig og profesjonell hjelp til testing og produksjon av nettsider og løsninger.www.include.nowww.medialt.nowww.nidelven-it.no

Aktører som kan gi generell informasjon.www.difi.no (Direktoratet for forvaltning og IKT)www.standard.difi.no (Standardiseringsportalen)

www.deltanettet.no (Deltasenteret)www.sn.no (Standard Norge)www.blindeforbundet.no

Bildecollage av: Nærbilde av hender på et tastatur, sterkt forstørret tekst på en dataskjerm, en mann som ser på en utskrift foran en PC:

Logo ExtraStiftelsen Helse og Rehabilitering

Logo Norges Blindeforbund

Sporveisgata 10Postboks 5900 Majorstuen0308 OsloTlf. 23 21 50 00Epost: post@blindeforbundet.nowww.blindeforbundet.no

ISBN  978-82-92998-11-3