Gør din Shopify-webshop tilgængelig: en praktisk guide
5. juni 2026
Kort svar. Shopify lægger et godt fundament, men leverer ikke en tilgængelig webshop "ud af boksen". De fleste fejl sidder i dit tema, dit indhold og dine apps — og netop dem kan du ofte løse på tværs af hele temaet på én gang. Gennemgå de seks punkter nedenfor (kontrast, alt-tekster, overskrifter, apps, tastatur, sprog), og du har taget hånd om langt størstedelen.
Hvorfor er Shopify alene ikke nok?
Et Shopify-tema er en skabelon. Om din side overholder WCAG, afhænger af, hvordan temaet er bygget, hvilke farver du valgte, hvilke apps du installerede, og hvordan du udfyldte dine produkter. To shops på samme tema kan altså score vidt forskelligt. Den gode nyhed: fordi meget går igen via temaet, dækker én rettelse ofte hundredvis af sider.
1. Tjek din farvekontrast
Den mest almindelige fejl. Gå i dit dashboard til Online Store → Themes → Customize → Theme settings (tandhjul) → Colors, og sørg for, at tekst og baggrund har mindst 4,5:1 i kontrast (3:1 for stor tekst). Vær særligt opmærksom på knaptekster, prislabels, links — og på teksten på din Add to cart-knap. Indstil det rigtigt én gang, og det gælder i hele butikken. Se farvekontrast: WCAG-kravet, og hvordan du måler det.
2. Giv dine produktbilleder alt-tekster
Gå til Products, klik på et produkt og scrol ned til Media → klik på
billedet → Add alt text. Beskriv kort og faktuelt, hvad der er på billedet
(fx "Sort herresko i ruskind med snørebånd"), ikke marketingsprog. Begynd med dine
bedst sælgende produkter og dine forside-bannere. Dekorative billeder får en
tom alt (alt="").
3. Tjek din overskriftsstruktur
Brug overskrifter i logisk rækkefølge (H1 → H2 → H3) og ikke kun til layoutet. I Shopify-editoren ser du overskrifterne i dine sektioner og rich text-blokke; spring ikke niveauer over.
4. Hold øje med dine apps
Det er ofte den største kilde til problemer. Apps til anmeldelser, chat, pop-ups og filtre injicerer deres egen kode — jævnligt via iFrames eller Shadow DOM — i dit tema, og den indeholder regelmæssigt knapper uden navn, forkert ARIA eller elementer, der ikke kan betjenes med tastaturet. Installér derfor ikke blindt enhver app, og test altid din side med apps aktive. Viser en app sig at være utilgængelig, så skift til et alternativ, der faktisk respekterer WCAG-standarderne.
5. Test med tastaturet
Prøv at bruge din side helt uden mus: kun med Tab-tasten og Enter. Kan du nå alt — menu, filtre, indkøbskurv, betaling — og kan du hele tiden se, hvor fokus er? Mange mennesker navigerer på den måde, og det afslører hurtigt barriererne.
6. Tjek din sprogindstilling
Sørg for, at dit tema sætter det rigtige sprogattribut, så en skærmlæser vælger den
rigtige udtale. Gå til Themes → Actions (⋯) → Edit code, åbn
layout/theme.liquid, og tjek, at <html>-tagget indeholder sprogvariablen:
<html lang="{{ request.locale.iso_code }}">. Shopify klarer det som regel fint,
men tjek efter, hvis du bruger oversættelses-apps.
Almindelige Shopify-fejl og deres løsning
| Shopify-element | Almindelig fejl | Løsningen |
|---|---|---|
| Knapper | for lys skrift på "Gå til kassen"-knappen | kontrast i temaindstillingerne op på mindst 4,5:1 |
| Produktbilleder | filnavn som beskrivelse (product_v2.png) | tilføj funktionel alt-tekst via Media |
| Indkøbskurv-pop-up | luk-kryds (X) uden label | aria-label="Luk indkøbskurv" i templaten |
| Tilgængeligheds-app | at installere en overlay-widget | undgå den — den reparerer ikke din kode og beskytter ikke mod krav |
Hjælper en tilgængeligheds-app fra Shopify App Store?
Nej. Søger du i App Store på "accessibility", finder du dusinvis af apps, der lover at gøre din shop compliant med ét klik via en widget. Lad dig ikke narre: de reparerer ikke dit grundtema, og tilsynsmyndigheder kontrollerer din shops rå kildekode. At løse det strukturelt i dit tema og indhold er den eneste vej, der holder — og det giver dig oven i købet bedre SEO og hurtigere indlæsningstid. Læs mere i hvorfor en overlay-widget ikke beskytter dig.
Overholder min Shopify-shop dermed loven?
Disse seks punkter dækker størstedelen af det, en automatiseret test kan konstatere, men "at overholde" rækker videre: det afhænger af dit samlede tema, dine apps og dit indhold tilsammen. Om European Accessibility Act gælder for dig, kan du gennemgå i vores tjekliste. Og vær opmærksom: en overlay-app løser ikke det her — den reparerer ikke din temakode.
Hvordan finder jeg ud af, hvor min Shopify-shop står nu?
Den hurtigste vej: scan én side gratis. Du ser for hvert fund, hvad der er galt, og hvordan du løser det — og fordi meget går via dit tema, løser du det ofte på én gang for hele din butik. På under 60 sekunder, uden konto.