36 من 521 صورة بلا سمة alt

الصور التي تُحمَّل عبر JavaScript غير مشمولة هنا.

• <img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="3983" height="2238">
• <img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="3200" height="1798">
• <img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="300" height="250">
• <img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="1672" height="940">

ما ينبغي فعله: امنح كل <img> سمة alt: وصف قصير للصور الحاملة للمعنى، alt="" للصور الزخرفية البحتة.

4 حقل نموذج بلا تسمية يمكن التعرف عليها

تحقق مما إذا كان هناك aria-label مضبوط عبر 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">

ما ينبغي فعله: اربط كل حقل بعنصر <label for> أو اضبط aria-label / aria-labelledby. لا يكفي placeholder وحده.

5 قاعدةn CSS بتباين نص قد يكون منخفضًا جدًا

المطلوب: 4.5:1 (عادي) أو 3:1 (نص كبير). في حالة «خلفية صفحة مفترَضة» تعذر تحديد الخلفية الفعلية بيقين — عند الشك تحقق في المتصفح. مما عُثر عليه: `.dark a-gift-link dialog`: #e0e0e0 auf #fff (Vorfahren-Hintergrund) = 1.32:1 · `a-color-scheme .a-color-scheme__icon--moon`: #959595 auf #c7c7c7 (Vorfahren-Hintergrund) = 1.77: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-color-scheme .a-color-scheme__icon--moon, a-opt-in[is-active] .opt-in__footnote, .a-android-native-app-prompt__load-app, a-topic .topic-label

ما ينبغي فعله: غمِّق لون النص أو فتِّح الخلفية حتى بلوغ الحد الأدنى المعني. لا تستخدم اللون أبدًا كسمة تمييز وحيدة.

13 رابط بلا اسم يمكن التعرف عليه في الـ HTML

روابط فارغة أو مجرد أيقونة/صورة بلا alt. لا يُتعرَّف هنا على aria-label المضبوط عبر JavaScript.

• <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

ما ينبغي فعله: أضِف نص رابط مرئيًا، أو استخدم في روابط الأيقونات aria-label أو صورة ذات alt.

6 زر بلا اسم في الـ HTML

الأزرار بلا نص وبلا aria-label صامتة لقارئات الشاشة — ما لم يُضبَط الاسم عبر 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">

ما ينبغي فعله: أضِف نص الزر أو اضبط aria-label.

لا يوجد عنوان <h1> في الـ HTML المُقدَّم

يجب أن تبدأ كل صفحة بعنوان h1 واحد بالضبط. في الصفحات المبنية عبر JavaScript قد لا ينشأ الـ h1 إلا في المتصفح — عندئذٍ تحقق في الـ DOM المعروض.

body

ما ينبغي فعله: أدرِج <h1> ذا معنى كأول عنوان (على جانب الخادم إن أمكن).

6 سمة id مكررة

مثلًا heisetopnavi_search, HEI_M_Incontent-2-label, HEI_M_Incontent-2, circle. يكسر ارتباطات label-for وaria.

[id]

ما ينبغي فعله: امنح معرّفات id فريدة.