Praktisk compliance-guide for Shopify-butikker og bureauer: hvad European Accessibility Act kræver, hvor Shopify-butikker typisk fejler, og hvilke retter du kan lave uden at røre kode.
Opdateret august 2026 · 7 minutters læsning
Enhver Shopify-butik der sælger til EU-forbrugere er omfattet af European Accessibility Act, som har gældt siden 28. juni 2025 (fristen for nye tjenester: 28. juni 2026). Det gælder dropshipping, print-on-demand og D2C-mærker. Det tekniske benchmark er EN 301 549 / WCAG 2.1 niveau AA, og håndhævelsen er national: tilsynsmyndigheder kan kræve afhjælpning, suspendere ikke-compliante tjenester og udstede bøder. For butiksindehaveren er den praktiske risiko dog mere nærliggende: accessible butikker konverterer bedre, rangerer bedre og kræves i stigende grad af indkøbere og markedspladser.
E-handel med forbrugsvarer og -tjenester er eksplicit nævnt i EAA. Salg til EU udløser reglerne — der kræves intat EU-etablering.
Tilgængelighedsretter overlapper tungt med konverteringsoptimering: læsbar tekst, synligt fokus, keyboard-venlige flows, tydelige fejlbeskeder.
Amerikanske ADA-kravbreve citerer i stigende grad WCAG uanset platform. En EAA-compliant butik er også meget sikrere dér.
De fleste tilgængelighedsfejl kommer fra fire kilder: temakvalitet, apps, butikkens eget indhold og den hostede checkout du ikke fuldt styrer.
Gamle eller tunge tilpassede temaer har kontrastfejl (lysegrå udsalgsbadges), ikonknapper uden labels og manglende fokus-stile. Gratis standardtemaer som Dawn er et markant bedre udgangspunkt end de fleste betalte temaer.
Hver app injicerer sine egne widgets — review-popups, upsell-slidere, chat-bobler. De skiber rutinemæssigt duplikerede ID'er, unlabelled kontroller og keyboard-fælder. Hver app skal tjekkes for sig.
Produktbilleder uden alt-tekst, "køb nu"-linkspams, overskrifter brugt som styling i stedet for struktur. Største volumenkategori på de fleste butikker.
Shopifys hostede checkout er stort set uden for din kontrol. Den lever rimeligt godt op til basisstandarderne; din pligt er læselig branding (ingen lavkontrast-farver) og accessible cart/drawer-flows i dit tema.
Moderne Online Store 2.0-temaer eksponerer de fleste mekaniske retter som indstillinger:
| Område | Hvad du gør |
|---|---|
| Tekst og farve | Forøg tekststørrelsen og mørk farven til kontrasten klarer 4,5:1 overalt — tjek announcement bar, udsalgsbadges og footer separat |
| Alt-tekster | Udfyld alt-tekst på produktbilleder i admin (varianter arver); dekorative billeder får tom alt="" |
| Fokus og bevægelse | Behold fokus-outline via :focus-visible; slå autospillende carousels fra eller giv pause-knap |
| Navigation | Mobilmenu åbner ved tryk og lukkes med Escape; rigtige nav-elementer; skip-to-content i header.liquid |
Redigerer du Liquid-skabeloner, så gå denne tjekliste igennem én gang pr. tema:
Formularlabels: nyhedsbrevsblokke og søgefelder renderes ofte som placeholder-only inputs. Tilføj rigtige <label>-elementer koblet via for/id — WCAG 3.3.2 og en af de mest almindelige scannerfund.
Ikonknapper: cart-toggle, antal-trin, luk-ikoner skal have aria-label. En knap der kun render'er et SVG er usynlig for hjælpemiddelteknologi.
Duplikerede ID'er: section rendering i loops gentager ofte id="Section-...". Det bryder label-kobling og skærmlæsernavigation.
Overskrifthierarki: én h1 pr. side. Sektionkomponenter må ikke hardkode h2, når de allerede ligger inde i en komponent der emitter én.
Announcement bars og modals: dismissible, tilgængelige med tastatur, korrekt fokus-fældning mens de er åbne, og fokus returneres ved lukning.
To Shopify-specifikke skridt de fleste guider springer over:
App-audit: list alle installerede apps der renderer kundevendt UI. Fjern dem du ikke aktivt bruger (de loader stadig scripts). Tab gennem hver resterende apps widget på en live side: når du noget uden synligt fokus eller label, så omkonfigurér eller udskift appen. Undgå overlay-/tilgængeligheds-apps som compliance-strategi — de gør ikke butiken compliant, og flere europæiske forbrugerorganer har offentligt kritiseret dem.
Checkout-konfiguration: vælg logo/farvekombinationer der passer kontrastkravene, skriv meningsfulde sidetitler, og test hele rejsen (kurv → checkout → kvittering) kun med tastatur.
Dokumentér: publicér en tilgængelighedserklæring med conformansstatus, kendte begrænsninger (fx en specifik app) og en kontaktkanal. Under EAA er det forventet, ikke valgfrit.
En realistisk verificeringsloop for en Shopify-butik tager en halv dag:
Trin 1 — automatisk scanning af forsiden, en kollektionsside, et produkt, søgeresultater og cart-drawer. Forvent 5-20 mekaniske fund første gang.
Trin 2 — ret og genscan tema-indstillinger og Liquid-fejl til de automatiske fund er væk.
Trin 3 — keyboard-gennemgang af browse → læg i kurv → checkout-start. Alt der kræver mus er en fejl under WCAG 2.1.2.
Trin 4 — skærmlæser-spotcheck af ét produktflow med VoiceOver eller NVDA — lyt efter unlabelled kontroller.
Trin 5 — kør igen efter hver temaoopdatering og ny app. Regressioner kommer lydløst med opdateringer.
Ja for e-handel med forbrugertjenester, også mikrovirksomheder — i modsætning til flere andre EAA-kategorier er der ingen generel small-business-befrielse for webshops. Byrden skalerer med størrelse, men pligterne findes.
Platformen leverer compliant infrastruktur og fornuftige standardtemaer, men det er butiksindehaveren, der ansvar for sit konfigurerede tema, sit indhold og sine apps. Juridisk ligger ansvaret hos den, der leverer tjenesten til forbrugeren.
Nej. Overlays ændrer DOM'en efter load og kan ikke rette kontrast i billeder, ødelagte flows eller indholdsproblemer. Flere europæiske forbrugermyndigheder har frarådet at markedsføre dem som compliance. Ret årsagerne i stedet.
De tælles med som en del af din tjeneste. Gennemgå hver apps kundevendte grænseflade ligesom dit tema, og udskift apps hvis leverandøren ikke vil rette tilgængelighedsfejl.
En butik på et vedligeholdt OS 2.0-tema: 1-3 dage til indstillinger, alt-tekster, Liquid-retter og test. Butikker på gamle vintage-temaer skal som regel have et temaskift, og det er det større projekt.
Relateret: Overlays og EAA · Pris på tilgængelighedsgennemgang · WCAG 2.2-ændringer