Skontrolované 1. 9. 2026 · https://www.spiegel.de/
1 kritická bariéra · navyše 4 na kontrolu.
Ako vzniká skóre? (100 východiskových bodov)
| 21 tlačidiel bez názvu v HTML | -18 |
| 1 polí formulára bez rozpoznateľného označenia | -7 |
| 3 odkazov bez rozpoznateľného názvu v HTML | -7 |
| V doručenom HTML žiadny nadpis <h1> | -7 |
| 5 pravidieln CSS s možno príliš nízkym kontrastom textu | -7 |
| Výsledok | 54 / 100 |
Vnímateľnosť
1 polí formulára bez rozpoznateľného označenia
Skontrolujte, či existuje aria-label nastavené cez JavaScript.
<input name="suchbegriff" id="search-input-field" placeholder="Seite durchsuchen ...">
Toto by ste mali urobiť: Prepojte každé pole s prvkom <label for> alebo nastavte aria-label / aria-labelledby. Samotný placeholder nestačí.
5 pravidieln CSS s možno príliš nízkym kontrastom textu
Potrebné: 4,5:1 (normálny) resp. 3:1 (veľký text). Pri „predpokladanom pozadí stránky“ sa skutočné pozadie nedalo bezpečne určiť — v prípade pochybností skontrolujte v prehliadači. Nájdené o. i.: `.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
Toto by ste mali urobiť: Stmavte farbu textu alebo zosvetlite pozadie, kým sa nedosiahne príslušná minimálna hodnota. Nikdy nepoužívajte farbu ako jediný rozlišovací znak.
Ovládateľnosť
21 tlačidiel bez názvu v HTML
Tlačidlá bez textu a bez aria-label sú pre čítačky obrazovky nemé — ak sa názov nenastavuje cez 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>
Toto by ste mali urobiť: Doplňte text tlačidla alebo nastavte aria-label.
3 odkazov bez rozpoznateľného názvu v HTML
Prázdne odkazy alebo len ikona/obrázok bez alt. aria-label nastavené cez JavaScript sa tu nerozpozná.
<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">
Toto by ste mali urobiť: Doplňte viditeľný text odkazu, pri odkazoch s ikonou použite aria-label alebo obrázok s alt.
V doručenom HTML žiadny nadpis <h1>
Každá stránka by mala začínať presne jedným h1. Pri stránkach zostavovaných cez JavaScript môže h1 vzniknúť až v prehliadači — potom skontrolujte v renderovanom DOM.
body
Toto by ste mali urobiť: Vložte zmysluplný <h1> ako prvý nadpis (podľa možnosti už na strane servera).
Už správne vyriešené
- Textové alternatívy: žiadne automaticky rozpoznateľné problémy
- Odkaz na preskočenie na obsah je prítomný
- Orientačný bod <main> je prítomný
Ďalšie kroky
- 21 tlačidiel bez názvu v HTML. Doplňte text tlačidla alebo nastavte aria-label.
- 1 polí formulára bez rozpoznateľného označenia. Prepojte každé pole s prvkom <label for> alebo nastavte aria-label / aria-labelledby. Samotný placeholder nestačí.
- 3 odkazov bez rozpoznateľného názvu v HTML. Doplňte viditeľný text odkazu, pri odkazoch s ikonou použite aria-label alebo obrázok s alt.
- V doručenom HTML žiadny nadpis <h1>. Vložte zmysluplný <h1> ako prvý nadpis (podľa možnosti už na strane servera).
- 5 pravidieln CSS s možno príliš nízkym kontrastom textu. Stmavte farbu textu alebo zosvetlite pozadie, kým sa nedosiahne príslušná minimálna hodnota. Nikdy nepoužívajte farbu ako jediný rozlišovací znak.
Týždenné opakované skenovanie, s renderovaním JS, e-mail pri nových bariérach — už čoskoro.
Vytvoriť vyhlásenie o prístupnosti →
Metóda & hranice
Dňa 1. 9. 2026 sa skontrolovalo HTML, ktoré www.spiegel.de doručuje pri prvom prístupe bez prihlásenia, a až štyri pripojené súbory CSS z tej istej domény. Skontrolované: farebný kontrast (z CSS), textové alternatívy, označenie formulárov, názvy ovládacích prvkov, štruktúra nadpisov, názov a jazyk stránky, blokovanie priblíženia, duplicitné id, kladné hodnoty tabindex, orientačné body.
Neskontrolované: všetko, čo vzniká cez JavaScript, ovládateľnosť klávesnicou, viditeľný fokus, poradie fokusu, oznámenie čítačky obrazovky, obsah za prihlásením, podstránky. Automatický test nájde približne 20–35 % porušení WCAG — zvyšok si vyžaduje ručnú kontrolu. Momentka, nie právne rozhodnutie.