# Barrierefreiheitsprobleme, auf die wir testen Jede Seite erklärt ein Problem, das unsere automatisierten Tests finden: was es bedeutet, auf welches WCAG-Kriterium es sich bezieht, wie Sie es auf jeder Website, in Shopify und in WooCommerce beheben und wie Sie die Korrektur prüfen. ## Barrierefreiheitsprobleme - [ARIA-hidden Elemente dürfen keine fokussierbaren Elemente beinhalten](https://www.fixreports.com/de/issues/aria-hidden-focus): WCAG 4.1.2 · Stufe A. Fokussierbare Elemente sind vor Screenreadern verborgen, lassen sich aber weiterhin mit der Tastatur erreichen. (ARIA-Attribute und -Rollen) - [autocomplete-Attribute müssen korrekt genutzt werden](https://www.fixreports.com/de/issues/autocomplete-valid): WCAG 1.3.5 · Stufe AA. Ein Formularfeld verwendet einen autocomplete-Wert, den Browser nicht erkennen. (Formularfelder ohne Label) - [Schaltflächen müssen wahrnehmbaren Text enthalten](https://www.fixreports.com/de/issues/button-name): WCAG 4.1.2 · Stufe A. Manche Buttons haben keinen zugänglichen Namen, daher hören Screenreader-Nutzer nur „Schalter“. (Links und Buttons ohne Namen) - [Elemente müssen einen ausreichenden Farbkontrast haben](https://www.fixreports.com/de/issues/color-contrast): WCAG 1.4.3 · Stufe AA. Manche Texte heben sich nicht genug von ihrem Hintergrund ab, um von Menschen mit Sehbehinderung gelesen werden zu können. (Geringer Farbkontrast) - [Dokumente müssen ein -Element besitzen, um die Navigation zu erleichtern](https://www.fixreports.com/de/issues/document-title): WCAG 2.4.2 · Stufe A. Eine Seite hat keinen Titel, daher können Nutzer nicht erkennen, auf welcher Seite sie sich befinden. (Seitentitel) - [IDs, welche in ARIA und Lables genutzt werden, müssen einzigartig sein](https://www.fixreports.com/de/issues/duplicate-id-aria): WCAG 4.1.2 · Stufe A. Mehrere Elemente teilen sich eine id, die etwas beschriftet oder beschreibt, daher lesen assistive Technologien möglicherweise das falsche Label vor. (ARIA-Attribute und -Rollen) - [Frames müssen ein nichtleeres title-Attribut besitzen](https://www.fixreports.com/de/issues/frame-title): WCAG 4.1.2 · Stufe A. Ein eingebetteter Frame (oft eine Karte, ein Video oder ein App-Widget) hat keinen Titel, daher wissen Screenreader-Nutzer nicht, was er enthält. (Seitenstruktur, Überschriften und Landmarks) - [Überschriftenebenen sollten nur jeweils um eins steigen](https://www.fixreports.com/de/issues/heading-order): Best Practice der Barrierefreiheit. Überschriftenebenen werden übersprungen (zum Beispiel von H2 auf H4), was die Seitenstruktur für Screenreader-Nutzer unübersichtlich macht. (Seitenstruktur, Überschriften und Landmarks) - [Das <html>-Element muss ein lang-Attribut besitzen](https://www.fixreports.com/de/issues/html-has-lang): WCAG 3.1.1 · Stufe A. Die Seite gibt ihre Sprache nicht an, daher lesen Screenreader sie möglicherweise mit falscher Aussprache vor. (Seitensprache) - [Das <html>-Element muss einen gültigen Attributwert für das lang-Attribut besitzen](https://www.fixreports.com/de/issues/html-lang-valid): WCAG 3.1.1 · Stufe A. Der Sprachcode der Seite ist ungültig, daher können Screenreader nicht die richtige Stimme wählen. (Seitensprache) - [Abbildungen müssen einen Alternativtext besitzen](https://www.fixreports.com/de/issues/image-alt): WCAG 1.1.1 · Stufe A. Bildern fehlt eine Textalternative, daher wissen Screenreader-Nutzer nicht, was sie zeigen. (Bilder ohne Textalternativen) - [Eingabeschaltflächen müssen wahrnehmbaren Text beinhalten](https://www.fixreports.com/de/issues/input-button-name): WCAG 4.1.2 · Stufe A. Ein Input-Button hat keinen Text, daher können Screenreader nicht ansagen, was er tut. (Formularfelder ohne Label) - [<input type="image">-Elemente müssen einen Alternativtext besitzen](https://www.fixreports.com/de/issues/input-image-alt): WCAG 1.1.1, 4.1.2 · Stufe A. Ein Bild-Button hat keinen Alternativtext, daher können Screenreader nicht ansagen, was er tut. (Bilder ohne Textalternativen) - [<form>-Elemente müssen eine Beschriftung haben](https://www.fixreports.com/de/issues/label): WCAG 4.1.2 · Stufe A. Manche Formularfelder haben kein Label, daher wissen Screenreader-Nutzer nicht, was sie eingeben sollen. (Formularfelder ohne Label) - [Seite muss eine main landmark enthalten](https://www.fixreports.com/de/issues/landmark-one-main): Best Practice der Barrierefreiheit. Die Seite hat keine main-Landmark, daher können Screenreader-Nutzer nicht direkt zum Inhalt springen. (Seitenstruktur, Überschriften und Landmarks) - [Links müssen vom umgebenden Text auf eine Weise unterschieden werden können, die nicht allein auf Farbe beruht](https://www.fixreports.com/de/issues/link-in-text-block): WCAG 1.4.1 · Stufe A. Links in Absätzen unterscheiden sich nur durch die Farbe, daher übersehen Menschen sie, die den Farbunterschied nicht erkennen können. (Geringer Farbkontrast) - [Links müssen wahrnehmbaren Text beinhalten](https://www.fixreports.com/de/issues/link-name): WCAG 2.4.4, 4.1.2 · Stufe A. Manche Links haben keinen Text, den ein Screenreader ansagen kann, oft reine Icon-Links wie Social-Media-Icons oder das Warenkorb-Icon. (Links und Buttons ohne Namen) - [Zoomen und Skalieren darf nicht deaktiviert werden](https://www.fixreports.com/de/issues/meta-viewport): WCAG 1.4.4 · Stufe AA. Die Seite blockiert auf Mobilgeräten das Zoomen mit zwei Fingern. (Zoom und Reflow) - [Die Seite muss eine Überschrift der ersten Ebene enthalten](https://www.fixreports.com/de/issues/page-has-heading-one): Best Practice der Barrierefreiheit. Die Seite hat keine Überschrift der obersten Ebene. (Seitenstruktur, Überschriften und Landmarks) - [Inhalte sollten in einer landmark region enthalten sein](https://www.fixreports.com/de/issues/region): Best Practice der Barrierefreiheit. Manche Inhalte liegen in keiner Landmark der Seite (header, nav, main oder footer). (Seitenstruktur, Überschriften und Landmarks) - [[role='img'] Elemente haben ein Alternativtext](https://www.fixreports.com/de/issues/role-img-alt): WCAG 1.1.1 · Stufe A. Ein Element, das als Bild ausgezeichnet ist, hat keine Textalternative. (Bilder ohne Textalternativen) - [Scrollbare Regionen müssen per Tastatur erreichbar sein](https://www.fixreports.com/de/issues/scrollable-region-focusable): WCAG 2.1.1 · Stufe A. Ein scrollbarer Bereich ist mit der Tastatur nicht erreichbar, daher können Tastaturnutzer ihn nicht scrollen. (Tastaturzugang und Fokus) - [<select> Elemente müssen einen zugänglichen Namen (accessible name) besitzen](https://www.fixreports.com/de/issues/select-name): WCAG 4.1.2 · Stufe A. Ein Dropdown (oft eine Sortier- oder Variantenauswahl) hat kein Label. (Formularfelder ohne Label) - [<svg> Elemente mit einer img Rolle sollten einen Alternativtext besitzen](https://www.fixreports.com/de/issues/svg-img-alt): WCAG 1.1.1 · Stufe A. Ein SVG-Bild, das Informationen vermittelt, hat keine Textalternative. (Bilder ohne Textalternativen) - [Alle Berührungsobjekte (touch targets) müssen 24 Pixel groß sein oder ausreichend Platz lassen](https://www.fixreports.com/de/issues/target-size): WCAG 2.5.8 · Stufe AA. Manche Touch-Ziele sind kleiner als 24 × 24 Pixel und liegen zu dicht beieinander, daher sind sie auf dem Smartphone schwer zu treffen. (Tastaturzugang und Fokus)