Beskriv prosjektbilder etter hva de forteller.
Alt-tekst er ikke et sted for en rekke søkeord. Den skal formidle bildets relevante innhold eller funksjon. På en arkitektnettside kan et bilde vise et romlig prinsipp, en materialovergang eller forholdet mellom et bygg og omgivelsene.
En god beskrivelse er ofte kort. Hvis et bilde har en utfyllende bildetekst rett ved siden av, trenger ikke alt-teksten å gjenta alt. Hvis bildet er rent dekorativt og ikke tilfører informasjon, kan det ha tom alt-tekst. Valget avhenger av bildet i akkurat denne sammenhengen.
| Situasjon | Mindre nyttig | Mer nyttig |
|---|---|---|
| Prosjektfotografi | «Arkitektur, hus, moderne design» | «Stue med trepanel og store vinduer mot en skjermet gårdsplass» |
| Fasadedetalj | «Foto 05» | «Møte mellom mørk teglfasade og inntrukket vindusnisje» |
| Prosjektkort som lenke | «Se bilde» | Bruk et tydelig prosjektnavn som tilgjengelig lenketekst |
| Rent dekorativt motiv | Lang, overflødig beskrivelse | Tom alt-tekst når bildet ikke tilfører informasjon |
Hvis det samme bildet fungerer som lenke til en prosjektside, må lenkens navn også være forståelig uten bildet. Test hva en skjermleser eller bare en lenkeliste faktisk formidler.
Plantegninger må kunne forstås uten å tyde mikroskopisk tekst.
En plantegning som fungerer i en trykt presentasjon, kan bli nesten uleselig på mobil. Fjern unødvendige lag, gjør viktige romnavn tydelige, og unngå å legge all forklaringen inn i et stort rasterbilde.
Når tegningen inneholder viktig informasjon, bør den få en kort tekst ved siden av. Beskriv for eksempel hvor inngangen ligger, hvordan de viktigste rommene er organisert, og hvilken forbindelse som finnes til uteområdet. En kort alt-tekst kan identifisere tegningen, mens en lengre forklaring i vanlig HTML gir detaljene.
Alt-tekst: «Plantegning av en enetasjes bolig med atrium.»
Tekst ved tegningen: «Oppholdsrommene ligger langs gårdsrommets sør- og vestside. Soverommene er samlet i en mer lukket fløy. Inngangen leder inn til et felles oppholdsareal med utgang til atriet.»
Dette forklarer romlige relasjoner som ikke alle kan lese ut av linjer og symboler alene.
Oppgi om et bilde viser et bygget prosjekt, en illustrasjon eller et forslag. Status og forfatterkreditering er ikke bare porteføljedetaljer; de gir også nødvendig kontekst for den som ikke kan tolke alle bildene.
Minimalistisk design er ikke det samme som svak lesbarhet.
Arkitektsider bruker ofte lys grå skrift, svært små etiketter og tekst over store fotografier. Det kan fungere i en designskisse, men blir sårbart mot skiftende bildebakgrunner, mobilskjermer og redusert syn.
Bruk reell tekst fremfor tekst bakt inn i et bilde når det er mulig. Kontroller kontrasten mot hele området bak teksten, ikke bare mot én rolig del av fotografiet. For WCAG 2.2 på nivå AA er referanseverdiene normalt minst 4,5:1 for vanlig tekst og 3:1 for stor tekst, med nærmere unntak i standarden. Tallene må testes mot de faktiske fargene i designet.
La brukeren forstørre teksten uten at innhold forsvinner. Sørg for tydelige overskrifter i riktig rekkefølge, god linjeavstand og en skrifttype som er lesbar også i liten størrelse. Et prosjekt kan fortsatt presenteres med romslig typografi og store bilder.
Et raskt kvalitetsspørsmål
Kan en besøkende lese prosjektbeskrivelsen når skjermen er smal, teksten er forstørret og bildet bak overskriften har en lys himmel? Hvis svaret er nei, er det selve presentasjonen som må justeres.
Test mobilvisningen, ikke bare en nedskalert skrivebordsside.
På en smal skjerm er rekkefølgen viktig. En lang bildegalleri-sekvens kan flytte prosjektets viktigste fakta langt ned. Legg prosjektstatus, type og en kort introduksjon tidlig, og bruk bilder som faktisk kan lastes inn på mobil uten unødvendig store filer.
Bevegelse kan tilføre liv, men bør ikke være nødvendig for å få med seg innhold. Respekter brukerens innstilling for redusert bevegelse. Video som viser et prosjekt, trenger et meningsfullt alternativ når den formidler informasjon som ikke allerede finnes i teksten eller bildene.
Ta hensyn til berøringsflater på menyer, galleri og filtre. Test også skjermen i liggende format, med større tekst og dårligere nettforbindelse. En animasjon som fungerer på en rask datamaskin, kan oppføre seg helt annerledes på en telefon.
Bruk denne sjekklisten før publisering.
- Alle meningsbærende prosjektbilder har relevant alt-tekst eller en tilgjengelig tekstforklaring.
- Rent dekorative bilder får ikke unødvendige opplesninger.
- Plantegninger har lesbar informasjon og en forklaring på romlige forhold ved behov.
- Tekst og kontroller har tilstrekkelig kontrast i de faktiske situasjonene de brukes.
- Overskriftsnivåer, lenker og skjemafelt er forståelige uten visuell gjetting.
- Alle funksjoner kan nås og brukes med tastatur, og fokus er synlig.
- Mobilvisningen tåler større tekst og smalere bredde uten tap av viktig innhold.
- Galleri, animasjoner og video tar hensyn til tilgjengelighet og redusert bevegelse.
- Kontaktfunksjonen er testet med faktiske innsendinger.
Automatiske verktøy finner bare deler av tilgjengelighetsproblemene. Kombiner gjerne maskinell kontroll med tastaturtest, lesbarhetskontroll og testing med hjelpemidler. En slik sjekkliste er heller ikke en fullstendig samsvarsvurdering mot WCAG.
Se W3Cs veiledning om tilgjengelige bilder og WCAG 2.2 for krav og mer detaljerte eksempler. Guiden her er en praktisk introduksjon til arkitektporteføljer, ikke en juridisk vurdering av hvilke plikter som gjelder for et bestemt nettsted.