Selbstevaluierung der Barrierefreiheit
Diese Website wurde im Juli 2025 auf Einhaltung der WCAG-2.2 Kriterien (öffnet in neuem Tab) („Web Content Accessibility Guidelines“) selbst evaluiert und die Ergebnisse der Vortests auf dieser Seite dokumentiert. Die Vorgehensweise orientiert sich an den Empfehlungen der WAI („Web Accessibility Initiative“), abrufbar unter Evaluating Web Accessibility (öffnet in neuem Tab).
Vortests
Nach den von der WAI empfohlenen „Easy Checks“ haben wir die folgenden Seiten als repräsentativ für Tests ausgewählt:
- Startseite wegen speziellem Karten-Layout und Sektionen
- Unterseite „Barrierefreiheit“ als Vorlage für normale Unterseiten
- Unterseite „Blog“ wegen speziellem Layout für Paging und Teaser
- diese Unterseite wegen speziellem Layout mit Akkordions und Tabellen
Die Vortests erfolgten mit den Browsern Firefox und Chrome sowie gängigen Tools für Kontrastprüfungen, HTML-Analysen, etc.
Die Tabellen mit den Ergebnissen sind je Seite ein- und ausklappbar, mit der ersten Tabelle wird die Bedeutung der Spalten kurz erläutert.
| Pos. | Prüfung | Kommentar | OK |
|---|---|---|---|
| 1 | Titel beschreibt Webseite kurz und prägnant. | Titel der Startseite „IT-Partner in Wien - Müller & Kanduth OG“ ist in Browser-Tab sichtbar. | J |
| 2 | Andere Seitentitel sind unterscheidbar und geben kurze Beschreibung. | Andere Seiten zeigen entsprechende Titel mit Anhang „- Müller & Kanduth OG“. | J |
| 3 | Das „alt“-Attribut ist bei Grafiken vorhanden bzw. treffend. | Die „alt“-Attribute sind bei Grafiken vorhanden, rein dekorative Grafiken sind mit leerem alt-Attribut ausgezeichnet, das Hintergrundbild ist rein dekorativ und daher in CSS implementiert. | J |
| 4 | Aktionen hinter Symbolgrafiken müssen beschrieben sein. | Logo weist auf Link „zur Startseite“ hin, Sprachumschalter mit „Switch Language to English“ vom Screenreader vorgelesen. CSS-Symbolgrafiken mit :before eingefügt, sind rein dekorativ | J |
| 5 | Überschriften-Struktur prüfen | Unter einer H1-Überschrift wird bis H3 hierarchisch richtig verschachtelt. | J |
| 6 | Kontraste müssen ausreichend sein | Kontraste Text gegen Hintergrund sind über 4,5:1 und Unterstreichungen über 3:1 Kontrastverhältnis. | J |
| 7 | Textvergrößerung auf 200% prüfen | Nur Texte und Logo 2-fach vergrößert, Bilder bleiben gleich, kein Text ausserhalb von Boxen, alle Elemente sichtbar ohne Überlappungen, kein horizontales Scrolling nötig. | J |
| 8 | Textabstände vergrößern | Die Zeichen- und Wortabstände sind vergrößerbar ohne Verlust an Information oder horizontalem Scrolling | J |
| 9 | Links und Buttons sind mit Tastatur erreichbar. | Mit TAB-Taste sind alle Links erreichbar, Fokus sichtbar in ausreichendem Kontrast, Hinweis auf Öffnen in neuem Browser-Tab erfolgt. | J |
| 10 | Tabulator-Reihenfolge | Die Reihenfolge der TAB-Ziele folgt der Leserichtung, alle Ziele sind erreichbar. | J |
| 11 | Drop-Down Menüs | Hamburgermenü wird mit ENTER-Taste geöffnet, Menüpunkte mit TAB erreichbar, Verlassen mit ESC-Taste funktioniert, Fokus wird richtig gesetzt. | J |
| 12 | Strukturprüfung Bilder und Darstellung | Nach Abschaltung von Bildern und CSS ist die Seite noch lesbar und bedienbar. Das Hauptmenü kann allerdings nicht mehr Bildschirmgrößen unterscheiden, daher sind die Links doppelt vorhanden. Links in der Fußzeile sind nebeneinander dargestellt. | J |
| 13 | Die Sprache der Seite ist definiert. | Sprache ist für die Seite korrekt und ändert sich mit Sprachumschalter. | J |
- Spalte „Pos.“: Position bzw. eindeutige Nummerierung des Tests
- Spalte „Prüfung“: Beschreibung der Prüfung bzw. Anforderung
- Spalte „OK“: zeigt ein „J“ für „bestanden“ und ein „N“ für „nicht bestanden“
| Pos. | Prüfung | Kommentar | OK |
|---|---|---|---|
| 1 | Titel beschreibt Webseite kurz und prägnant. | Titel der Seite „Barrierefreiheit - Müller & Kanduth OG“ ist in Browser-Tab sichtbar. | J |
| 2 | Andere Seitentitel sind unterscheidbar und geben kurze Beschreibung. | Mit Startseite schon geprüft. | J |
| 3 | Das „alt“-Attribut ist bei Grafiken vorhanden bzw. treffend. | Mit Startseite schon getestet, die „alt“-Attribute sind bei Grafiken vorhanden, rein dekorative Grafiken sind mit leerem alt-Attribut ausgezeichnet. Die „Plus“ und „Minus“ Symbole bei Listeneinträgen werden vom Screenreader mit „Aufzählungszeichen Plus“ und „Minus“ vorgelesen. | J |
| 4 | Aktionen hinter Symbolgrafiken müssen beschrieben sein. | Logo/Sprachumschalter schon mit Startseite geprüft, CSS-Symbolgrafiken mit :before eingefügt, sind rein dekorativ. | J |
| 5 | Überschriften-Struktur prüfen | Unter einer H1-Überschrift wird bis H3 hierarchisch richtig verschachtelt. | J |
| 6 | Kontraste müssen ausreichend sein | Kontraste Text gegen Hintergrund sind über 4,5:1 und Unterstreichungen über 3:1 Kontrastverhältnis. | J |
| 7 | Textvergrößerung auf 200% prüfen | Nur Texte und Logo 2-fach vergrößert, Bilder bleiben gleich, kein Text ausserhalb von Boxen, alle Elemente sichtbar ohne Überlappungen, kein horizontales Scrolling nötig. | J |
| 8 | Textabstände vergrößern | Die Zeichen- und Wortabstände sind vergrößerbar ohne Verlust an Information oder horizontalem Scrolling | J |
| 9 | Links und Buttons sind mit Tastatur erreichbar. | Mit TAB-Taste sind alle Links erreichbar, Fokus sichtbar in ausreichendem Kontrast, Hinweis auf Öffnen in neuem Browser-Tab erfolgt. | J |
| 10 | Tabulator-Reihenfolge | Die Reihenfolge der TAB-Ziele folgt der Leserichtung, alle Links sind erreichbar. | J |
| 11 | Drop-Down Menüs | Hamburgermenü wurde mit Startseite schon getestet. | J |
| 12 | Strukturprüfung Bilder und Darstellung | Nach Abschaltung von Bildern und CSS ist die Seite noch lesbar und bedienbar. Hauptmenü und Fußzeile wurden mit der Startseite schon geprüft. | J |
| 13 | Die Sprache der Seite ist definiert. | Sprache ist für die Seite korrekt und ändert sich mit Sprachumschalter. | J |
| Pos. | Prüfung | Kommentar | OK |
|---|---|---|---|
| 1 | Titel beschreibt Webseite kurz und prägnant. | Titel der Seite „Blog - Müller & Kanduth OG“ ist in Browser-Tab sichtbar. | J |
| 2 | Andere Seitentitel sind unterscheidbar und geben kurze Beschreibung. | Mit Startseite schon geprüft. | J |
| 3 | Das „alt“-Attribut ist bei Grafiken vorhanden bzw. treffend. | Mit Startseite schon getestet, die „alt“-Attribute sind bei den dekorativen Grafiken der Teaser mit leerem alt-Attribut ausgezeichnet. | J |
| 4 | Aktionen hinter Symbolgrafiken müssen beschrieben sein. | Logo/Sprachumschalter schon mit Startseite geprüft. | J |
| 5 | Überschriften-Struktur prüfen | Unter einer H1-Überschrift nur H2 der Teaser vorhanden. | J |
| 6 | Kontraste müssen ausreichend sein | Kontraste Text gegen Hintergrund sind über 4,5:1 und Unterstreichungen über 3:1 Kontrastverhältnis. | J |
| 7 | Textvergrößerung auf 200% prüfen | Nur Texte und Logo 2-fach vergrößert, Bilder bleiben gleich, kein Text ausserhalb von Boxen, alle Elemente sichtbar ohne Überlappungen, kein horizontales Scrolling nötig. | J |
| 8 | Textabstände vergrößern | Die Zeichen- und Wortabstände sind vergrößerbar ohne Verlust an Information oder horizontalem Scrolling | J |
| 9 | Links und Buttons sind mit Tastatur erreichbar. | Mit TAB-Taste sind alle Links erreichbar, Fokus sichtbar in ausreichendem Kontrast, Buttons für Blätterfunktion von Screenreader richtig vorgelesen. | J |
| 10 | Tabulator-Reihenfolge | Die Reihenfolge der TAB-Ziele folgt der Leserichtung, alle Links sind erreichbar. | J |
| 11 | Drop-Down Menüs | Hamburgermenü wurde mit Startseite schon getestet. | J |
| 12 | Strukturprüfung Bilder und Darstellung | Nach Abschaltung von Bildern und CSS ist die Seite noch lesbar und bedienbar, nur die SVG-Pfeile der Blätterfunktion sind zu groß. Hauptmenü und Fußzeile wurden mit der Startseite schon geprüft. | J |
| 13 | Die Sprache der Seite ist definiert. | Sprache ist für die Seite korrekt und ändert sich mit Sprachumschalter. | J |
| Pos. | Prüfung | Kommentar | OK |
|---|---|---|---|
| 1 | Titel beschreibt Webseite kurz und prägnant. | Titel der Seite „Selbstevaluierung der Barrierefreiheit - Müller & Kanduth OG“ ist in Browser-Tab sichtbar. | J |
| 2 | Andere Seitentitel sind unterscheidbar und geben kurze Beschreibung. | Mit Startseite schon geprüft. | J |
| 3 | Das „alt“-Attribut ist bei Grafiken vorhanden bzw. treffend. | Mit Startseite getestet, keine zusätzlichen Grafiken vorhanden. | J |
| 4 | Aktionen hinter Symbolgrafiken müssen beschrieben sein. | Logo/Sprachumschalter schon mit Startseite geprüft. | J |
| 5 | Überschriften-Struktur prüfen | Unter einer H1-Überschrift richtig bis H3 vorschachtelt. | J |
| 6 | Kontraste müssen ausreichend sein | Kontraste Text gegen Hintergrund und Tabellendesign sind über 4,5:1 sowie Unterstreichungen über 3:1 Kontrastverhältnis. | J |
| 7 | Textvergrößerung auf 200% prüfen | Nur Texte und Logo 2-fach vergrößert, Bilder bleiben gleich, alle Elemente sichtbar ohne Überlappungen, kein horizontales Scrolling nötig außer Tabellen inhaltsabhängig wenn aufgeklappt. | J |
| 8 | Textabstände vergrößern | Die Zeichen- und Wortabstände sind vergrößerbar ohne Verlust an Information oder horizontalem Scrolling außer bei Tabellen wenn aufgeklappt. | J |
| 9 | Links und Buttons sind mit Tastatur erreichbar. | Mit TAB-Taste sind alle Links und Akkordion-Schalter erreichbar, Fokus sichtbar in ausreichendem Kontrast, Buttons für Ein-/Ausklappen von Screenreader richtig vorgelesen. | J |
| 10 | Tabulator-Reihenfolge | Die Reihenfolge der TAB-Ziele folgt der Leserichtung, alle Links sind erreichbar. | J |
| 11 | Drop-Down Menüs | Hamburgermenü wurde mit Startseite schon getestet. | J |
| 12 | Strukturprüfung Bilder und Darstellung | Nach Abschaltung von Bildern und CSS ist die Seite noch lesbar und auch das Akkordion bedienbar, nur SVG-Pfeile überblendet. Hauptmenü und Fußzeile wurden mit der Startseite schon geprüft. | J |
| 13 | Die Sprache der Seite ist definiert. | Sprache ist für die Seite korrekt und ändert sich mit Sprachumschalter. | J |