I den digitale tidsalderen kan ikke tilgjengelighet neglisjeres. En måte å gjøre det enklere for funksjonshemmede å få tilgang til nettinnhold på er gjennom såkalt alternativ tekst. Denne teksten er utformet for å presentere innholdet på et nettsted på en forståelig måte for personer med spesifikke funksjonshemminger. Men hva er egentlig alternativ tekst? Hvem trenger det? Og hvordan lager man det?
For å gjøre nettsteder og nettinnhold tilgjengelige, er alternativ tekst avgjørende for å legge til rette for tilgang for funksjonshemmede. Den gir informasjon og funksjoner for blinde og svaksynte, samt for personer med fysiske eller kognitive funksjonsnedsettelser. Den hjelper også med å forstå grafikk, bilder og kontroller. Skjermlesere og leselister bruker disse alternative tekstene, noe som gjør disse elementene tilgjengelige for funksjonshemmede.
På den annen side er de også nyttige for søkemotoroptimalisering. Tekstalternativene formidler informasjon om et bilde til søkemotorene. Dette forbedrer synligheten.
Hvordan lager du tekstalternativer?
Svaret på spørsmålet om hvordan man lager alternativ tekst er ganske enkelt: Du setter ganske enkelt inn alternativ tekst i det relevante området av et element som skal inneholde slik tekst. De fleste utviklere bruker dette i et såkalt CMS. CMS står for Content Management System. Dette er programvare som brukes til å lage og administrere webinnhold.
HTML-programmeringsspråket kan også brukes til dette. Det er her alt-attributtet, også kalt alt-taggen, kommer inn i bildet. Det settes inn i img-taggen. Teksten som deretter vises ved hjelp av hjelpeteknologier skrives i alt-attributtet.
Det alene er imidlertid ikke nok. Title-attributtet bør heller ikke glemmes, ettersom noen skjermlesere leser title-attributtet i stedet for alt-attributtet. Derfor er det fornuftig å bruke identisk tekst for begge taggene. Dette tjener også til å vise innholdet som tilleggsinformasjon om et element når musen holdes over det.
I tillegg finnes det attributtet `aria`. Mer presist, attributtet `aria-label` eller attributtet `aria-labelledby`. Disse brukes til å merke knapper eller skjemafelt.
De forskjellige typene bilder
I en stadig mer digitalisert verden er det ikke nok å bare lage alternative tekstalternativer. Det er mye mer effektivt å beskrive de ulike bildetypene nøyaktig, ettersom de også har forskjellige funksjoner. Men disse funksjonene må først identifiseres. Beskrivelser er ubrukelige hvis de ikke formidler et bildes funksjon. Så spørsmålet er: Hvilke typer bilder finnes det? Og hvordan kan de best beskrives?
Først bør man gjøre seg kjent med forskjellene mellom de ulike grafikktypene. Det er viktig å forstå formålet med grafikk. Generelt skilles det mellom informativ, funksjonell og dekorativ grafikk. I tillegg finnes det såkalt tekstbasert grafikk. Beskrivelsen her er veldig enkel; man tar ganske enkelt teksten som vises i grafikken.
Informative bilder
Informative bilder formidler det synlige innholdet i en grafikk gjennom alternativ tekst. Denne teksten fokuserer på informasjon som er relevant for bildets budskap. En logobeskrivelse er et eksempel. Den beskriver kort hvordan logoen ser ut og hvem som laget den.
Følgende eksempel integrerer et tekstalternativ i en logo ved hjelp av HTML:
<img
src="logo.jpg"
alt="Eye-Able-logoen. Den representerer et øye."
title="Eye-Able-logoen. Den representerer et øye."
</img>
Her legges en bildefil inn i HTML ved hjelp av `img`-elementet, der `src`-attributtet angir bildekilden. Bildebeskrivelsen settes i anførselstegn i `alt`- og `title`-attributtene. Dette sikrer at tekstinnholdet «The Eye-Able logo. It represents an eye» sendes ut via en skjermleser eller leseliste.
På denne måten fjernes barrieren, og alle som bruker hjelpeteknologi kan forstå hva som vises i denne grafikken.
Diagrammer
Men hvis det er et diagram, må dette alltid avgjøres individuelt. Dette avhenger ofte av diagramtypen og informasjonen den inneholder. Hvis grafikken bare inneholder noen få detaljer, kan disse inkluderes i den alternative teksten. For eksempel: «Representerer valgresultatene til partiene i et søylediagram. Parti A: 40 %, Parti B: 30 %, Parti C: 20 %, osv.» Men hvis noe mer komplekst eller lengre presenteres, anbefales det å inkludere den detaljerte informasjonen i den påfølgende teksten. Den alternative teksten bør da bare angi diagrammets type og formål. I tillegg kan det bemerkes at en mer detaljert beskrivelse følger nedenfor. Et eksempel ville være en grafikk som viser befolkningstallene i de tyske delstatene. Innholdet ville da lyde: «Representerer befolkningstallene i de 16 delstatene i et søylediagram. Merk: En mer detaljert beskrivelse følger i teksten.»
Funksjonelle bilder
Deretter skal vi se på funksjonelle bilder. Dette er lenket grafikk. De er kategorisert som lenker, elementer eller knapper. Tekstalternativene definerer funksjonen, ikke hva som er synlig. I stedet spesifiserer de hvor lenken fører.
Her er et eksempel i HTML på en lenket grafikk:
<a href=“https://services.eye-able.com/“>
<img src=“logo.jpg“
alt="Synlig hjemmeside"
tittel="Eye-Able hjemmeside"
</img>
</a>
Det samme gjelder symboler. Når for eksempel en diskett brukes, er symbolets utseende irrelevant for skjermleserutdata, ettersom det symboliserer lagringsfunksjonen. Et annet eksempel er søkeikoner. Om det er et forstørrelsesglass eller ikke er irrelevant. Det som er mye viktigere er handlingen bak det. Dette representerer et søkealternativ eller starten på et søk.
Det samme gjelder knapper. En knapp som viser en høyrepil skal aldri ha «høyrepil» i den alternative teksten. For en seende person er det tydelig at et klikk på den åpner neste side, men ikke for blinde. De hører bare «høyrepil» via skjermlesere. Dette er ikke tydelig nok og indikerer ikke at et klikk på knappen åpner neste side. Derfor er det mer fornuftig å bruke alternativ tekst som «neste side» eller «side fremover».
Dekorative bilder
En annen type grafikk er dekorative bilder. Disse brukes til å dekorere et nettsted. Det er veldig enkelt å lage alternativ tekst for disse bildene. Innholdet i den alternative teksten står tomt. Det er viktig at attributtet for alternativ tekst fortsatt er tilstede; bare selve teksten forblir tom. Dette betyr at skjermleseren vil hoppe over denne irrelevante grafikken under utskrift.
Hvordan skriver man god alternativ tekst?
Nå som de ulike grafikkene er presentert, gjenstår bare ett spørsmål: «Hvordan skriver du optimal alternativ tekst?» Når du forstår alle disse nyansene og forskjellene mellom bildene, er det bare noen få regler å følge. Følgende tips kan hjelpe:
- Begynnelsen av en alternativ tekst:
Det er viktig å unngå duplisering. Derfor bør ikke teksten begynne med: «Bildet…», «Grafikk…», «Fotoet…» eller «Lenken…». Skjermlesere vil automatisk gjenkjenne og annonsere om det er grafikk eller lenke, så disse begrepene bør unngås.
Lengde på tekster:
Det finnes ingen fast lengde for alternativ tekst. Imidlertid bør én eller to setninger være tilstrekkelig for å beskrive en grafikk. Ideelt sett bør den være 80 tegn. Hvorfor 80? Blinde leser ofte denne teksten ved hjelp av en leselist. Leselister kan skrive ut mellom 40 og 80 tegn om gangen. For klarhetens skyld anbefales det å holde seg til denne grensen. Teksten kan selvfølgelig være lengre, men den bør ikke overstige 120 tegn.
Staving og tegnsetting:
Riktig stavemåte er avgjørende. Et feilstavet ord kan raskt føre til forvirring, ettersom skjermlesere bare viser alternativ tekst. Riktig grammatikk er like viktig for å forstå bilder. Riktig tegnsetting er også viktig. Feil eller manglende tegnsetting gjør det vanskelig for lyttere å forstå grafikken. Derfor bør en stave- og grammatikkontroll utføres før du setter inn tekst.
Opphavsrett:
Mye grafikk inneholder en opphavsrettserklæring. Men er denne informasjonen viktig for å forstå et bilde? Svaret er: Nei! Denne informasjonen er irrelevant for å formulere effektive tekstalternativer, ettersom en bildebeskrivelse bare bør inneholde de viktigste detaljene. Derfor bør denne informasjonen utelates.
Tilbakemelding:
Det er enkelt å avgjøre om en bildebeskrivelse er vellykket. Men hvordan? Dette spørsmålet er enkelt å svare på. Det krever ikke mye innsats. Kort tilbakemelding fra en blind eller svaksynt person avslører om tekstinnholdet er formulert effektivt. Men ikke alle kjenner noen med en svakhet. Det finnes en annen måte. Alle som ennå ikke har sett bildet, kan bli bedt om tilbakemelding. Dette kan gjøres skriftlig eller per telefon. Så snart positiv tilbakemelding er mottatt, regnes beskrivelsen som vellykket.
Hva skjer egentlig hvis alternativ tekst mangler?
Mangelen på alternativ tekst for bilder kan være spesielt frustrerende for blinde brukere. Dette betyr at de ikke vil kunne forstå innholdet i grafikken. I slike tilfeller vil skjermlesere bare lese filnavnet, for eksempel «img123.jpg». En slik beskrivelse er ikke til hjelp for noen. Utviklere bør derfor alltid bruke tekstbaserte beskrivelser. Det er også viktig å forstå forskjellene mellom bilder og grafikk for å kunne beskrive dem effektivt. Hjelpeteknologier kan deretter bruke disse tekstalternativene til å gi kontekst. Dette gjør internett mer tilgjengelig for alle.
