Tiltak i Museum24

Redusert bruken av semantiske/landmark html-elementer slik som header, nav, main og footer, slik at brukes av disse blir nyttige for de som navigerer sidene basert på disse. Samtidig er rekkefølge på elementene inni header justert slik at rekkefølgen blir mer logisk og nyttig. Diverse feil-bruk av WAI-aria-attributter i header og hovednavigasjon er også utbedret, se eget punkt om dette.

Eks

• Dersom logo er sammensatt av flere elementer (svg + tekst) så slås dette sammen til en felles lenke
• ​Navigasjonsti er flyttet
• Foreløpig uløst eller ikke optimalt løst: kombo av konsolidert logo og egen logo (rekkefølge etc.)

Systemet støtter innlegging av alternative tekster på alle mediaelementer, primært tenkt brukt til bilders alt-attributt. Det er jobbet med finjusteringer i koden knyttet til hvorvidt angitte alt-tekster faktisk skal brukes samt gjort endringer i forhold til fallback-løsninger dersom alt-tekst ikke er redaksjonelt angitt. 

• ​Alt-tekster hentes bevisst ikke ut dersom bildet inngår som en del av en lenke (kort, klikkbar banner)
• Dersom alt-tekst ikke er angitt på gjeldene språk hentes ingen alt-tekst ut (dvs. andre språk eller andre data-felter (eks tittel) benyttes ikke da dette ikke gir mening for bruker)
• Det hentes altså ikke ut noe "falback" alt-tekst fra bildets tittel, undertekst el. fordi disse ikke skrevet for å være en alt-tekst.
• For DM-kort droppes alt-tekst tilsvarende som for m24-kort dels fordi alt-tekst ikke er nødvendig på kort (=lenker) og dels fordi vi har ikke noe annen tekst å hente enn dm-kortenes tittel og da ender man opp med den samme teksten lest opp to ganger i en skjermleser.
• Tomme bildeelementer i bildeløse-bannere er fjernet (disse var bare unødvendige og manglet også alt="" atributt
• Mulig å oppfriske alt-tekst via banner-editor (redaksjonelt) da systemet pt. ikke automatisk gjør dette.

For mer komplekse mediatyper slik som film og lyd, må alternativt innhold på tilbys som egne artikler eller liknende.

• Innført mulighet til å redaksjonelt stille tittelnivå i bannere, slik at hovedbanner f.eks kan fungere som overskrift 1 (h1), når siden starter med en banner.
• Mulighet for å angi et overskriftsnivå 1 selv om dette ikke er visuelt synlig og ingen bannere logisk vil være overskrift 1 (typisk på forisden). Støtteklasse som "sr-only" må påføres modul.
• Fjernet bruk av h1 i forbindelse med nettstedsnavn i header for de med tekstbaserte logoer
• ​Bannere og kort blir dyttet fra h2 til h3 dersom de er omsluttet av en h2 i form av en seksjonstittel eller modultittel. I tillegg er det mulighet til å manuelt styre tittelnivå for hver og en banner, eller for alle kortene i en kortmodul.
• Fjernet en del uheldig bruk av f.eks h3 til slik som stikktitler eller andre steder der bruk av dette oftest bare ga feil overskriftstruktur.
• Midlertidig fjernet overskrift-tagger på personmoduler da det er vanskelig å avgjøre hvilket nivå de skal ha. Vil gjenninføres når personer i fremtiden vises via personutlistingsmoduler.  Overskriftnivå er behold dersom personer vises via kortmoduler (hvilket er mulig i dag).

Feil overskriftnivåer pga formatering av slike inne i tekstfelter (brødteks/bannere) må utbedres redaksjonelt.

Knapper som fremstår som iconer uten tekst har får norske titler (aria-labels) for norsk nettsted. For alle andre språk vil engelske titler benyttes, men da med riktig språkkode (lang="en") angitt på disse knappene slik at skjermlesere leser opp tekst på engelsk.

Eksempler

• ​Hamburgermeny-knapp (mobil)
• Åpne/lukkeundermeny (mobil)
• Knapper for: fullskjerm, åpne lukke bokser, piler, spill av, pause osv.
• SVG-logoer  (tekst kan angis redaksjonelt)

Det er gjort tiltak i grunndesign for å tydeliggjøre bedre hva som er lenker.

• Piler og bevegelse (ved hover/fokus) innført i bannere som er klikkbare i sin helhet
• Understreking av lenker i bannere, korttitler, footer og navigasjonssti er satt som standard i grunndesign, slik at det ikke kun er farge som identifiserer en lenke.
• Funksjonelle knapper (piler etc) som havner over mediaelementer el. har fått en bedre kontrast.

Utover dette vil hvert enkelt museum måtte påse at farger som brukes på lenker/knapper gir tilstrekkelig kontrast mot bakgrunn. Et generelt grep som bør vurderes av de fleste er å unngå bruk av transparente knapper (ghost-knapper) over mediabakgrunner og overlay-menyer over hovedbannere (på forsider).

Mange tiltak er gjort både i kode og grunndesign for å bedre støtte for tastaturnavigasjon.  

• Innført skip-lenke (se eget punkt)
• Bedre rekkefølge på elementer i header (logo , meny osv)
• ​Tydeligere visuell markering av aktivt element (lenker/knapper, inputfelter) i grunndesign. Her vil nytt grunndesign og evnt tilpasninger i eget design kunne bidra ytterligere.
• Riktig relasjon mellom input-ledetekster og inputfelter

Alle paragrafer som man tangerer inn på her

• 2.1.1 : Mulig å betjene: tastatur
• 1.3.2 : Mulig å tilpasse: meningsfull rekkefølge
• 1.3.1 : Informasjon og relasjoner
• 2.4.1: Hoppe over blokker
• 2.4.3:  Fokusrekkefølge
• 2.4.6: Overskrifter og ledetekster
• 2.4.7: Synlig fokus

• Innført knapper for å stoppe bevegelser, eks slideshow i bakgrunn av bannere, selvgående media-slideshow eller karuseller.
• Også jobbet med kontrast og tekster (aria-labels) på slike knapper
• For video er det mulig med standard video-avspiller-kontrollere fra før, men dersom kontroller ikke vises vil en enkel stop/start-knapp nå vises.

Merk at redaksjonelt innhold (tekst/knapper) som ligger over bevegelig innhold sannsynlig kan utløse andre problemer (kontrast 1.4.3).

Alle sider i Museum24-nettsteder vil starte med en "skip-lenke" som er synlig for skjermlesere og ved tastaturnavigasjon (tab) slik at man kan hoppe over header-element og rett til sidens hoveddel.

• 2.4.1 Betjene: Mulig å hoppe over blokker​

Utbedring av en del ugyldig bruk av Wai-aria attributter (hjelp til skjermlesere) i malverket.

• ​Få bukt med ugyldig bruk av aria-expanded i header og i kort/tekstbokser. 
• Få bukt med en del ugyldig "role"-atributter i hovednavigasjon. Går bort fra role-bruk og over til semantisk html <nav>
• Fjernet tomme eller dupliserte nav-landmarks

Merk
Kodeforbedret header må ses på pr. nettsted da museenes egne stilsett ofte forutsetter noe feilbruk av aria-expanded knyttet til hovedmenye. Man må dermed gå over til en header 2.0 (nettstedsinnstillinger for superadmin) parallelt med at man får gjort små justeringer i eget stilsett eller ifbm med overgang til nytt basestilsett. 

Noen nettsteder har også stilsett som forutsetter aria-expanded i kort. Disse nettstedene må midlertidig få beholde slik feil kode frem til dette er endret i deres egne stilsett. Dette unntaket kan man angi under nettstedsinnstillinger (kun superadmin).

• Bannere: Settes en standard overlay (filter) over bilder i bannere slik at man (trolig) får tilstrekkelig kontrast på tekst/lenker.
• Bannere: Mulighet til å hente alt-tekst på nytt fra galleri via knapp i bannere (midlertidig pga dataoppfriskningsfeil)
• Innføring av ledetekster (labels) over søkefelter (3.3.2), og ditto fjerning av placeholdertekstert
• Bedre koding av html-tabeller, iframes ol.  (1.3.1)
• Sikre at skjemaer er i henhold (status-beskjeder, tastatur-navigasjon, fokusindikasjon osv.)
• Tekstfelt innført for å kunne navngi grafiske lenker i footer:konsolidert modul.
• Tekstfelt innført for å kunne angi konsolidert navn som ren tekst (brukes som aria-label på konsolidert svg logo f.eks). Gjelder footer:konsolidert-modul