Tillgänglighet i Centra: ansvaret ligger i din front end

24 oktober 2026Uppdaterad 26 oktober 2026

Centra är headless, så tillgängligheten avgörs av din egen front end. Vad Centra dokumenterar om alt-text och kassa, och hur du kontrollerar butiken.

Det här är teknisk vägledning och inte juridisk rådgivning. För tolkningsfrågor om Lag (2023:254) om vissa produkters och tjänsters tillgänglighet, vänd dig till Post- och telestyrelsen (PTS).

Centra skiljer sig från de flesta butiksplattformar. Det finns inga färdiga teman att välja mellan, bara ett öppet startprojekt (mer om det nedan). Centra beskriver sig själva som en headless-plattform, och butiken som kunden ser byggs av märket eller en byrå ovanpå Centras API. Det betyder att frågan "är Centra tillgängligt?" saknar ett enkelt svar. Plattformen levererar data, och tillgängligheten avgörs av den front end som byggts. Vi har läst Centras egna sidor i oktober 2026. Det som står där återges med egna ord, och källorna finns sist.

Vad Centra säger att de erbjuder

På sin sida om att byta till Centra skriver företaget att man kan använda moderna front end-tekniker utan begränsningar, och uppmanar kunden att gå igenom butikens stil, innehåll och navigering tillsammans med sin front end-partner. Storefront API beskrivs på centra.dev som ett GraphQL-gränssnitt som hjälper utvecklare att bygga butiker, med varukorg, kassa, betalleverantörer, fraktval och skatteberäkning.

Vi hittade ingen sida hos Centra som beskriver hur plattformen förhåller sig till WCAG. Varken Storefront API-dokumentationen, kassaguiden, sidan om migrering eller README-filen till deras öppna startprojekt nämner tillgänglighet. Supportsidan om mediebiblioteket nämner däremot EU:s tillgänglighetsregler som skäl till alt-textfältet och ber butiken kontakta sin front end-byrå så att texten hamnar i img-taggen. Vi har inte gått igenom hela webbplatsen, så en tillgänglighetsredovisning kan finnas på annat håll. Säger en byrå eller leverantör att er Centra-butik är tillgänglig, be om det skriftligt: vilken version av WCAG, vilka sidor och när testet gjordes.

Det som ligger i din front end

Nästan allt som en besökare ser och använder är din butiks egen kod. I praktiken gäller det:

Rubriker, listor och landmärken (Information och relationer).
Kontraster i text, knappar och fält (Kontrast (minimum) och Använd tillräckliga kontraster i komponenter och grafik).
Tangentbordsstyrning av meny, filter, produktgalleri och varukorg (Tangentbord).
Synligt fokus (Synligt fokus) och en länk för att hoppa förbi menyn (Hoppa över grupperat innehåll).
Sidtitlar som ändras när besökaren går mellan sidor (Sidans titel).
Språkattribut på varje språkversion (Sidans språk).

Centra har ett öppet startprojekt, Storefront accelerator, som är byggt med Next.js och släppt under MIT-licens. Centra skriver själva att det inte täcker all funktionalitet och att det kan användas som referens eller som utgångspunkt. Om din butik bygger på det projektet ärvde du dess kod, men inget i dokumentationen säger att koden har granskats mot WCAG. Behandla den som vilken annan kod som helst och testa resultatet.

Produktbilder och alt-text

Centra har ett inbyggt fält för alt-text på produktmedia. Enligt Centras supportsida sätts det i mediebiblioteket under General, kan läggas in i bulk genom export och import, och exponeras i Checkout API, Shop API och Storefront API. Samma sida säger att möjligheten att översätta alt-texten är på väg men inte klar (när vi läste sidan). För en svensk butik som säljer på flera språk betyder det att du behöver kontrollera hur alt-texterna hanteras i varje språkversion.

Fältet finns, men det är ditt team som fyller i det och din front end som skriver ut det i alt-attributet. Kontrollera båda ledden: att texterna finns i Centra, och att butikens bildkomponent faktiskt använder dem. Annars blir alt-texten tom eller ett filnamn (Innehåll som inte är text). Läs vår guide Alt-texter för produktbilder för exempel på hur en bra text ser ut.

Kassan

Centras kassa-API ger data och åtgärder för varukorg, rabattkoder, adress, fraktval och betalning. Dokumentationen beskriver inte ett färdigt kassagränssnitt, utan visar hur utvecklaren hämtar och skickar uppgifter. Det talar för att kassans formulär, felmeddelanden och stegindikering bygger din front end, och då är de ditt ansvar.

Betalningen kan hanteras på olika sätt. Centras kassasida räknar upp betalningsplugins, bland andra Adyen Drop-in, Kustom Checkout, Klarna Payments, Qliro One, PayPal Commerce och Stripe (två varianter, båda märkta beta när vi läste sidan). Vissa betalningar visas i en inbäddad ruta eller på leverantörens egen sida, där adressen i vissa fall fylls i först efter betalningen. Den delen styrs av leverantören och din front end tillsammans. Du kan inte anta att den uppfyller kraven. Testa den med tangentbord och skärmläsare, och fråga leverantören om dess tillgänglighetsredovisning.

Gå igenom kassan särskilt för fel som visas i text (Identifiering av fel), fält med synliga etiketter (Ledtexter/etiketter eller instruktioner) och meddelanden som en skärmläsare får höra när varukorgen uppdateras (Statusmeddelanden). Läs även de vanligaste felen i kassan.

Språk

Centra tar upp flera språk och valutor i sin guide om att byta till Centra, och Selection innehåller ett fält för språk. Vilket lang-attribut sidan får är dock en fråga för front end. Har butiken en svensk, en engelsk och en norsk version ska varje version ha rätt språk i sidans kod, och enstaka citat på ett annat språk ska markeras.

Så kontrollerar du butiken

Kör det gratis testet på butik.nightwave.se/tillganglighet. Det läser källkoden på upp till fem sidor och hittar bland annat bilder utan alt-text, knappar utan namn och fält utan etikett. Det kontrollerar inte kontrast, synlig fokus eller tangentbordsnavigering.
Gå igenom checklistan för det som testet inte kan se.
Gå igenom köpresan med bara tangentbordet: startsida, kategori, produkt, varukorg, kassa, bekräftelse. Tab, Skift+Tab, Enter och Esc räcker. Läs Tangentbord och synligt fokus i webbutiken.
Testa filter, storleksval och produktgalleri särskilt. Headless-butiker laddar ofta om delar av sidan utan att byta sida, och då måste fokus och skärmläsaren följa med.
Skriv ned varje fel med sida, element och kriterium.

Vanliga fel att leta efter

Alt-text som finns i Centra men inte skrivs ut på sidan.
Filter och storleksval som bara går att använda med mus.
Fokus som försvinner när innehåll laddas om, till exempel efter att en vara lagts i varukorgen.
Varukorgssidofält som öppnas utan att fokus flyttas dit, eller som inte går att stänga med Esc.
Samma sidtitel på alla sidor i en butik som byter innehåll utan sidladdning.
Felmeddelanden i kassan som bara markeras med färg.

Nästa steg

Börja med det gratis testet och en genomgång med tangentbord. Fel i butikens egen kod går att lämna till byrån som byggt den, med sida, element och kriterium. Fel i en betalleverantörs ruta tas upp med leverantören. Den som vill ha löpande kontroll kan läsa om abonnemanget på butik.nightwave.se/tillganglighet. Det är teknisk granskning mot WCAG, inte juridisk rådgivning.

Vi har liknande genomgångar för Shopify, WooCommerce, Wix, Quickbutik, Squarespace, Magento, Norce och Abicart.

Källor

Läst oktober 2026.