Verificat la 01.09.2026 · https://www.spiegel.de/
1 barieră critică · în plus 4 de verificat.
Cum rezultă scorul? (100 de puncte inițiale)
| 21 butoane fără nume în HTML | -18 |
| 1 câmpuri de formular fără etichetă identificabilă | -7 |
| 3 linkuri fără nume identificabil în HTML | -7 |
| Niciun titlu <h1> în HTML-ul livrat | -7 |
| 5 regulăn CSS cu un contrast de text posibil prea mic | -7 |
| Rezultat | 54 / 100 |
Perceptibil
1 câmpuri de formular fără etichetă identificabilă
Verifică dacă există un aria-label setat prin JavaScript.
<input name="suchbegriff" id="search-input-field" placeholder="Seite durchsuchen ...">
Iată ce ar trebui să faci: Leagă fiecare câmp de un element <label for> sau setează aria-label / aria-labelledby. Doar un placeholder nu este suficient.
5 regulăn CSS cu un contrast de text posibil prea mic
Necesar: 4,5:1 (normal), respectiv 3:1 (text mare). La „fundal de pagină presupus”, fundalul real nu a putut fi determinat cu certitudine — în caz de dubiu, verifică în browser. Găsit, printre altele: `.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
Iată ce ar trebui să faci: Întunecă culoarea textului sau luminează fundalul până când se atinge valoarea minimă respectivă. Nu folosi niciodată culoarea ca unic element de diferențiere.
Operabil
21 butoane fără nume în HTML
Butoanele fără text și fără aria-label sunt mute pentru cititoarele de ecran — cu excepția cazului în care numele este setat prin 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>
Iată ce ar trebui să faci: Adaugă textul butonului sau setează aria-label.
3 linkuri fără nume identificabil în HTML
Linkuri goale sau doar o pictogramă/imagine fără alt. Un aria-label setat prin JavaScript nu este identificat aici.
<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">
Iată ce ar trebui să faci: Adaugă text de link vizibil sau, la linkurile cu pictogramă, folosește aria-label ori o imagine cu alt.
Niciun titlu <h1> în HTML-ul livrat
Fiecare pagină ar trebui să înceapă cu exact un h1. La paginile construite prin JavaScript, h1 poate apărea abia în browser — atunci verifică în DOM-ul randat.
body
Iată ce ar trebui să faci: Inserează un <h1> semnificativ ca prim titlu (de preferință deja pe partea de server).
Deja rezolvat corect
- Alternative text: nicio problemă identificabilă automat
- Link de salt la conținut prezent
- Reper <main> prezent
Pașii următori
- 21 butoane fără nume în HTML. Adaugă textul butonului sau setează aria-label.
- 1 câmpuri de formular fără etichetă identificabilă. Leagă fiecare câmp de un element <label for> sau setează aria-label / aria-labelledby. Doar un placeholder nu este suficient.
- 3 linkuri fără nume identificabil în HTML. Adaugă text de link vizibil sau, la linkurile cu pictogramă, folosește aria-label ori o imagine cu alt.
- Niciun titlu <h1> în HTML-ul livrat. Inserează un <h1> semnificativ ca prim titlu (de preferință deja pe partea de server).
- 5 regulăn CSS cu un contrast de text posibil prea mic. Întunecă culoarea textului sau luminează fundalul până când se atinge valoarea minimă respectivă. Nu folosi niciodată culoarea ca unic element de diferențiere.
Rescanare săptămânală, cu randare JS, e-mail la bariere noi — vine în curând.
Creează o declarație de accesibilitate →
Metodă & limite
La 01.09.2026 a fost verificat HTML-ul pe care www.spiegel.de îl livrează la prima accesare fără autentificare, plus până la patru fișiere CSS asociate din același domeniu. Verificat: contrastul culorilor (din CSS), alternativele text, etichetele de formular, numele elementelor de control, structura titlurilor, titlul și limba paginii, blocarea zoomului, id-uri duplicate, valori tabindex pozitive, repere.
Neverificat: tot ce apare prin JavaScript, operabilitatea de la tastatură, focalizarea vizibilă, ordinea de focalizare, anunțul cititorului de ecran, conținutul din spatele autentificării, subpaginile. Testul automat găsește aproximativ 20–35 % dintre încălcările WCAG — restul necesită o verificare manuală. Instantaneu, nu o hotărâre juridică.