Kontrollerad den 2026-09-01 · https://www.spiegel.de/
1 kritiskt hinder · dessutom 4 att kontrollera.
Hur beräknas poängen? (100 startpoäng)
| 21 knapp(ar) utan namn i HTML-koden | -18 |
| 1 formulärfält utan igenkännbar märkning | -7 |
| 3 länk(ar) utan igenkännbart namn i HTML-koden | -7 |
| Ingen <h1>-rubrik i den levererade HTML-koden | -7 |
| 5 CSS-regeln med möjligen för låg textkontrast | -7 |
| Resultat | 54 / 100 |
Möjlig att uppfatta
1 formulärfält utan igenkännbar märkning
Kontrollera om det finns ett aria-label som satts via JavaScript.
<input name="suchbegriff" id="search-input-field" placeholder="Seite durchsuchen ...">
Det här bör du göra: Koppla varje fält till ett <label for>-element eller ange aria-label / aria-labelledby. Enbart en placeholder räcker inte.
5 CSS-regeln med möjligen för låg textkontrast
Krävs: 4,5:1 (normal) respektive 3:1 (stor text). Vid ”antagen sidbakgrund” kunde den faktiska bakgrunden inte fastställas säkert — kontrollera i webbläsaren vid tveksamhet. Hittat bland annat: `.text-shade-base`: #989694 auf #ffffff (Standard) (Seitenhintergrund, angenommen) = 2.95:1 · `.debug.svelte-1x5iokp`: red auf #ffffff (Standard) (Seitenhintergrund, angenommen) = 4.00:1 · `.text-effi-primary-base`: #e64415 auf #ffffff (Standard) (Seitenhintergrund, angenommen) = 4.04:1 · `.text-shade-dark`: #807e7c auf #ffffff (Standard) (Seitenhintergrund, angenommen) = 4.04:1 · `.text-elf-primary-base`: #3c8771 auf #ffffff (Standard) (Seitenhintergrund, angenommen) = 4.29:1
.text-shade-base, .debug.svelte-1x5iokp, .text-effi-primary-base, .text-shade-dark, .text-elf-primary-base
Det här bör du göra: Gör textfärgen mörkare eller bakgrunden ljusare tills respektive minimivärde uppnås. Använd aldrig färg som enda särskiljande kännetecken.
Hanterbar
21 knapp(ar) utan namn i HTML-koden
Knappar utan text och utan aria-label är stumma för skärmläsare — om inte namnet sätts via JavaScript.
<button class="bg-white flex items-center justify-around bg-white d><button class="bg-white flex items-center justify-around bg-white d><button><button class="flex items-center justify-center my-auto rounded-cir>
Det här bör du göra: Lägg till knapptext eller ange aria-label.
3 länk(ar) utan igenkännbart namn i HTML-koden
Tomma länkar eller bara en ikon/bild utan alt. Ett aria-label som satts via JavaScript känns inte igen här.
<a target="_self" class="block svelte-1x5iokp"><a target="_self" class="flex flex-col text-black dark:text-shade-ligh<a target="_self" class="text-black dark:text-shade-lightest block">
Det här bör du göra: Lägg till synlig länktext, eller använd aria-label eller en bild med alt för ikonlänkar.
Ingen <h1>-rubrik i den levererade HTML-koden
Varje sida bör börja med exakt en h1. På sidor som byggs upp via JavaScript kan h1 uppstå först i webbläsaren — kontrollera då i den renderade DOM:en.
body
Det här bör du göra: Infoga en meningsfull <h1> som första rubrik (helst redan på serversidan).
Redan korrekt löst
- Textalternativ: inga automatiskt igenkännbara problem
- Hopplänk till innehållet finns
- <main>-landmärke finns
Nästa steg
- 21 knapp(ar) utan namn i HTML-koden. Lägg till knapptext eller ange aria-label.
- 1 formulärfält utan igenkännbar märkning. Koppla varje fält till ett <label for>-element eller ange aria-label / aria-labelledby. Enbart en placeholder räcker inte.
- 3 länk(ar) utan igenkännbart namn i HTML-koden. Lägg till synlig länktext, eller använd aria-label eller en bild med alt för ikonlänkar.
- Ingen <h1>-rubrik i den levererade HTML-koden. Infoga en meningsfull <h1> som första rubrik (helst redan på serversidan).
- 5 CSS-regeln med möjligen för låg textkontrast. Gör textfärgen mörkare eller bakgrunden ljusare tills respektive minimivärde uppnås. Använd aldrig färg som enda särskiljande kännetecken.
Veckovis omskanning, JS-renderad, e-post vid nya hinder — kommer snart.
Skapa en tillgänglighetsredogörelse →
Metod & gränser
Den 2026-09-01 kontrollerades den HTML som www.spiegel.de levererar vid första besöket utan inloggning, plus upp till fyra länkade CSS-filer från samma domän. Kontrollerat: färgkontrast (från CSS), textalternativ, formulärmärkning, namn på kontroller, rubrikstruktur, sidtitel och sidspråk, zoomspärr, dubbletta id, positiva tabindex-värden, landmärken.
Inte kontrollerat: allt som skapas via JavaScript, tangentbordshanterbarhet, synligt fokus, fokusordning, skärmläsarutrop, innehåll bakom inloggning, undersidor. Det automatiska testet hittar ungefär 20–35 % av WCAG-överträdelserna — resten kräver en manuell granskning. En ögonblicksbild, inte ett juridiskt utlåtande.