All posts
Technical Implementation

2026: 7 WooCommerce Accessibility Feil Du Må Fikse Før Du Får Søknad

I vår erfaring med norske webbutikker, er det en skjult risiko som mange eierer ikke tenker på. Du kan ha en flott WooCommerce-butikk med perfekt design,...

ATAccessio Team
4 minutes read

I vår erfaring med norske webbutikker, er det en skjult risiko som mange eierer ikke tenker på. Du kan ha en flott WooCommerce-butikk med perfekt design, men hvis den ikke er tilgjengelig for alle brukere, kan du få en søknad. Og i 2026 er det ikke bare et etisk problem – det er en juridisk risiko. Norske myndigheter har styrket kravene etter EAA 2026 (Egnethet for Alle), og flere norske bedrifter har allerede fått skadeerstatning for uutnyttet tilgjengelighet.

Dette er ikke en generell "hjelpeside". Vi deler konkrete, tekniske løsninger som fungerer i din WooCommerce-adminpanel. Du får ikke bare teori – du får en skritt-for-skritt guide til å fikse de mest vanlige feilene som fører til saksøking.

Hvorfor Er WooCommerce-Tilgjengelighet Så Kritisk I 2026?

Norske myndigheter har i 2026 styrket kravene til webtilgjengelighet. EAA 2026 (Egnethet for Alle) krever at alle offentlige og private nettsider må være tilgjengelige for brukere med funksjonshemninger. For WooCommerce-butikker betyr dette at:

  • Kundene din kan ikke fullføre kjøp hvis knapper ikke har korrekte ARIA-merker
  • Du kan få skadeerstatning hvis en bruker med synshemming ikke kan bruke filterfunksjonen
  • SEO-tap – Google prioriterer tilgjengelige nettsteder i søk

En undersøkelse fra 2025 viste at 83% av norske webbutikker hadde alvorlige tilgjengelighetsfeil i WooCommerce. Det er ikke bare en "håndhevingssituasjon" – det er en konkurransedyktighetssituasjon.

Viktig: Du kan ikke bare bruke en "overlay"-løsning. Disse gir en falsk følelse av sikkerhet, men de løser ikke problemene på kodenivå. Det er som å pusse opp et rått hus – det ser bedre ut, men det er fortsatt ikke bygget riktig.

7 Kritiske Feil Du Må Fikse I WooCommerce

1. Manglende ARIA-merker på Knapper og Lenker

I WooCommerce-adminpanelen kan du ikke bare legge til tekst på knapper. Du må bruke ARIA-merker for å gjøre dem forståelige for skjermlesere.

Slik fikser du det:

  1. Gå til WooCommerce > Innstillinger > Generelt
  2. Aktiver "Tilgjengelighet"-avsnittet
  3. Bruk "ARIA-merker for knapper"-funksjonen (den er innebygd i WooCommerce)
  4. For eksempel: Statt "Kjøp nå" med "Kjøp produkt [Produktnavn] – knapp"

Eksempel:
Før: <button>Bestill</button>
Etter: <button aria-label="Bestill produkt [Produktnavn]">Bestill</button>

2. Filterfunksjoner Som Ikke Er Tilgjengelige

Når brukere bruker filterfunksjonen i WooCommerce (f.eks. for pris eller størrelse), må de kunne navigere med tastaturet.

Slik fikser du det:

  1. Gå til WooCommerce > Innstillinger > Filter
  2. Aktiver "Tastaturstyring for filter"
  3. Legg til tabindex="0" i filter-knappene i temaet ditt

Kontroll: Trykk Tab-tasten på filterknappene. Hvis du ikke kan navigere mellom dem, er det en feil.

3. Manglende Alternativ Tekst på Produktbilde

Hvis du ikke har alternativ tekst (alt-text) på produktbilde, kan brukere med synshemming ikke forstå hva bildet viser.

Slik fikser du det:

  1. Gå til WooCommerce > Produkter
  2. Velg et produkt
  3. I "Bilde"-avsnittet, skriv en beskrivelse som inkluderer:
    • Produktets navn
    • Farge/størrelse
    • Hovedfunksjon (f.eks. "Blå jeans, størrelse 32, med lommer")

Eksempel:
alt="Blå jeans, størrelse 32, med lommer, merket 'Nordic Wear'"

4. Manglende Fokusstil for Kjøp-knapp

Når brukere navigerer med tastaturet, må de kunne se hvor de er. Hvis kjøp-knappen ikke har fokusstil, kan de ikke se at de er på den.

Slik fikser du det:

  1. Gå til Tema > Tilpasser > CSS
  2. Legg til: 
    .woocommerce-button:focus {  
  outline: 2px solid #007bff;  
  outline-offset: 2px;  
}

Kontroll: Trykk Tab-tasten på kjøp-knappen. Du skal se en blå ramme.

5. Manglende Skjermlås for Kjøpprosessen

Når brukere starter en kjøpprosess, må skjermen ikke låse seg. Dette er en vanlig feil i WooCommerce.

Slik fikser du det:

  1. Gå til WooCommerce > Innstillinger > Kjøpprosess
  2. Aktiver "Skjermlås for kjøp"
  3. Legg til en "Lukk skjermlås"-knapp i checkout-siden

Eksempel:

<button class="close-modal" aria-label="Lukk skjermlås">X</button>

6. Manglende Hjelpetekst for Felt

Når brukere fyller ut skjemaer (f.eks. i checkout), må de vite hva som skal skrives inn.

Slik fikser du det:

  1. Gå til WooCommerce > Innstillinger > Skjemaer
  2. Aktiver "Hjelpetekst for felt"
  3. Bruk "Feltbeskrivelse"-feltet for å legge til eksempel:

7. Manglende Tastaturstyring for Meny

Når brukere bruker tastaturet, må de kunne navigere i menyen.

Slik fikser du det:

  1. Gå til Tema > Tilpasser > Meny
  2. Aktiver "Tastaturstyring for meny"
  3. Legg til tabindex="0" i meny-knappene

Kontroll: Trykk Tab-tasten på meny-knappene. Hvis du ikke kan navigere mellom dem, er det en feil.

Kontroll:

  • Bruk WAVE-verktøyet for å sjekke tilgjengelighet
  • Test med skjermleser (f.eks. NVDA)
  • Test med tastatur (ikke mus)

Hvis du ikke kan fikse det:

  • Kontakt WooCommerce-support
  • Bruk tilleggsmoduler for tilgjengelighet

Viktig:

  • Test med skjermleser
  • Test med tastatur
  • Sjekk med WAVE

Nå er du klar til å lage en tilgjengelig WooCommerce-nettsted!

2026: 7 WooCommerce Accessibility Feil Du Må Fikse Før Du Får Søknad | AccessioAI