Die Gemeinde Roggenburg ist bemüht, die Internetseite www.roggenburg.de barrierefrei zugänglich zu machen. Rechtsgrundlage sind das Behindertengleichstellungsgesetz (BGG) und die Barrierefreie Informationstechnik-Verordnung (BITV 2.0) in ihrer jeweils gültigen Fassung.
Die Seite wurde mit Hilfe des BITV-Tests geprüft:
Prüfung
Standard: BITV 2.0 / EN 301 549
Startadresse: www.roggenburg.de
Prüfstelle: digiPublica, eine Marke der econix GmbH
Prüfer/in: Tim Braun support@digipublica.de
Prüfdatum: 24.02.2020 - 02.03.2020
Ergebnis
3 von 3 Seiten nicht BITV-konform
Geprüfte Seiten
Seite 1: Startseite mit Teasern
Titel: Startseite
URL: www.roggenburg.de
Ergebnis: nicht BITV-konform, 4 von 60 Anforderungen nicht erfüllt
Seite 2: Formularseite mit Eingabefeldern
Titel: Kontakt
URL: https://www.roggenburg.de/Kontakt.n11.html
Ergebnis: nicht BITV-konform, 6 von 60 Anforderungen nicht erfüllt
Seite 3: Mitarbeiterseite mit Tabelle
Titel: Mitarbeiter
URL: https://www.roggenburg.de/Mitarbeiter.n33.html
Ergebnis: nicht BITV-konform, 6 von 60 Anforderungen nicht erfüllt
Bewertung und Anmerkungen zu einzelnen Prüfschritten
erfüllt sind 26 Prüfschritte:
| Prüfschritt | Kommentar |
|---|---|
| 1.3.1b HTML-Strukturelemente für Listen |
Seite 1, Seite 2, Seite 3: Sämtliche Listen (auch innerhalb der jeweiligen Menüs) sind mit den vorhandenen Elementen der HTML-Struktur bzgl. Listen ausgezeichnet. Diese Elemente werden an keiner Stelle missbräuchlich verwendet. |
| 1.3.1e Datentabellen richtig aufgebaut |
Seite 1, Seite 2: Sämtliche Datentabellen sind strukturell richtig aufgebaut, sie verzichten auf Überschriften, da der Aufbau sowohl der Kapitelüberschrift als auch der ersten Zeile zu entnehmen ist. Ausserdem listen die Tabellen Daten auf, die zusammen gehören und eine feste Reihenfolge haben. Sie werden also normalerweise linear genutzt, wie ein Buch. Seite 3: Sämtliche Datentabellen sind strukturell richtig aufgebaut, Zeilen- und Spaltenüberschriften sind mit dem Tag <th> ausgezeichnet. Die Tabelle hat eine klare Struktur, die Bedeutung der Zeilen und Spalten ist klar erkennbar. Die Überschriften sind gut auffindbar, aussagekräftig formuliert und es ist klar auf welche Daten sie sich beziehen. Alle Zellen sind gleich aufgebaut. Die Beschreibung der Tabelle wird über "caption" realisiert. |
| 1.3.1h Beschriftung von Formularelementen programmatisch ermittelbar |
Seite 2: Die Beschriftungen von Formularfeldern sind richtig verknüpft. Label-Elemente haben ein "for"-Attribut. Wenn man mit der Maus auf die Beschriftung eines Formular-Elementes klickt wird der Cursor dadurch auf das Formular-Element gesetzt. Es gibt keine Gruppen von Formular-Elementen. |
| 1.3.2a Sinnvolle Reihenfolge |
Seite 1, Seite 2, Seite 3: Die logische Reihenfolge der sichtbaren Seiteninhalte bleibt auch nach dem Abschalten von CSS erhalten. Es gibt keine Linealisierungsprobleme mit dem Screenreader NVDA, wenn man die sichtbaren Inhalte vorlesen lässt, werden keine versteckten Inhalte vorgelesen. |
| 1.3.4a Keine Beschränkung der Bildschirmausrichtung |
Seite 1, Seite 2, Seite 3: Die Inhalte sind bezüglich Bedienung und Ansicht nicht auf eine einzige Ausrichtung (Quer- oder Hochformat) beschränkt. Sämtliche Inhalte passen sich automatisch der nutzergewählten Ausrichtung des Endgerätes an. |
| 1.4.1a Ohne Farben nutzbar |
Seite 1, Seite 2, Seite 3: Für die Bedienung ist die Wahrnehmung von Farben nicht erforderlich. Ebenso für das Verständnis der Inhalte. Farben dienen ausschliesslich optischen Optimierungen. |
| 1.4.4a Text auf 200% vergrößerbar |
Seite 1, Seite 2, Seite 3: Der Text kann mit der Zoom-Funktion des Browsers und vom CMS zur Verfügung gestellten Mitteln um bis zu 200 Prozent vergrößert werden, ohne dass dabei Inhalt oder Funktionalität verloren geht. |
| 1.4.5a Verzicht auf Schriftgrafiken |
Seite 1, Seite 2: Reine Schriftgrafiken werden nicht eingesetzt. An vereinzelten Stellen kommt Schrift in einer Grafik vor, diese ist aber stets durch begleitende Texte und/oder durch Altternativtexte ausgezeichnet. Seite 3: Reine Schriftgrafiken werden nicht eingesetzt. An einer Stelle im Kopfbereich der Seite (Logo) kommt Schrift in einer Grafik vor, welche aber durch einen Alternativtext ausgezeichnet ist. |
| 1.4.10a Inhalte brechen um |
Seite 1, Seite 2, Seite 3: Die Inhalte lassen sich auch bei einer kleinen Breite des Browserfensters von 320 CSS-Pixeln ohne Verlust der Funktionalität oder Informationen nutzen. Ein horizontales Scrollen ist ebenfalls nicht erforderlich. |
| 1.4.12a Textabstände anpassbar |
Seite 1, Seite 2, Seite 3: Zeilen- Absatz- Wort- und Buchstaben-Abstände lassen sich von Nutzern auf folgende Werte einstellen, ohne dass Inhalte oder Funktionalitäten verloren gehen: Zeilen: 1,5-fache Textgröße; Abstände nach Absätzen: 2-fache Textgröße; Buchstaben-Kerning: 0,12-fache Textgröße; Wortabstände: 0,16-fache Textgröße. |
| 2.1.1a Ohne Maus nutzbar |
Seite 1, Seite 2, Seite 3: Ohne der Verwendung einer Maus können alle wesentlichen Funktionen und Inhalte genutzt werden. Über die Tabulator-Taste sind alle wesentlichen Links und Funktionen erreichbar. |
| 2.1.2a Keine Tastaturfalle |
Seite 1, Seite 2, Seite 3: Es gibt keine Tastaturfallen. Alle wesentlichen Inhalte und Funktionen sind mit der Tastatur erreichbar. |
| 2.1.4a Tastatur-Kurzbefehle abschaltbar oder anpassbar |
Seite 1, Seite 2, Seite 3: Durch das Drücken der Tasten (alle Nummern- Buchstaben-, Symbol- und Zeichensetzungs-Tasten) geschehen keinerlei Änderungen des Inhalts oder des Kontexts. |
| 2.2.1a Zeitbegrenzungen anpassbar |
Seite 1, Seite 2, Seite 3: Zeitbegrenzungen sind nicht vorhanden. |
| 2.3.1a Verzicht auf Flackern |
Seite 1, Seite 2, Seite 3: Die Seite verfügt über keine Elemente, die in einem Zeitraum von einer Sekunde häufiger als dreimal aufblitzen. |
| 2.4.2a Sinnvolle Dokumenttitel |
Seite 1, Seite 2, Seite 3: Der Dokumenttitel besteht aus zwei Bestandteilen die durch einen Bindestrich getrennt sind: eine immer gleiche, allgemeine Bezeichnung des Webauftritts und führend eine unterscheidende, individuelle Bezeichnung der jeweiligen Seite. Der Dokumenttitel ist für die Unterscheidung und Auswahl von Seiten geeignet. |
| 2.4.3a Schlüssige Reihenfolge bei der Tastaturbedienung |
Seite 1, Seite 2, Seite 3: Links und Objekte werden mit der Tabulatortaste in einer schlüssigen Reihenfolge angesteuert. Die Tabulatorreihenfolge folgt im Wesentlichen der visuellen Anordnung auf dem Bildschirm von oben nach unten und von links nach rechts. |
| 2.4.4a Aussagekräftige Linktexte |
Seite 1, Seite 2, Seite 3: Linktexte sind durch den Linktext selbst oder über den programmatisch ermittelbaren Kontext aussagekräftig und verständlich. |
| 2.4.5a Alternative Zugangswege |
Seite 1, Seite 2, Seite 3: Es sind drei unterschiedliche Zugangswege zu den Inhalten des Angebots vorhanden. Es sind durchgängig verfügbare Navigationsmenüs vorhanden, es existiert ein Inhaltsverzeichnis und es gibt eine Suchfunktion, welche gut erkennbar auf jeder Seite platziert ist. |
| 2.4.6a Aussagekräftige Überschriften und Beschriftungen |
Seite 1: Überschriften sind klar und aussagekräftig. Es sind keine Formularfelder vorhanden. Seite 2: Überschriften sind klar und aussagekräftig und beschreiben den folgenden Inhaltsteil. Die Beschriftungen der Formularfelder sind sinngebend. Seite 3: Der Seiteninhalt besteht hauptsächlich aus einer Tabelle. Diese Tabelle ist strukturell richtig aufgebaut, die Überschriften sind mit dem Tag <th> ausgezeichnet, und sind im Zusammenhang mit den durch sie strukturierten Inhalten aussagekräftig. Es sind keine Formularfelder vorhanden. |
| 2.4.7a Aktuelle Position des Fokus deutlich |
Seite 1, Seite 2, Seite 3: Der Tastaturfokus wird überall genau so deutlich hervorgehoben werden wie der Mausfokus. |
| 3.1.1a Hauptsprache angegeben |
Seite 1, Seite 2, Seite 3: Die Hauptsprache der Webseite ist korrekt im HTML-Tag angegeben. |
| 3.2.1a Keine unerwartete Kontextänderung bei Fokus |
Seite 1, Seite 2, Seite 3: Der Fokuserhalt führt nicht zu einer unerwarteten Änderung des Kontexts. |
| 3.2.2a Keine unerwartete Kontextänderung bei Eingabe |
Seite 2: Nutzereingaben in den Formularfeldern führen nicht zu unerwarteten oder nicht angekündigten Kontext-Änderungen. |
| 3.2.3a Konsistente Navigation |
Seite 1, Seite 2, Seite 3: Navigationsmechanismen und Menüeinträge des Webauftritts sind gleich angeordnet und gestaltet. In der linken Spalte befindet sich stets die Hauptnavigation und der Fußbereich enthält auf allen Seiten Weiterführende Links. |
| 3.2.4a Konsistente Bezeichnung |
Seite 1, Seite 2, Seite 3: Die Navigationsmechanismen und Funktionen, die innerhalb des Webauftritts wiederholt eingesetzt werden, sind stets einheitlich bezeichnet. |
| 3.3.1a Fehlererkennung |
Seite 2: Wenn das Formular Fehlermeldungen erzeugt, werden die fehlerhaft ausgefüllten Felder identifiziert und der Fehler wird in Textform beschrieben. Nach Korrektur der Eingaben und erneutem Abschicken des Formulars verschwinden die zuvor angezeigten Fehlermeldungen. |
| 3.3.2a Beschriftungen von Formularelementen vorhanden |
Seite 2: Beschriftungen sind bei allen Formularelementen vorhanden. Jedem Formularelement ist eine passende Beschriftung links vorangestellt. |
| 3.3.3a Hilfe bei Fehlern |
Seite 2: Wird ein Eingabefehler automatisch festgestellt, wird der Fehler in Textform beschrieben. Die erzeugten Fehlermeldungen sind verständlich und geben Hinweise, wie der Fehler zu korrigieren ist. |
| 4.1.1a Korrekte Syntax |
Seite 1: Das Prüfergebnis des W3C-HTML-Validators nach Anwendung des "WCAG parsing only" Bookmarklet ist positiv. Die verwendete Markup-Sprache HTML wird korrekt eingesetzt. Seite 2: Das Prüfergebnis des W3C-HTML-Validators nach Anwendung des "WCAG parsing only" Bookmarklet ist positiv. Die verwendete Markup-Sprache HTML wird korrekt eingesetzt. |
| 4.1.2a Name, Rolle, Wert verfügbar |
Seite 1, Seite 2, Seite 3: Es gibt keine Links oder Schaltflächen ohne "href". Es gibt keine Formularelemente wie Checkboxen oder Radio-Buttons, die von der systemüblichen Darstellung abweichen, da sie mit anderen Elementen wie div oder img nachgebildet wurden. Es gibt keine selbstgebauten Widgets. |
eher erfüllt sind 6 Prüfschritte:
| Prüfschritt | Kommentar |
|---|---|
| 1.3.1d Inhalte gegliedert |
Seite 1, Seite 2: Alle Absätze sind mit p ausgezeichnet, für Hervorhebungen wird strong verwendet. Es werden vereinzelt Zeilenumbrüche genutzt um Absätze zu schaffen. Es wird kein Text per CSS eingebunden. |
| 1.3.3a Ohne Bezug auf sensorische Merkmale nutzbar |
Seite 1, Seite 2, Seite 3: Textliche Verweise verzichten größtenteils auf sensorische Merkmale wie Farbe, Form, Größe oder Position. An den Stellen, an denen sensorische Merkmale erforderlich sind, werden diese stets durch erklärende Texte ergänzt. |
| 1.4.3a Kontraste von Texten ausreichend |
Seite 1, Seite 2: Die meisten Texte haben ausreichende Helligkeitskontraste. Einige wenige Texte haben einen Helligkeitskontrast von 4.4:1, dies umfasst Texte mit der Farbe #008000 (grün). Seite 3: Die meisten Texte haben ausreichende Helligkeitskontraste. Einige wenige Texte haben einen Helligkeitskontrast von 4.2:1, dies umfasst Texte mit der Farbe #008000 (grün). |
| 1.4.11a Kontraste von Grafiken und grafischen Bedienelementen ausreichend |
Seite 1, Seite 2: Die Lupe zum Suchen im Headerbereich verfügt über einen Kontrastwert von 2.4:1. Dieser Wert ergibt sich aus einem Grauton im Vordergrund # a8a5a5 auf einem Hintergrund FFF. Alle anderen Icons umfassen einen Kontrast von mindestens 9.6:1. Seite 3: Die Lupe zum Suchen im Headerbereich verfügt über einen Kontrastwert von 2.4:1. Dieser Wert ergibt sich aus einem Grauton im Vordergrund #a8a5a5 auf einem Hintergrund #FFF. Der verlinkte Briefumschlag innerhalb der Mitarbeiter-Tabelle besitzt zudem einen Kontrastwert von mindestens 3.1:1 nach außen und 1.1:1 nach innen. Alle anderen Icons umfassen einen Kontrast von mindestens 9.6:1. |
| 2.4.1a Bereiche überspringbar |
Seite 1, Seite 2: Die Seite ist teilweise mit Überschriften und Spalten strukturiert. Diese Struktur ist unabhängig von der Darstellung auf dem Bildschirm zugänglich und nutzbar. Es werden sinnvolle Bereichsüberschriften mit HTML-Strukturelementen h1-h4 verwendet. Seite 3: Der Seiteninhalt besteht hauptsächlich aus einer Tabelle. Diese Tabelle ist strukturell richtig aufgebaut, Zeilen- und Spaltenüberschriften sind mit dem Tag <th> ausgezeichnet. Es werden sinnvolle Bereichsüberschriften mit HTML-Strukturelementen h1-h4 verwendet. |
| 2.5.3a Sichtbare Beschriftung Teil des zugänglichen Namens |
Seite 1: Bei einigen Bedienelementen mit Beschriftungen, die Text oder Bilder von Text enthalten, enthält der zugängliche Name den sichtbaren Text. Dies sind alle Links im Fußbereich und die Links in der rechten Spalte (Nächste Termine). Es gibt auch Bedienelemente, die durch mehrere sichtbare Elemente beschriftet sind, hierauf ist dieser Schritt nicht anwendbar. Seite 2: Bei einigen Bedienelementen mit Beschriftungen, die Text oder Bilder von Text enthalten, enthält der zugängliche Name den sichtbaren Text. Dies sind alle Links im Fußbereich und die Links in der rechten Spalte (Nächste Termine). Seite 3: Bei Bedienelementen mit Beschriftungen, die Text oder Bilder von Text enthalten, enthält der zugängliche Name den sichtbaren Text. Dies sind alle Links im Fußbereich und die Links innerhalb der Mitarbeiter-Tabelle. |
nicht anwendbar sind 24 Prüfschritte:
| Prüfschritt | Kommentar |
|---|---|
| 1.1.1c Leere alt-Attribute für Layoutgrafiken |
Seite 1, Seite 2, Seite 3: Es werden keinerlei Grafiken eingesetzt, die rein dem Layout dienen. |
| 1.1.1d Alternativen für CAPTCHAs |
Seite 1, Seite 3: Es werden keine CAPTCHAs auf dieser Seite verwendet. |
| 1.2.1a Alternativen für Audiodateien und stumme Videos |
Seite 1, Seite 2, Seite 3: Kein Einsatz von Audiodateien in denen Informationen vermittelt werden. Kein Einsatz von stummen Videos oder Animationen. Medienalternativen in Form von Transkriptionen werden daher ebenfalls nicht angeboten. |
| 1.2.2a Aufgezeichnete Videos mit Untertiteln |
Seite 1, Seite 2, Seite 3: Es werden keine Videoaufzeichnungen verwendet. |
| 1.2.3a Audiodeskription oder Volltext-Alternative für Videos |
Seite 1, Seite 2, Seite 3: Es werden keine Videoaufzeichnungen verwendet. |
| 1.2.4a Videos (live) mit Untertiteln |
Seite 1, Seite 2, Seite 3: Kein Einsatz von Live-Übertragungen. |
| 1.2.5a Audiodeskription für Videos |
Seite 1, Seite 2, Seite 3: Es werden keine Videoaufzeichnungen verwendet. |
| 1.3.1c HTML-Strukturelemente für Zitate |
Seite 1, Seite 2, Seite 3: Es werden keine Zitate auf der Seite verwendet. |
| 1.3.1f Zuordnung von Tabellenzellen |
Seite 1, Seite 2, Seite 3: Komplexe Datentabellen sind nicht vorhanden, in der einzigen einfachen Datentabellen wird berechtigterweise auf Überschriften verzichtet. |
| 1.3.1g Kein Strukturmarkup für Layouttabellen |
Seite 1, Seite 2, Seite 3: Tabellen werden nicht für Layoutfunktionen verwendet. |
| 1.3.1h Beschriftung von Formularelementen programmatisch ermittelbar |
Seite 1, Seite 3: Auf der Seite werden keine Formulare verwendet. |
| 1.3.5a Eingabefelder zu Nutzerdaten vermitteln den Zweck |
Seite 1, Seite 3: Es gibt keine Eingabefelder, die sich auf Daten des Nutzers beziehen. |
| 1.4.2a Ton abschaltbar |
Seite 1, Seite 2, Seite 3: Die Seite hat keine Tonelemente, die automatisch abgespielt werden. |
| 1.4.13a Eingeblendete Inhalte bedienbar |
Seite 1, Seite 2, Seite 3: Es gibt keine zusätzliche Inhalte, die mittels Zeiger- oder Tastaturfokussierung eingeblendet werden. |
| 2.5.1a Alternativen für komplexe Zeiger-Gesten |
Seite 1, Seite 2, Seite 3: Die Seite enthält keine pfadbasierten Gesten oder Mehrpunkt Gesten. |
| 2.5.2a Zeigergesten-Eingaben können abgebrochen oder widerrufen werden |
Seite 1, Seite 2, Seite 3: Die Seite enthält keine pfadbasierten Gesten oder Mehrpunkt Gesten. |
| 2.5.4a Alternativen für Bewegungsaktivierung |
Seite 1, Seite 2, Seite 3: Es gibt keine Funktionen, die über Gerätebewegung oder Benutzerbewegung ausgelöst werden können. |
| 3.1.2a Anderssprachige Wörter und Abschnitte ausgezeichnet |
Seite 1, Seite 2, Seite 3: Anderssprachige Wörter und Abschnitte sind nicht vorhanden. |
| 3.2.2a Keine unerwartete Kontextänderung bei Eingabe |
Seite 1, Seite 3: Die Seite enthält keine Formularelemente. |
| 3.3.1a Fehlererkennung |
Seite 1, Seite 3: Es gibt keine Formularfelder auf der Seite. |
| 3.3.2a Beschriftungen von Formularelementen vorhanden |
Seite 1, Seite 3: Es gibt keine Formularfelder auf der Seite. |
| 3.3.3a Hilfe bei Fehlern |
Seite 1, Seite 3: Es gibt keine Formularfelder auf der Seite. |
| 3.3.4a Fehlervermeidung wird unterstützt |
Seite 1, Seite 2, Seite 3: Die Seite enthält keine Formulare für Transaktionen durch die Nutzer rechtlich bindende Verpflichtungen eingehen. |
| 4.1.3a Statusmeldungen programmatisch verfügbar |
Seite 1, Seite 2, Seite 3: Es werden keine Statusmeldungen auf der Seite erzeugt. |
nicht erfüllt ist 1 Prüfschritt:
| Prüfschritt | Kommentar |
|---|---|
| 1.1.1b Alternativtexte für Grafiken und Objekte |
Seite 1, Seite 2, Seite 3: Die einzigen vier informativen Grafiken (eingebunden per "Font awesome" im Fußbereich) haben keinen Alternativtext, da nicht mit img gearbeitet wird. |
| 1.1.1d Alternativen für CAPTCHAs |
Seite 2: Die eingesetzten CAPTCHAs in Formularen sind bildbasiert. Der Alternativtext des Bildes lautet "Captcha-Bild". Es beschreibt aktuell daher nicht den Zweck des CAPTCHAs. Mangels einer Bildalternative, wird auch nicht beschrieben, wie eine solche aufzufinden ist. |
| 4.1.1a Korrekte Syntax |
Seite 3: Das Prüfergebnis des W3C-HTML-Validators ist auch nach Anwendung des "WCAG parsing only" Bookmarklet negativ. |
teilweise erfüllt sind 3 Prüfschritte:
| Prüfschritt | Kommentar |
|---|---|
| 1.1.1a Alternativtexte für Bedienelemente |
Seite 1, Seite 2, Seite 3: Die Alternativtexte sind generell vorhanden, könnten allerdings an einigen Stellen aussagekräftiger sein. Für die Bedienelemente (Lupe mit Suchfunktion, Haus mit Link zur Startseite) im Header liegen keine Alternativtexte vor. Das gleiche gilt für die Elemente im Fußbereich der Seite (drucken, nach oben). |
| 1.3.1a HTML-Strukturelemente für Überschriften |
Seite 1, Seite 2, Seite 3: Die Seite verfügt über Überschriften. Diese sind jedoch nicht überall hierarchisch in ihrer Reihenfolge untergliedert. So befindet sich z.B. im Kopfbereich der Seite eine h4, gefolgt von einer h1 im Inhaltsbereich. |
| 1.3.1d Inhalte gegliedert |
Seite 3: Alle Absätze sind mit p ausgezeichnet, für Hervorhebungen wird strong verwendet. Es werden vermehrt innerhalb des Inhaltsbereichts, Zeilenumbrüche bzw. leere Paragraphen-Elemente genutzt, um Umbrüche zu schaffen. Es wird kein Text per CSS eingebunden. |
| 1.3.5a Eingabefelder zu Nutzerdaten vermitteln den Zweck |
Seite 2: Eingabefelder, die sich auf den Nutzer selbst beziehen, bezeichnen den Zweck nur über das type Attribut (z.B. type="email"), es werden keine autocomplete-Attribute verwendet. |
| 2.2.2a Bewegte Inhalte abschaltbar |
Seite 1, Seite 2, Seite 3: Bewegte Inhalte sind im Headerbereich vorhanden. Es gibt keine Möglichkeit, diese anzuhalten. |
Feedback und Kontakt
Sind Ihnen Mängel beim barrierefreien Zugang zu Inhalten von www.roggenburg.de aufgefallen?
Dann können Sie sich gerne bei uns melden. Bitte benutzen Sie dafür das vorgesehene Feedback-Formular.