Accessify Blog
Barrierefreiheit praktisch erklärt
Anleitungen mit Codebeispielen und Selbsttests. Die Zahlen stammen aus unserer Prüfung von 14.984 deutschen Firmenwebsites.
Kontrast reparieren, ohne das Design zu verlieren
Wie ein Kontrastverhältnis entsteht, wo die drei Schwellen liegen und warum oft ein einziger Hex-Schritt reicht, um Text lesbar zu machen.
Wenn alle Links „hier“ heißen
Screenreader können alle Links einer Seite als nackte Liste ausgeben. Steht dort zehn Mal hier, führt diese Liste niemanden mehr irgendwohin.
Einfache Sprache und Leichte Sprache sind nicht dasselbe
Einfache Sprache und Leichte Sprache lösen zwei verschiedene Probleme, und ein Behördensatz in drei Fassungen zeigt, wann du welche brauchst.
Wer Untertitel wirklich liest, und warum das Transkript dazugehört
Ein großer Teil aller Videos in sozialen Netzwerken läuft ohne Ton, und genau deshalb lohnen sich Untertitel und ein Transkript auch auf deiner eigenen Website.
Was ohne Maus auf deiner Seite schiefgeht
Tabulatorreihenfolge, Schaltflächen aus div-Elementen und Menüs, die nur auf die Maus reagieren: die drei häufigsten Fallen und wie du sie findest.
Überschriften sind eine Gliederung, keine Schriftgrößen
Warum h1 bis h6 eine Gliederung sind und keine Schriftgrößen, mit Code für vorher und nachher.
Was Screenreadern hilft, hilft auch Suchmaschinen
Vier Stellen im Quelltext helfen Screenreadern und Suchmaschinen gleichzeitig, an vielen anderen hat Barrierefreiheit mit Rankings nichts zu tun.
Der Sprunglink, der auf fast jeder Website fehlt
Wie ein Sprunglink aufgebaut ist und wie du ihn mit einem Link und wenigen Zeilen CSS einbaust.
Warum viele PDFs für einen Teil deiner Besucher leer sind
Ein gescanntes PDF ohne Textebene ist für einen Screenreader nur ein Bild ohne Alternativtext, und du erkennst das selbst mit zwei Tastenkürzeln.
Warum dein Screenreader Deutsch mit englischem Akzent vorliest
Steht im html-Tag keine oder die falsche Sprache, liest die Vorlesestimme deutschen Text nach englischen Ausspracheregeln. Ein einziges Attribut stellt das ab.
ARIA hilft nur, wenn du es kaum benutzt
ARIA ändert nur die Ansage und nie das Verhalten, deshalb ist natives HTML fast immer die bessere Wahl, mit Code für vorher und nachher.
Der Fokusrahmen und die eine CSS-Zeile, die ihn löscht
outline: none entfernt in vielen Vorlagen den sichtbaren Fokusrahmen, und hier steht der Ersatz, der zum Design passt und trotzdem funktioniert.
Eine Zeile im Theme sperrt den Zoom auf dem Handy
Welche Angabe im Theme das Vergrößern auf dem Handy sperrt und wo du sie in WordPress, WooCommerce und Shopify findest.
Wie ein Screenreader deine Seite tatsächlich vorliest
So klingt deine Seite für jemanden, der sie nicht sieht, und so testest du es mit dem eingebauten Screenreader.
Animationen, die niemandem den Tag verderben
Ein CSS-Block, ein Pause-Button und ein kurzer Test machen deine Animationen auch für bewegungsempfindliche Besucher erträglich.
Landmarks machen deine Seite überspringbar
Wie header, nav, main und footer deine Seite für Screenreader in Abschnitte teilen.
Wenn das Suchfeld keinen Namen hat
Warum ein Platzhalter keine Beschriftung ersetzt und wie Suchfeld, Warenkorb und Fehlermeldungen einen Namen bekommen.
Was ein Barrierefreiheits-Widget kann und was nicht
Welche Hilfen ein Widget deinen Besuchern gibt und welche Fehler nur im Code behoben werden können.
Alternativtexte: was hineingehört und was nicht
Was ein guter Alternativtext enthält, wann alt leer bleiben muss und wie du deine Bilder selbst prüfst.