Hoppa till innehållet
Alla guider

Tillgänglighet i Squarespace: vad som är ditt ansvar

Uppdaterad

Vad Squarespace själva säger att plattformen sköter i webbutiken och vad du måste rätta: alt-text, färger, sidtitlar, språk, egen CSS och kassan.

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).

Squarespace är byggt så att man kan göra en butik utan att skriva kod. Det gör att många räknar med att tillgängligheten sköter sig själv. Vi har läst Squarespace egna hjälpsidor i oktober 2026 för att se vad de faktiskt lovar och vad de lämnar åt butiksägaren. Det som står där citeras inte ordagrant, och allt nedan som gäller Squarespace har en källa sist.

Vad Squarespace säger att de sköter

Squarespace hjälpsida "Make your site accessible with built-in features" räknar upp inbyggda funktioner:

  • En tydlig ram som visas runt länkar och fält när besökaren tabbar sig fram (kriterium Synligt fokus).
  • En länk "Skip to Content" som visas när besökaren trycker Tab, så att menyn kan hoppas över (Hoppa över grupperat innehåll).
  • I färgpanelen går det att välja bakgrund och textfärg så att de enligt Squarespace följer WCAG utan egen CSS.
  • Kassans formulär har enligt Squarespace fält med etiketter som skärmläsare kan läsa, och knappar med beskrivande namn.

Samtidigt skriver Squarespace på samma sida att du själv ansvarar för att webbplatsen följer de lagkrav som gäller din verksamhet, och på sidan Accessibility at Squarespace står att anpassningar ibland gör att slutresultatet inte är helt tillgängligt. Squarespace ger inget juridiskt råd. Hjälpsidan om inbyggda funktioner hänvisar också till Squarespace egen sida Accessibility at Squarespace och till en VPAT (en standardiserad redovisning av hur en produkt förhåller sig till tillgänglighetskrav). VPAT-dokumentet har vi inte läst, så vi kan inte säga vad det innehåller.

Vi hittade ingen hjälpsida där Squarespace anger att en viss mall uppfyller WCAG 2.1 AA, och du ska inte anta det. Fråga Squarespace support om du behöver ett skriftligt besked för din mall.

Det du själv ansvarar för

Mall och färger

Färgerna väljer du i Site styles under Colors. På version 7.1 använder alla sajter en palett med fem färger och tio färgteman för sektionerna; version 7.0 har andra färginställningar. Squarespace skriver att text- och knappfärger ibland väljs vit eller svart för bättre kontrast mot bakgrunden, men att du bör läsa deras råd om tillgänglighet när du väljer färger. Det är alltså fortfarande ditt val som avgör om Kontrast (minimum) och Använd tillräckliga kontraster i komponenter och grafik klaras.

Squarespace skriver att varukorgsikonen inte kan göras större, men att du kan lägga till en ram och se till att kontrasten är tillräcklig. Samma sida föreslår att du formar knappar (form, kantlinjens tjocklek) så att de syns bättre.

Egen CSS lägger du under Custom CSS. Squarespace avråder från att använda CSS till annat än typsnitt, färger och bakgrunder och skriver att deras support inte hjälper till med egen kod. Vår rekommendation: skriv aldrig outline: none i egen CSS, för då riskerar du att ta bort den fokusram Squarespace annars visar.

Produktbilder och alt-text

Alt-text för en produktbild fyller du i genom att öppna butikssidan, hålla över bilden, klicka på ... och välja Edit metadata. Fältet tar upp till 200 tecken. Lägger du ingen text blir produktnamnet alt-text, enligt Squarespace. För Innehåll som inte är text räcker det oftast inte: produktnamnet säger inte vilken färg varianten har eller vad som syns på bilden. Squarespace själva föreslår att du tar med färgen och eventuell text eller tryck på produkten.

Två saker i Squarespace egen text är värda att veta. Sidan om alt-text säger att verktyget SEO report, som kan föreslå alt-text, inte läser bilder som ligger i samlingsobjekt, och på sidorna om sidtitlar räknar Squarespace produkter som samlingsobjekt. Och för vissa bilder utan eget alt-fält, till exempel en sidas huvudbild, används filnamnet som alt-text, så ge filerna beskrivande namn. Läs vår guide Alt-texter för produktbilder för exempel.

Squarespace skriver också att storleksguider (size charts) ofta inte läses av skärmläsare, och föreslår en textbaserad storlekstabell, till exempel med hjälp av en tredjepartstjänst.

Sidtitlar och språk

Du kan ange en SEO-titel per sida och per produkt (inte för startsidan) och ändra mallen för hur titlarna byggs upp under SEO Settings i panelen SEO/AI Visibility. Squarespace rekommenderar högst 70 tecken och en unik titel för varje sida. SEO-titeln får vara högst 100 tecken. Det passar Sidans titel: varje sida ska ha en titel som beskriver den.

Sajtens språk ställer du in under Site Languages (version 7.1). Svenska finns bara på version 7.1 enligt hjälpsidans lista. Språkinställningen styr sajtens inbyggda text och hur datum, tid och valuta formateras. Squarespace säger ingenting om vilket lang-attribut som sätts i sidans kod, som kriteriet Sidans språk gäller. Titta därför efter lang="sv" i sidans källkod.

Rubriker, formulär och länkar

Squarespace uppmanar dig att strukturera texten med rubriker och listor. Det är ditt arbete: använd rubrikformaten i rätt ordning och inte stor fet text (Information och relationer), och skriv länktexter som säger vart länken går (Syftet med en länk (i sammanhanget)). Egna formulär i sektioner och blockdelar behöver ledtexter (Ledtexter/etiketter eller instruktioner).

Kassan

Squarespace skriver att kassasidor inte stöder egen kod (code injection). Du kan alltså inte ändra kassans uppbyggnad själv. Det du kan påverka är inställningarna i panelerna Cart och Checkout, knapparnas utseende och ett eget kassaformulär med extra fält (för gåvomeddelande eller leveransinstruktioner). Fälten i det formuläret bygger du själv, så ge varje fält en tydlig titel och beskrivning. Ett fel i själva kassans kod måste tas upp med Squarespace.

Allt du lägger till utanför det inbyggda, som en chatt, en cookieruta eller en inbäddad widget, är ditt ansvar att testa. De kan skapa fel som Ingen tangentbordsfälla eller knappar utan namn (Namn, roll, värde).

Så kontrollerar du butiken

  1. 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.
  2. Gå igenom checklistan för det testet inte kan se.
  3. Gå igenom köpresan med bara tangentbordet: startsida, kategori, produkt, varukorg, kassa. Tab, Skift+Tab, Enter och Esc räcker. Läs Tangentbord och synligt fokus i webbutiken.
  4. Fyll i ett fält fel med flit i kassan. Kommer ett felmeddelande i text? Läs de vanligaste felen i kassan.
  5. Skriv ned varje fel med sida, element och kriterium.

Vanliga fel att leta efter

  • Produktbilder utan egen alt-text, där bara produktnamnet används.
  • Kontrast som sjunkit efter att du bytt palett eller ändrat färgtema i en sektion.
  • Fokusram som försvunnit efter egen CSS.
  • Knappar och bannertext som ligger på bilder.
  • Samma SEO-titel på flera sidor.
  • Inbäddade tillägg som fångar tangentbordsfokus.
  • Storleksguider som en skärmläsare inte kan läsa.

Nästa steg

Ett fel du inte kan rätta, till exempel i kassans kod, ska du kunna beskriva i din tillgänglighetsinformation tillsammans med hur kunden når dig om något inte fungerar. Kontakta Squarespace support med sida, element och kriterium. Börja med det gratis testet. 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, Magento, Centra, Norce och Abicart.

Källor

Testa din webbutik gratis.

Skriv in adressen så granskar vi startsidan och upp till fyra sidor till och visar de viktigaste bristerna.

Vi hämtar startsidan och upp till fyra sidor till.

Gratis mall för tillgänglighetsinformation

Fler guider om tillgänglighet.