40 из 519 изображений без атрибута alt

Изображения, загружаемые через JavaScript, здесь не учитываются.

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

Вот что следует сделать: Дайте каждому <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-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

Вот что следует сделать: Затемните цвет текста или осветлите фон, пока не будет достигнуто соответствующее минимальное значение. Никогда не используйте цвет как единственный отличительный признак.

16 ссылок без распознаваемого имени в 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.

В предоставленном HTML нет заголовка <h1>

Каждая страница должна начинаться ровно с одного 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.