Patikrinta 2026-09-24 · https://www.heise.de/
5 kritinė kliūtisn · papildomai 2 tikrintinų.
Nuo paskutinio skenavimo: be pakeitimų.
Kaip susidaro įvertis? (100 pradinių balų)
| 40 iš 519 paveikslėlių be alt atributo | -18 |
| 4 formos laukų be atpažįstamos etiketės | -18 |
| 16 nuorodų be atpažįstamo pavadinimo HTML | -18 |
| 6 mygtukų be pavadinimo HTML | -18 |
| 5 CSS taisykln su galbūt per mažu teksto kontrastu | -18 |
| Pateiktame HTML nėra <h1> antraštės | -7 |
| 6 pasikartojančių id atributų | -7 |
| Rezultatas | 0 / 100 |
Suvokiamumas
40 iš 519 paveikslėlių be alt atributo
Per JavaScript įkelti paveikslėliai čia neįtraukti.
<img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="3377" height="1898"><img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="1920" height="1079"><img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="3200" height="1798"><img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="300" height="250">
Štai ką turėtum daryti: Kiekvienam <img> suteik alt: trumpas aprašymas prasmę turintiems paveikslėliams, alt="" grynai dekoratyviems.
4 formos laukų be atpažįstamos etiketės
Patikrink, ar yra per JavaScript nustatytas aria-label.
<input type="text" name="q" placeholder="Suchen"><input type="text" name="q" placeholder="Suchen"><select name="in"><input type="text" name="fs" placeholder="Im Preisvergleich suchen">
Štai ką turėtum daryti: Susiek kiekvieną lauką su elementu <label for> arba nustatyk aria-label / aria-labelledby. Vien placeholder nepakanka.
5 CSS taisykln su galbūt per mažu teksto kontrastu
Reikia: 4,5:1 (normalus) arba 3:1 (didelis tekstas). Esant „numanomam puslapio fonui”, tikrojo fono nepavyko patikimai nustatyti — abejojant patikrink naršyklėje. Rasta be kita ko: `.dark a-gift-link dialog`: #e0e0e0 auf #fff (Vorfahren-Hintergrund) = 1.32:1 · `.a-android-native-app-prompt__close-banner`: #323232 auf rgba(0,0,0,0) = 1.64:1 · `a-opt-in[is-active] .opt-in__footnote`: #959595 auf #ffffff (Standard) (Seitenhintergrund, angenommen) = 3.00:1 · `.a-android-native-app-prompt__load-app`: #fff auf #27a209 = 3.36:1 · `a-topic .topic-label`: #fff auf #ed3725 = 4.06:1
.dark a-gift-link dialog, .a-android-native-app-prompt__close-banner, a-opt-in[is-active] .opt-in__footnote, .a-android-native-app-prompt__load-app, a-topic .topic-label
Štai ką turėtum daryti: Patamsink teksto spalvą arba pašviesink foną, kol pasiekiama atitinkama minimali reikšmė. Niekada nenaudok spalvos kaip vienintelio skiriamojo požymio.
Valdomumas
16 nuorodų be atpažįstamo pavadinimo HTML
Tuščios nuorodos arba tik piktograma/paveikslėlis be alt. Per JavaScript nustatytas aria-label čia neatpažįstamas.
<a-click-performance><a name="topnavi.ho.magazine-nav.ct" class="hover:bg-brand dark:hover:<a name="topnavi.ho.magazine-nav.ix" class="hover:bg-brand-alternative<a name="topnavi.ho.magazine-nav.foto" class="hover:bg-brand dark:hove
Štai ką turėtum daryti: Pridėk matomą nuorodos tekstą arba piktogramų nuorodoms naudok aria-label ar paveikslėlį su alt.
6 mygtukų be pavadinimo HTML
Mygtukai be teksto ir be aria-label ekrano skaityklėms yra nebylūs — nebent pavadinimas nustatomas per JavaScript.
<button class="scroll-left text-ho-text"><button class="scroll-right text-ho-text"><button class="scroll-left text-ho-text"><button class="scroll-right text-ho-text">
Štai ką turėtum daryti: Pridėk mygtuko tekstą arba nustatyk aria-label.
Pateiktame HTML nėra <h1> antraštės
Kiekvienas puslapis turėtų prasidėti tiksliai vienu h1. Per JavaScript sudarytuose puslapiuose h1 gali atsirasti tik naršyklėje — tuomet patikrink atvaizduotame DOM.
body
Štai ką turėtum daryti: Įterpk prasmingą <h1> kaip pirmąją antraštę (jei įmanoma, jau serverio pusėje).
Tvirtumas
6 pasikartojančių id atributų
pvz., heisetopnavi_search, HEI_M_Incontent-2-label, HEI_M_Incontent-2, circle. Sugadina label-for ir aria susiejimus.
[id]
Štai ką turėtum daryti: Priskirk unikalius id.
Tolesni žingsniai
- 40 iš 519 paveikslėlių be alt atributo. Kiekvienam <img> suteik alt: trumpas aprašymas prasmę turintiems paveikslėliams, alt="" grynai dekoratyviems.
- 4 formos laukų be atpažįstamos etiketės. Susiek kiekvieną lauką su elementu <label for> arba nustatyk aria-label / aria-labelledby. Vien placeholder nepakanka.
- 16 nuorodų be atpažįstamo pavadinimo HTML. Pridėk matomą nuorodos tekstą arba piktogramų nuorodoms naudok aria-label ar paveikslėlį su alt.
- 6 mygtukų be pavadinimo HTML. Pridėk mygtuko tekstą arba nustatyk aria-label.
- 5 CSS taisykln su galbūt per mažu teksto kontrastu. Patamsink teksto spalvą arba pašviesink foną, kol pasiekiama atitinkama minimali reikšmė. Niekada nenaudok spalvos kaip vienintelio skiriamojo požymio.
Savaitinis pakartotinis skenavimas, su JS atvaizdavimu, el. laiškas apie naujas kliūtis — netrukus.
Sukurti prieinamumo deklaraciją →
Metodas & ribos
2026-09-24 buvo patikrintas HTML, kurį www.heise.de pateikia per pirmąjį iškvietimą be prisijungimo, taip pat iki keturių to paties domeno susietų CSS failų. Patikrinta: spalvų kontrastas (iš CSS), teksto alternatyvos, formų etiketės, valdymo elementų pavadinimai, antraščių struktūra, puslapio antraštė ir kalba, mastelio blokavimas, pasikartojantys id, teigiamos tabindex reikšmės, orientyrai.
Nepatikrinta: viskas, kas atsiranda per JavaScript, valdomumas klaviatūra, matomas fokusas, fokuso tvarka, ekrano skaityklės pranešimas, turinys už prisijungimo, papildomi puslapiai. Automatinis testas randa maždaug 20–35 % WCAG pažeidimų — likusiam reikia rankinės patikros. Momentinė nuotrauka, ne teisinis sprendimas.
Overlay valdikliai (prieinamumo mygtukai, keičiantys kontrastą ar šriftą) nepadaro svetainės atitinkančios reikalavimų — rastas kliūtis reikia pašalinti šaltinio kode. Kodėl overlay sprendimai nepadeda