Skontrolované 31. 8. 2026 · https://www.heise.de/
4 kritická bariéran · navyše 3 na kontrolu.
Ako vzniká skóre? (100 východiskových bodov)
| {n} z {total} obrázkov bez atribútu alt | -18 |
| {n} polí formulára bez rozpoznateľného označenia | -18 |
| {n} odkazov bez rozpoznateľného názvu v HTML | -18 |
| {n} tlačidiel bez názvu v HTML | -18 |
| V doručenom HTML žiadny nadpis <h1> | -7 |
| {n} duplicitných atribútov id | -7 |
| {n} pravidiel{nPlural} CSS s možno príliš nízkym kontrastom textu | -7 |
| Výsledok | 7 / 100 |
Vnímateľnosť
{n} z {total} obrázkov bez atribútu alt
Obrázky načítavané cez JavaScript tu nie sú zahrnuté.
img
Toto by ste mali urobiť: Každému <img> dajte alt: krátky popis pri obrázkoch nesúcich význam, alt="" pri čisto dekoratívnych.
{n} polí formulára bez rozpoznateľného označenia
Skontrolujte, či existuje aria-label nastavené cez JavaScript.
input, select, textarea
Toto by ste mali urobiť: Prepojte každé pole s prvkom <label for> alebo nastavte aria-label / aria-labelledby. Samotný placeholder nestačí.
{n} pravidiel{nPlural} 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.: {examples}
.text-ho-text, .text-yellow-50, .text-heisegrau-50, .text-green-50, .text-red-50
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ť
{n} 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
Toto by ste mali urobiť: Doplňte viditeľný text odkazu, pri odkazoch s ikonou použite aria-label alebo obrázok s alt.
{n} 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
Toto by ste mali urobiť: Doplňte text tlačidla alebo nastavte aria-label.
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).
Robustnosť
{n} duplicitných atribútov id
napr. {examples}. Rozbíja väzby label-for a aria.
[id]
Toto by ste mali urobiť: Prideľujte jedinečné id.
Ďalšie kroky
- {n} z {total} obrázkov bez atribútu alt. Každému <img> dajte alt: krátky popis pri obrázkoch nesúcich význam, alt="" pri čisto dekoratívnych.
- {n} 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čí.
- {n} 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.
- {n} tlačidiel bez názvu v HTML. Doplňte text tlačidla alebo nastavte aria-label.
- V doručenom HTML žiadny nadpis <h1>. Vložte zmysluplný <h1> ako prvý nadpis (podľa možnosti už na strane servera).
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 31. 8. 2026 sa skontrolovalo HTML, ktoré www.heise.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.
Overlay widgety (tlačidlá prístupnosti, ktoré prepínajú kontrast alebo písmo) nezabezpečia súlad webu — nájdené bariéry treba opraviť v zdrojovom kóde. Prečo overlaye nepomáhajú