Hvorfor fejler tekst på billeder så ofte?
Et foto har sjældent ens lysstyrke under hele tekstblokken. Hvid tekst kan være perfekt læselig over himlen og fuldstændig forsvinde over sneen to centimeter længere nede. WCAG måler kontrasten mod de faktiske pixels bag hvert bogstav — ikke mod gennemsnittet af billedet.
Dit eget herobillede er næste skridt: tjek det gratis i browseren →
Kravene
SC 1.4.3: 4,5:1 for normal tekst, 3:1 for stor tekst (ca. 24 px normal / 18,66 px fed). SC 1.4.11 kræver 3:1 for meningsbærende UI-dele og grafik.
Det værste sted tæller
En gradient kan bestå under halvdelen af bogstaverne og fejle under resten. Mål altid det værste tilfælde — det er dét, en bruger med dårligt syn rammer.
Dine billeder forbliver lokale
Billedet læses og analyseres i JavaScript i din egen browser via canvas-API'en. Intet uploades til nogen server.
Sådan gør du (under et minut)
- Indlæs dit billede i tjekkeren nedenfor — eller vælg Et gradient og skriv de to stopfarver og vinklen fra dit stylesheet ind, så du kan tjekke en `linear-gradient` uden at tage et skærmbillede først. Den starter med en demo-baggrund, så du kan se hvordan den virker, før du tilføjer noget.
- Klik hvor teksten skal stå på billedet, eller træk den derhen. Skriv teksten, og vælg dens farve.
- Læs forholdet. Det er målt mod de lyseste og mørkeste pixels lige bag dine bogstaver — det værste tilfælde, ikke gennemsnittet.
- Justér designet, indtil det består: en semi-transparent skærm, en mørkere udskæring, eller en fast bjælke under teksten.
Værktøjet læser pixels via canvas-API'en og beregner relativ luminans pr. WCAG-specifikationen — samme formel som kommercielle værktøjer bruger. Du får altså samme tal, som en auditor vil måle. Dit billede uploades aldrig.
Prøv det på dit eget billede
Det her er samme værktøj som det separate kontrasttjek, bare kørt lige her — inklusive gradienttilstanden. Intet skal installeres, ingen konto, og billedet bliver i din browser.
Klik hvor som helst på billedet (eller træk) for at placere den valgte tekst. Vælg hvilken med Flyt denne tekst i et resultat. Slip en billedfil her, eller indsæt et med Ctrl+V, for at indlæse det.
Fra ét billede til hele siden
Kontrasttjekket tester ét billede ad gangen — perfekt når du designer en hero eller et banner. Skal hele sitets kontraster tjekkes, brug den gratis Accessibility Scanner: den gennemgår al tekst på en hel URL og finder lavkontrast-tekst sammen med overskrifts-, alt-tekst-, formulær- og tastaturfejl.
Mere kontrast-hjælp
Kontrast-checker tester farvepar · Palette generator bygger tilgængelige paletter.
Læs kontrast-guiden
Guide til selve WCAG-kravene og hvordan du arbejder med dem: WCAG kontrast-checker trin for trin.
Ét kontrasttjek er gratis. En rapport du kan aflevere er ikke.
Billedtjekket og den gratis Accessibility Scanner er gratis for evigt — ingen konto, ingen prøveversion, ingen grænse på hvor mange billeder eller sider du kører gennem dem.
Det du ikke får med de værktøjer er noget, du kan sende til en kunde eller vedlægge en tilgængelighedserklæring: en skriftlig rapport, der også dækker den del af WCAG, kun en server kan se. Pro tilføjer GDPR/cookie- og NIS2/sikkerhedstjekkene og rapporten som en fil, du kan vedlægge.
| Hvad du får | Gratis | EUComply Pro — 79 $ pr. år pr. website |
|---|---|---|
| Kontrasttjek af tekst på billede | ja, ubegrænset antal billeder | med i licensen |
| Sidetjek | tilgængelighedstjekkene — 15 WCAG-regler, kontrast indbefattet | de samme 15 regler |
| Resultat | scoren og karakteren for siden | med i licensen |
| Rapporten | hele rapporten på siden | med i licensen |
| En rapport, du kan vedlægge en mail | — | hele pdf-rapporten som en fil |
| Tjek kun en server kan lave | — | GDPR/cookie- og NIS2/sikkerhedstjekkene — 18 mere, 33 i alt |
Licensen dækker ét website. Hvis du bare skal have kontrasttallet for ét billede, behøver du aldrig betale for noget — det gratis værktøj ovenfor er hele svaret.
Ofte stillede spørgsmål
Hvorfor fejler tekst på billeder så ofte?
Et foto har sjældent ens lysstyrke under hele tekstblokken. Kontrasten kan være fin over de mørke partier og helt væk over de lyse. WCAG måler kontrast mod de faktiske pixels bag hvert bogstav — derfor skal man teste det værste tilfælde, ikke gennemsnittet.
Hvilken kontrast kræves der?
WCAG SC 1.4.3: mindst 4,5:1 for normal tekst og 3:1 for stor tekst (fra ca. 24 px normal eller 18,66 px fed). SC 1.4.11 kræver desuden 3:1 for meningsbærende grafik.
Er værktøjet gratis og sikkert at bruge?
Ja. Billedet analyseres i JavaScript direkte i din browser. Intet uploades til nogen server, og der er ingen grænser eller tilmelding.
Hvad gør jeg hvis jeg ikke består?
Læg en semi-transparent mørk eller lys skærm bag teksten, mørkned/lysnet kun det område hvor teksten står, eller flyt teksten til en fast bjælke under billedet. Test igen indtil alle målinger består.
Værktøjer og guides
WCAG kontrast-checker: sådan tjekker du farvekontrast
Sådan tjekker du farvekontrast mod WCAG 2.1 AA og AAA gratis: indtast to farver, se ratioen med det samme…
Alle gratis værktøjer
Sådan Skriver Du en Tilgængelighedserklæring
Trin-for-trin guide til at skrive en EAA-compliant tilgængelighedserklæring for din hjemmeside: kravene i…
Kopiér ren tekst fra enhver hjemmeside
Du markerer, kopierer, indsætter — og formateringen er pludselig forkert.