Diperiksa pada 24/9/2026 · https://www.heise.de/
5 hambatan kritisn · selain itu 2 untuk diperiksa.
Bagaimana skor terbentuk? (100 poin awal)
| 40 dari 519 gambar tanpa atribut alt | -18 |
| 4 bidang formulir tanpa pelabelan yang dapat dikenali | -18 |
| 16 tautan tanpa nama yang dapat dikenali di HTML | -18 |
| 6 tombol tanpa nama di HTML | -18 |
| 5 aturan CSSn dengan kontras teks yang mungkin terlalu rendah | -18 |
| Tidak ada judul <h1> pada HTML yang disajikan | -7 |
| 6 atribut id ganda | -7 |
| Hasil | 0 / 100 |
Dapat dipersepsi
40 dari 519 gambar tanpa atribut alt
Gambar yang dimuat melalui JavaScript tidak diperhitungkan di sini.
<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">
Inilah yang sebaiknya Anda lakukan: Berikan setiap <img> sebuah alt: deskripsi singkat untuk gambar bermakna, alt="" untuk yang murni dekoratif.
4 bidang formulir tanpa pelabelan yang dapat dikenali
Periksa apakah ada aria-label yang disetel melalui JavaScript.
<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">
Inilah yang sebaiknya Anda lakukan: Tautkan setiap bidang ke elemen <label for> atau setel aria-label / aria-labelledby. Hanya placeholder tidak cukup.
5 aturan CSSn dengan kontras teks yang mungkin terlalu rendah
Diperlukan: 4,5:1 (normal) atau 3:1 (teks besar). Pada “latar halaman yang diasumsikan”, latar sebenarnya tidak dapat dipastikan — jika ragu, periksa di peramban. Ditemukan antara lain: `.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
Inilah yang sebaiknya Anda lakukan: Gelapkan warna teks atau terangkan latar hingga nilai minimum yang berlaku tercapai. Jangan pernah menggunakan warna sebagai satu-satunya ciri pembeda.
Dapat dioperasikan
16 tautan tanpa nama yang dapat dikenali di HTML
Tautan kosong atau hanya ikon/gambar tanpa alt. aria-label yang disetel melalui JavaScript tidak dikenali di sini.
<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
Inilah yang sebaiknya Anda lakukan: Tambahkan teks tautan yang terlihat, atau gunakan aria-label atau gambar dengan alt pada tautan ikon.
6 tombol tanpa nama di HTML
Tombol tanpa teks dan tanpa aria-label bisu bagi pembaca layar — kecuali namanya disetel melalui 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">
Inilah yang sebaiknya Anda lakukan: Tambahkan teks tombol atau setel aria-label.
Tidak ada judul <h1> pada HTML yang disajikan
Setiap halaman sebaiknya diawali tepat satu h1. Pada halaman yang dibangun melalui JavaScript, h1 mungkin baru muncul di peramban — periksalah pada DOM yang telah dirender.
body
Inilah yang sebaiknya Anda lakukan: Sisipkan <h1> yang bermakna sebagai judul pertama (sebaiknya sudah di sisi server).
Tangguh
6 atribut id ganda
mis. heisetopnavi_search, HEI_M_Incontent-2-label, HEI_M_Incontent-2, circle. Merusak keterkaitan label-for dan aria.
[id]
Inilah yang sebaiknya Anda lakukan: Tetapkan id yang unik.
Langkah berikutnya
- 40 dari 519 gambar tanpa atribut alt. Berikan setiap <img> sebuah alt: deskripsi singkat untuk gambar bermakna, alt="" untuk yang murni dekoratif.
- 4 bidang formulir tanpa pelabelan yang dapat dikenali. Tautkan setiap bidang ke elemen <label for> atau setel aria-label / aria-labelledby. Hanya placeholder tidak cukup.
- 16 tautan tanpa nama yang dapat dikenali di HTML. Tambahkan teks tautan yang terlihat, atau gunakan aria-label atau gambar dengan alt pada tautan ikon.
- 6 tombol tanpa nama di HTML. Tambahkan teks tombol atau setel aria-label.
- 5 aturan CSSn dengan kontras teks yang mungkin terlalu rendah. Gelapkan warna teks atau terangkan latar hingga nilai minimum yang berlaku tercapai. Jangan pernah menggunakan warna sebagai satu-satunya ciri pembeda.
Pemindaian ulang mingguan, dengan render JS, email saat ada hambatan baru — segera hadir.
Buat pernyataan aksesibilitas →
Metode & batasan
Pada 24/9/2026 diperiksa HTML yang disajikan www.heise.de pada kunjungan pertama tanpa login, ditambah hingga empat berkas CSS tertaut dari domain yang sama. Yang diperiksa: kontras warna (dari CSS), alternatif teks, pelabelan formulir, nama elemen kontrol, struktur judul, judul halaman dan bahasa halaman, penguncian zoom, id ganda, nilai tabindex positif, penanda area (landmark).
Tidak diperiksa: segala sesuatu yang muncul melalui JavaScript, keteroperasian keyboard, fokus terlihat, urutan fokus, pengumuman pembaca layar, konten di balik login, subhalaman. Pengujian otomatis menemukan sekitar 20–35% pelanggaran WCAG — sisanya memerlukan pemeriksaan manual. Sebuah cuplikan, bukan keputusan hukum.
Widget overlay (tombol aksesibilitas yang mengubah kontras atau font) tidak membuat situs menjadi sesuai standar — hambatan yang ditemukan harus diperbaiki di kode sumber. Mengapa overlay tidak membantu