Til hovedindhold
Seviranta
← Tilbage til bloggen

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-elementAlmindelig fejlLøsningen
Knapperfor lys skrift på "Gå til kassen"-knappenkontrast i temaindstillingerne op på mindst 4,5:1
Produktbillederfilnavn som beskrivelse (product_v2.png)tilføj funktionel alt-tekst via Media
Indkøbskurv-pop-upluk-kryds (X) uden labelaria-label="Luk indkøbskurv" i templaten
Tilgængeligheds-appat installere en overlay-widgetundgå 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.