Tillgänglighet
Tillgängliga nyhetsbrev, så skapar du tillgänglig e-post
Ett tillgängligt nyhetsbrev är ett e-postutskick som går att läsa, förstå och agera på även med skärmläsare, förstoring eller nedsatt syn. Det bygger på fyra saker: korrekt rubrikstruktur i koden, tillräcklig kontrast, beskrivande länktexter och alt-texter där bilden bär information.
Den här guiden går igenom vad lagen faktiskt kräver och inte kräver, vilka kontrastvärden som gäller, hur du kodar ett mejl så att skärmläsare läser det i rätt ordning, och hur du testar resultatet innan du skickar. Du får också en checklista att gå igenom före varje utskick.
Vad är ett tillgängligt nyhetsbrev?
Ett tillgängligt nyhetsbrev är utformat så att innehållet når fram oavsett hur mottagaren läser det. Det gäller den som använder skärmläsare, den som förstorar texten till dubbel storlek, den som har nedsatt färgseende och den som läser i starkt solljus på en telefon.
Riktlinjerna kommer från WCAG, Web Content Accessibility Guidelines. I Sverige refereras de via den europeiska standarden EN 301 549, som är den nivå myndigheter mäts mot. Nivå AA är den praktiska ribban i nästan alla sammanhang.
E-post har svårare förutsättningar än webben. Du kontrollerar inte vilken klient mottagaren använder, och stödet för modern kod varierar kraftigt mellan Outlook, Gmail och Apple Mail. Därför byggs layout i e-post fortfarande med tabeller, och därför är den tekniska delen av tillgänglighetsarbetet annorlunda än på en webbplats.
Det goda är att det mesta som gör ett utskick tillgängligt också gör det tydligare. Kortare stycken, en rubrik per avsnitt och ett enda tydligt nästa steg ger fler lästa mejl, inte bara mer tillgängliga.
Vad lagen kräver
Två svenska lagar är relevanta, och de träffar olika verksamheter. Ingen av dem säger rakt ut att ett mejl måste följa WCAG, vilket är värt att veta innan någon påstår motsatsen.
DOS-lagen, offentlig sektor
Lagen (2018:1937) om tillgänglighet till digital offentlig service gäller kommuner, regioner, myndigheter, offentligt styrda organ samt vissa privata aktörer inom exempelvis skola och vård. Kraven uppfylls genom den europeiska standarden EN 301 549, som i praktiken motsvarar WCAG 2.1 nivå AA, och verksamheten ska publicera en tillgänglighetsredogörelse. Myndigheten för digital förvaltning, Digg, utövar tillsyn.
Här finns en avgränsning som ofta missas. DOS-lagen omfattar digital service som tillhandahålls via webbplats eller mobil applikation. Ett nyhetsbrev som landar i inkorgen är alltså inte i sig en teknisk lösning som lagen träffar. Två delar av utskicket omfattas däremot: webbversionen, som är en webbsida, och prenumerationsformuläret, som ligger på er webbplats.
Att lagen inte träffar själva mejlet gör inte tillgängligheten frivillig. Klarspråkskravet i språklagen gäller ändå, och en invånare som inte kan läsa utskicket har inte fått informationen. Vi går igenom hela bilden i guiden om nyhetsbrev för offentlig sektor.
Tillgänglighetslagen, vissa privata tjänster
Lagen (2023:254) om vissa produkters och tjänsters tillgänglighet genomför EU:s tillgänglighetsdirektiv och tillämpas sedan den 28 juni 2025. Den gäller inte privata företag generellt, utan produkter och tjänster riktade till konsumenter inom sex områden: elektronisk kommunikation, bank- och betaltjänster, e-handel, passagerartransport, e-böcker och audiovisuell media.
Det är alltså inte typen av verksamhet som avgör, utan vad ni erbjuder konsumenter. En e-handel omfattas. En byrå som säljer tjänster till andra företag gör det inte. Post- och telestyrelsen är marknadskontrollmyndighet och kan inte ge förhandsbesked, bedömningen gör ni själva.
Mikroföretag är undantagna. Som tjänsteleverantör omfattas ni bara om ni har fler än tio anställda och en årsomsättning eller balansomslutning över två miljoner euro. Ligger ni under gränserna gäller kraven inte er. För produkter finns i stället en bedömning av om kraven medför en oproportionerligt stor börda.
Oavsett vilken lag som träffar er finns ett skäl som väger tyngre i praktiken. Enligt SCB har omkring tolv procent av befolkningen i arbetsför ålder en funktionsnedsättning, och andelen är högre bland äldre. Räknar man in tillfälligt nedsatt läsförmåga, en sprucken skärm eller starkt solljus blir gruppen betydligt större. De syns aldrig i statistiken som något annat än uteblivna klick.
Den här guiden är allmän information och inte juridisk rådgivning. Bedömningar enligt tillgänglighetslagstiftningen behöver göras utifrån er egen verksamhet.
Checklista före utskick
Tolv punkter att gå igenom innan du trycker på skicka. De första sex tar minuter, de sista sex är sådant du sätter en gång i mallen.
- Ämnesrad som säger vad utskicket handlar om
- En H1 överst, därefter H2 och H3 i ordning
- Kontrast på minst 4,5:1 för brödtext
- Länktexter som beskriver målet, aldrig "klicka här"
- Alt-text på bilder som bär information
- Tom alt-text på rent dekorativa bilder
- Ingen viktig text inbakad i en bild
- Färg används aldrig som enda bärare av information
- Språk och titel satta i mejlets kod
- Layouttabeller märkta så att de hoppas över
- Länk till webbversion högt upp
- Textversion som följer med utskicket
Struktur och rubriknivåer
Skärmläsare navigerar med rubriker. En användare som vill hitta rätt hoppar mellan rubrikerna i stället för att lyssna igenom hela brevet, ungefär som du skummar med ögonen. Fungerar inte rubrikerna finns ingen genväg alls.
Tre regler räcker långt:
- En H1 per utskick, och den ska säga vad brevet handlar om
- H2 för varje huvudavsnitt, H3 för underavsnitt inom ett H2
- Hoppa aldrig över en nivå, alltså inte H2 direkt till H4
Viktigast av allt: en rubrik ska vara en riktig rubrik i koden, inte fetstilt brödtext i större grad. Det ser likadant ut på skärmen och är helt osynligt för skärmläsaren. Det här är det enskilt vanligaste tillgänglighetsfelet i nyhetsbrev.
Läsordningen i koden ska dessutom följa den visuella ordningen. Bygger du en tvåspaltig layout läses vänster kolumn först i de flesta klienter, men inte alla. Har innehållet en logisk ordning som spelar roll är en spalt säkrare än två.
Text som går att läsa
Tillgänglig text är kort, konkret och uppdelad. Det är samma sak som bra text, med några tillägg.
- Sätt det viktigaste först, både i brevet och i varje stycke
- Håll radlängden runt 50 till 75 tecken, det är där ögat orkar
- Vänsterjustera. Marginaljusterad text skapar ojämna ordmellanrum som försvårar för den som har dyslexi
- Skriv ut förkortningar första gången de används
- Undvik versaler i löpande text, skärmläsare kan tolka dem som initialer och stava dem bokstav för bokstav
Textstorlek är inget lagkrav, men praxis är tydlig. Använd minst 16 px för brödtext och minst 14 px i sidfoten. Sätt aldrig storleken i punkter eller procent i e-post, stödet är för ojämnt mellan klienter. Radavståndet bör ligga runt 1,5 gånger textstorleken.
Skriver du för kommun eller myndighet gäller dessutom klarspråkskravet, som är ett eget hantverk. Vill du fördjupa dig i innehåll och upplägg finns en samlad guide till bättre nyhetsbrev.
Färg och kontrast, med värden
Här är den vanligaste luckan i tillgänglighetsråd om e-post. "Bra kontrast" säger ingenting. Det finns mätbara värden, och de är enkla att kontrollera.
| Vad | Lägsta kontrast |
|---|---|
| Brödtext mot bakgrund | 4,5:1 |
| Stor text, från 24 px eller 18,7 px fet | 3:1 |
| Knappar, ikoner och grafik som bär information | 3:1 |
| Logotyp och rent dekorativ grafik | Inget krav |
Kontrollera värdet med ett kontrastverktyg innan färgerna sätts i mallen, inte efteråt. Kravet gäller alla tillstånd, så en knapp som byter färg när muspekaren ligger över den måste klara 3:1 i båda lägena.
Färg får aldrig vara den enda bäraren av information. "Det röda erbjudandet gäller till fredag" fungerar inte för den som inte ser skillnad på rött och grönt. Lägg till ord, ikon eller placering.
Samma sak gäller länkar. Att bara färga en länk blå räcker inte, eftersom skillnaden mot brödtexten kan vara omöjlig att se. Understryk länkar i brödtext.
Länkar och knappar
En skärmläsare kan lista alla länkar i ett mejl, lösryckta från texten runt omkring. Det är därför "klicka här" är ett problem: i den listan står tolv identiska rader utan innebörd.
Skriv i stället vad som händer efter klicket. "Läs hela guiden", "Se priser för 2026", "Anmäl dig till kickoffen den 14 september". Länktexten ska fungera ensam.
- Undvik att länka en naken URL, den läses upp tecken för tecken
- Bryt inte en länktext mitt i en mening, den blir svår att träffa och svår att förstå
- Gör knappar av text och bakgrundsfärg, inte av bilder. En bildknapp försvinner helt när bilder blockeras, vilket är standard i flera klienter
- Håll klickytan runt 44 px hög, det är praxis för att fungera med motoriska svårigheter på pekskärm
- Har du flera länkar till samma mål, ge dem samma text
Ett brev bör dessutom ha ett tydligt huvudsteg, inte fem konkurrerande. Mer om hur du formulerar det finns i guiden om call to action i nyhetsbrev.
Bilder, alt-texter och emojis
Alt-texten är det skärmläsaren läser upp i stället för bilden. Den är också det mottagaren ser när bilder är blockerade, vilket är vanligare än de flesta tror.
Så skriver du en alt-text
Beskriv bildens funktion, inte dess utseende. En bild på en produkt i ett kampanjutskick har funktionen att visa vad erbjudandet gäller, alltså räcker "Vinterjacka i marinblått". Är bilden en knapp beskriver du handlingen, inte grafiken.
- Håll den under ungefär 125 tecken
- Börja aldrig med "bild på", det är underförstått
- Upprepa inte text som redan står bredvid bilden
- Är bilden rent dekorativ, sätt tom alt-text så att skärmläsaren hoppar över den. Att utelämna attributet helt är inte samma sak, då kan filnamnet läsas upp i stället
Text i bilder
Lägg aldrig kärnbudskapet i en bild. Det går inte att förstora, inte att markera, inte att läsa upp och försvinner när bilder blockeras. Behöver text ändå ligga i bilden ska samma budskap finnas i brödtexten intill.
Emojis
En emoji läses upp med sitt namn. Tre eldsflammor i en ämnesrad blir "eld eld eld", vilket är både förvirrande och långsamt. Använd högst en, och placera den sist så att den inte skjuter undan det viktiga i inkorgens förhandsvisning. Fler råd om det finns i guiden om att skriva ämnesrader som öppnas.
Rörelse och blinkande
Undvik animerade bilder som blinkar mer än tre gånger per sekund. Det kan utlösa anfall hos ljuskänsliga personer och är ett uttryckligt krav i WCAG. En GIF som loopar oändligt är dessutom svår att läsa förbi.
Koden bakom, det skärmläsaren möter
Fyra tekniska detaljer avgör det mesta. Ligger de rätt i mallen behöver du aldrig tänka på dem igen.
Märk layouttabeller som presentation
E-post byggs med tabeller för att hålla ihop layouten. En skärmläsare tolkar däremot en tabell som data och börjar läsa upp rader och kolumner. Attributet role="presentation" på layouttabeller säger åt den att hoppa över strukturen och bara läsa innehållet. Utan det blir ett vanligt nyhetsbrev en uppläsning av ett rutnät.
Sätt språket
Ett svenskt mejl utan språkattribut läses upp med engelskt uttal. Sätt lang="sv" i mejlets kod. Det tar sekunder och gör hela skillnaden för uppläsningen.
Ge mejlet en titel
Titelelementet är det första skärmläsaren annonserar när brevet öppnas. Saknas det börjar uppläsningen mitt i innehållet utan sammanhang.
Riktiga tabeller ska ha rubrikceller
Visar du faktisk data, till exempel priser eller tider, ska tabellen ha rubrikceller så att skärmläsaren kan koppla varje värde till sin kolumn. Håll den enkel, undvik sammanslagna celler och sätt aldrig fast bredd.
Mörkt läge
Allt fler läser e-post i mörkt läge, och flera klienter inverterar färger automatiskt. Det som var svart text på vitt blir vit text på mörkgrått, och kontrasten du räknade fram gäller inte längre.
Tre saker gör mallen robust:
- Använd logotyper och ikoner med genomskinlig bakgrund, annars uppstår en vit ruta mitt i det mörka brevet
- Undvik ren svart text. Mörkt grått inverteras mjukare
- Sätt aldrig text ovanpå en bild utan att kontrollera hur det ser ut inverterat
Kontrollera alltid mörkt läge i ett testutskick. Det är en av få saker som inte går att bedöma i förhandsgranskningen.
Så testar du utskicket
Sex kontroller som tillsammans tar en kvart. Gör dem på ett skarpt testutskick, inte i förhandsgranskningen, eftersom vissa funktioner aktiveras först vid utskick.
Läs upp brevet
Använd VoiceOver på Mac och iPhone eller NVDA på Windows, som är gratis. Lyssna igenom hela mejlet med skärmen avstängd. Det du inte förstår med bara ljud är det som behöver rättas.
Blockera bilderna
Stäng av bildvisning i klienten och läs om brevet. Framgår budskapet fortfarande? Syns knapparna? Det här avslöjar text som gömts i grafik.
Mät kontrasten
Kontrollera brödtext, knappar och all text som ligger på färgad platta mot värdena i tabellen ovan.
Förstora till 200 procent
Zooma in i mejlklienten. Bryts layouten, försvinner text utanför kanten eller hamnar knappar utom räckhåll?
Slå på mörkt läge
Öppna samma utskick i mörkt läge på telefonen och kontrollera logotyp, ikoner och kontrast.
Läs textversionen
Öppna brevets textversion separat. Den ska innehålla samma budskap och samma länkar, inte en tom rad med en webbadress.
Så gör du i Paloma
Det mesta ovan sätter du en gång i mallen och slipper sedan tänka på. Här är var funktionerna finns i Palomas verktyg för nyhetsbrev.
Layoutläget
Bygg grundstrukturen med sidhuvud, innehåll och sidfot. När du växlar till layoutläge byts "Innehåll" mot "Layout" i inställningspanelen, och där kommer du åt bakgrundssektioner och layoutsektioner.
Innehållsläget
Här justerar du utseendet per modul: text, ramar, utfyllnad, marginaler och bakgrunder. Låser du inställningarna medan du redigerar mallen behåller återkommande utskick samma struktur automatiskt.
Teckenformat under Inställningar
Sätt standardutseendet för brödtext, rubriker och länkar en gång. De översta typsnitten i listan är webbsäkra, vilket gör att brevet återges likadant i fler klienter. Det är här du sätter textstorlek och radavstånd så att de gäller varje utskick.
Tabellstruktur
Palomas tabeller är märkta för skärmläsare och optimerade för olika enheter. Justerar du dem i avancerat läge, håll strukturen enkel, lägg till kolumnrubriker där det behövs och undvik fast bredd.
Läsordning
Ordningen på innehållet i koden motsvarar den visuella ordningen, vilket ger en konsekvent uppläsning oavsett vilken hjälpmedelsprogramvara mottagaren använder.
Textversion och webbversion
En textversion genereras automatiskt i koden för varje utskick. Webbversionslänken lägger du till genom att infoga en länk och välja länktypen Länk till webbversion, eller med knappen Webbversionslänk i ett tomt textfält. Länken aktiveras först i skarpa utskick, så den är inte klickbar i förhandsgranskningen.
Vill du börja från något som redan sitter finns färdiga mallar för nyhetsbrev med tydlig läsordning och god kontrast från start, och en genomgång av hur du skapar nyhetsbrev steg för steg.
Vanliga misstag
Sex fel återkommer i nästan varje granskning.
- Fetstil i stället för rubrik. Ser ut som en rubrik, finns inte för skärmläsaren
- Hela erbjudandet som en enda bild. Snyggt i designverktyget, tomt när bilder blockeras
- Ljusgrå text på vitt. Ser luftigt ut och klarar sällan 4,5:1
- "Läs mer" tolv gånger. Ger en länklista utan innebörd
- Alt-text som upprepar rubriken bredvid. Samma sak sägs två gånger
- Avregistreringslänken i 10 px grått. Ett tillgänglighetsfel och ett leveransproblem, eftersom den som inte hittar länken markerar utskicket som skräppost i stället. Mer om det i guiden om leveransbarhet
Skickar du olika innehåll till olika grupper är det dessutom lättare att hålla varje utskick kort och tydligt. Läs mer om segmentering och om hur det hänger ihop med resten av arbetet i guiden om e-postmarknadsföring.
Tillgänglighetsredogörelse
Omfattas ni av DOS-lagen ska ni publicera en tillgänglighetsredogörelse. Den beskriver hur väl webbplatsen eller applikationen uppfyller kraven, vilka brister som finns, varför de finns och när de ska vara åtgärdade. Den ska också innehålla en kontaktväg för den som stöter på ett hinder, samt information om hur en anmälan görs.
Redogörelsen avser er webbplats och era appar, inte utskicken i sig. Däremot bör den täcka de sidor som utskicken leder till, alltså webbversionen av nyhetsbrevet och prenumerationsformuläret. Det är också där de flesta faktiska hindren sitter.
Att redovisa en brist är inte ett misslyckande, det är vad lagen faktiskt begär. Redogörelsen ska hållas aktuell och ses över minst en gång om året.
Vanliga frågor om tillgängliga nyhetsbrev
Vad är ett tillgängligt nyhetsbrev?
Ett e-postutskick som går att läsa, förstå och agera på även med skärmläsare, förstoring eller nedsatt syn. Det kräver korrekt rubrikstruktur i koden, kontrast på minst 4,5:1 för brödtext, beskrivande länktexter och alt-texter på bilder som bär information.
Måste nyhetsbrev vara tillgängliga enligt lag?
Delvis. För kommuner, regioner och myndigheter gäller DOS-lagen, men den omfattar webbplatser och applikationer, inte mejlet i sig. Webbversionen av utskicket och prenumerationsformuläret omfattas däremot. För privata verksamheter gäller tillgänglighetslagen sedan den 28 juni 2025, men bara inom sex uppräknade områden som e-handel, bank och e-böcker, och bara för aktörer med fler än tio anställda och över två miljoner euro i omsättning. Den träffar alltså långt ifrån alla företag.
Vilken kontrast krävs i ett nyhetsbrev?
Enligt WCAG 2.1 nivå AA gäller 4,5:1 mellan brödtext och bakgrund. För stor text, alltså från 24 px eller 18,7 px fet, räcker 3:1. Samma 3:1 gäller knappar, ikoner och grafik som bär information. Logotyper och rent dekorativ grafik har inget krav.
Hur testar jag om mitt nyhetsbrev är tillgängligt?
Skicka ett skarpt testutskick till dig själv och gör sex kontroller: lyssna igenom brevet med VoiceOver eller NVDA, blockera bilderna, mät kontrasten med ett kontrastverktyg, förstora till 200 procent, slå på mörkt läge och läs textversionen separat. Det tar ungefär en kvart.
Behöver dekorativa bilder alt-text?
Nej, men de ska ha ett tomt alt-attribut. Då hoppar skärmläsaren över bilden helt. Utelämnar du attributet i stället kan filnamnet läsas upp, vilket är sämre än ingenting.
Fungerar emojis med skärmläsare?
De läses upp med sitt namn, så tre likadana i rad blir en upprepning som stjäl tid och sammanhang. Använd högst en och placera den sist i ämnesraden, så att det viktiga syns först i inkorgens förhandsvisning.
Vilken textstorlek bör jag använda?
WCAG anger ingen minsta storlek, men praxis är minst 16 px för brödtext och minst 14 px i sidfoten, med ett radavstånd runt 1,5 gånger textstorleken. Ange storleken i pixlar, eftersom stödet för punkter och procent varierar mellan e-postklienter.
Varför ska layouttabeller märkas med role presentation?
E-post byggs med tabeller för layout, men en skärmläsare tolkar en tabell som data och börjar läsa upp rader och kolumner. Attributet talar om att tabellen bara håller ihop designen, så att uppläsningen går rakt på innehållet.
Vad är en tillgänglighetsredogörelse?
Ett dokument som offentliga verksamheter ska publicera enligt DOS-lagen. Det beskriver hur väl webbplatsen eller applikationen uppfyller kraven, vilka brister som finns och när de ska åtgärdas, samt hur en användare kontaktar er eller gör en anmälan. Den bör täcka de sidor som utskicken leder till, och ska ses över minst årligen.
Skapa tillgängliga nyhetsbrev utan att koda
Mallarna har rätt rubrikstruktur, läsordning och kontrast från start. Du byter ut innehållet och skickar. Vill du hellre se verktyget först bokar vi en genomgång i stället.
Skapa gratis kontoPaloma är en svensk plattform för nyhetsbrev, SMS-utskick, event och marketing automation. Verktyget har stöd för tillgängliga utskick med korrekt rubrikstruktur, automatisk textversion och tabeller märkta för skärmläsare, och används i dag av 1 500 företag, föreningar och organisationer. All data lagras på servrar inom EU och supporten svarar på svenska.
