Gjør Shopify-butikken din tilgjengelig: en praktisk guide
5. juni 2026
Kort svar: Shopify legger et godt grunnlag, men leverer ikke en tilgjengelig nettbutikk "rett ut av boksen". De fleste feilene sitter i temaet ditt, innholdet ditt og appene dine, og nettopp de kan du ofte fikse for hele temaet på én gang. Gå gjennom de seks punktene nedenfor (kontrast, alt-tekster, overskrifter, apper, tastatur, språk), så har du tatt hånd om brorparten.
Hvorfor er ikke Shopify alene nok?
Et Shopify-tema er en mal. Om nettstedet ditt oppfyller WCAG, avhenger av hvordan temaet er bygget, hvilke farger du valgte, hvilke apper du installerte og hvordan du fylte ut produktene dine. To butikker på samme tema kan derfor score helt forskjellig. Den gode nyheten: fordi mye går igjen via temaet, dekker én fiks ofte hundrevis av sider.
1. Sjekk fargekontrasten din
Den vanligste feilen. Gå i dashbordet til Online Store → Themes → Customize → Theme settings (tannhjul) → Colors, og sørg for at tekst og bakgrunn har minst 4,5:1 i kontrast (3:1 for stor tekst). Vær spesielt oppmerksom på knappetekster, prisetiketter, lenker, og på teksten på selve Add to cart-knappen din. Still det inn riktig én gang, så gjelder det i hele butikken. Se fargekontrast: WCAG-kravet og hvordan du måler det.
2. Gi produktbildene dine alt-tekster
Gå til Products, klikk på et produkt og scroll ned til Media → klikk på bildet →
Add alt text. Beskriv kort og faktisk hva bildet viser (f.eks. "Svart herresko i
semsket skinn med skolisser"), ikke markedsføringsspråk. Begynn med bestselgerne dine og
bannerne på forsiden. Dekorative bilder får en tom alt (alt="").
3. Sjekk overskriftsstrukturen din
Bruk overskrifter i logisk rekkefølge (H1 → H2 → H3), og ikke bare for utseendet. I Shopify-editoren ser du overskriftene igjen i seksjonene og rich text-blokkene dine; ikke hopp over nivåer.
4. Hold øye med appene dine
Dette er ofte den største kilden til problemer. Apper for anmeldelser, chat, popups og filtre injiserer sin egen kode, jevnlig via iFrames eller Shadow DOM, i temaet ditt, og den inneholder regelmessig knapper uten navn, feil ARIA eller elementer som ikke kan betjenes med tastaturet. Ikke installer enhver app i blinde, og test alltid nettstedet ditt med appene aktive. Viser en app seg å være utilgjengelig, bytt til et alternativ som faktisk respekterer WCAG-standardene.
5. Test med tastaturet
Prøv nettstedet ditt helt uten mus: bare med Tab-tasten og Enter. Når du fram til alt, meny, filtre, handlekurv, kasse, og ser du hele tiden hvor fokuset er? Mange navigerer på denne måten, og det avslører raskt hindringene.
6. Sjekk språkinnstillingen din
Sørg for at temaet ditt setter riktig språkattributt, slik at en skjermleser velger
riktig uttale. Gå til Themes → Actions (⋯) → Edit code, åpne layout/theme.liquid
og sjekk at <html>-taggen inneholder språkvariabelen:
<html lang="{{ request.locale.iso_code }}">. Shopify ordner dette som regel fint, men
sjekk det ekstra når du bruker oversettelses-apper.
Vanlige Shopify-feil og hvordan du fikser dem
| Shopify-element | Vanlig feil | Fiksen |
|---|---|---|
| Knapper | for lys skrift på "Gå til kassen"-knappen | kontrast i temainnstillingene opp til minst 4,5:1 |
| Produktbilder | filnavn som beskrivelse (product_v2.png) | legg til funksjonell alt-tekst via Media |
| Handlekurv-popup | lukkekryss (X) uten label | aria-label="Lukk handlekurven" i malen |
| Tilgjengelighets-app | å installere en overlay-widget | unngå den, den reparerer ikke koden din og beskytter ikke mot krav |
Hjelper en tilgjengelighets-app fra Shopify App Store?
Nei. Søker du i App Store på "accessibility", finner du dusinvis av apper som lover å få butikken din til å oppfylle kravene med ett klikk via en widget. Ikke gå på det: de reparerer ikke grunntemaet ditt, og tilsynsmyndighetene kontrollerer den rå kildekoden til butikken din. Å løse det strukturelt i temaet og innholdet ditt er den eneste veien som holder, og det gir deg attpåtil bedre SEO og raskere lastetid. Les mer i hvorfor en overlay-widget ikke beskytter deg.
Oppfyller Shopify-butikken min dermed loven?
Disse seks punktene dekker størstedelen av det en automatisert test kan fastslå, men "å oppfylle kravene" går lenger: det avhenger av hele temaet ditt, appene dine og innholdet ditt samlet. Om European Accessibility Act gjelder for deg, finner du ut i sjekklisten vår. Og merk deg: en overlay-app løser ikke dette, den reparerer ikke temakoden din.
Kjører du en chatbot i butikken, for eksempel Shopify Inbox? Da treffer EU AI Act fra 2. august 2026 også butikken din: kunden din må ved første kontakt vite at det er en AI de chatter med. Hvilken merking du slår på hos hvilken leverandør, står i chatbotens AI-merking per leverandør.
Hvordan vet jeg hvor Shopify-butikken min står nå?
Den raskeste måten: skann én side gratis. Du får se per funn hva som er feil og hvordan du fikser det, og fordi mye går via temaet ditt, løser du det ofte for hele butikken på én gang. På under 60 sekunder, uten konto. Skann siden din gratis.