Websites für jedes Alter und jede Fähigkeit gestalten

Denken Sie an die Vielfalt der Menschen, die Ihre Website an einem bestimmten Tag besuchen könnten. Ein Teenager, der auf einem kaputten Handybildschirm in einem fahrenden Bus surft. Ein vielbeschäftigter Elternteil, der halbwegs zuschaut, während er ein Kleinkind jongliert. Ein Großelternteil, der langsam liest und bei kleinem Text die Augen zusammenkneift. Jemand, der keine Maus benutzen kann und sich ausschließlich per Tastatur navigiert. Jemand, der farbenblind oder müde ist oder es einfach eilig hat. Jeder von ihnen verdient es, Ihre Website ohne Schwierigkeiten zu nutzen – und das Bemerkenswerte ist, dass das Design für all diese Menschen gleichzeitig keine Kompromisse bedeutet. Es bedeutet meistens eine bessere Website für alle.

Dies ist das Herzstück des inklusiven Designs: Erlebnisse zu schaffen, die für die größtmögliche Bandbreite von Menschen, über jedes Alter und jede Fähigkeit hinweg, funktionieren, ohne jemanden besonders hervorzuheben. In diesem Leitfaden werden wir untersuchen, wie das in der Praxis aussieht. Wir behandeln Lesbarkeit, Layout, die Art und Weise, wie Menschen physisch mit einer Seite interagieren, die Wege, die Sie sie beschreiten lassen, und die kleinen Entscheidungen, die leise willkommen heißen oder ausschließen. Nichts davon erfordert, dass Sie ein Spezialist sind. Es erfordert lediglich, dass Sie sich daran erinnern, dass Ihre Besucher wunderbar vielfältige Menschen sind, keine einzelne imaginäre Durchschnittsperson.

Inklusives Design ist kein Nischenanliegen

Es gibt einen hartnäckigen Mythos, dass das Design für ältere Menschen oder Menschen mit Behinderungen ein kleines, optionales Extra ist – ein Häkchen, das man setzt, wenn man Zeit hat. Die Realität ist das Gegenteil. Ein großer Teil der Bevölkerung hat irgendeine Form von Beeinträchtigung, sei es des Seh-, Hör-, Bewegungs- oder Aufmerksamkeitsvermögens, und dieser Anteil wächst, wenn die Bevölkerung altert. Hinzu kommen vorübergehende Situationen – ein gebrochener Arm, helles Sonnenlicht auf einem Bildschirm, ein lauter Raum – und fast jeder profitiert irgendwann von inklusiven Entscheidungen.

Inklusives Design ist eng mit der formellen Praxis der Barrierefreiheit verbunden, aber im Geiste etwas breiter und freundlicher. Während Barrierefreiheit oft auf die Einhaltung spezifischer Standards abzielt, stellt inklusives Design bei jeder Entscheidung eine einfachere Frage: Wen könnte dies ausschließen, und wie kann ich sie einbeziehen? Wenn Sie die technischen Grundlagen hinter diesen Prinzipien wünschen, ist unser Einführungstext zu den Grundlagen der Web-Barrierefreiheit die natürliche nächste Lektüre.

Text, den Menschen tatsächlich lesen können

Die häufigste Barriere im Web ist auch die am einfachsten zu behebende: Text, der zu klein, zu blass oder zu gedrängt ist. Lesbarer Text ist die Grundlage einer inklusiven Website, und er hilft absolut jedem, nicht nur denen mit schwächeren Augen.

Größe, Kontrast und Zeilenabstand

Beginnen Sie mit einer angenehmen Grundtextgröße – größer, als Designer oft instinktiv wählen. Geben Sie Ihren Zeilen großzügigen Abstand, damit sie nicht verschwimmen, und halten Sie die Zeilenlängen moderat, damit das Auge seinen Platz nicht verliert. Überprüfen Sie dann Ihren Kontrast: dunkler Text auf hellem Hintergrund oder hell auf dunkel, mit genügend Unterschied zwischen beiden, damit jemand mit eingeschränktem Sehvermögen ihn immer noch leicht lesen kann. Blassgrauer Text auf weißem Hintergrund mag einem jungen Designer mit perfektem Sehvermögen elegant erscheinen, schließt aber einen erheblichen Teil Ihres Publikums aus.

Lassen Sie die Leute die Größe ändern, ohne etwas zu beschädigen

Viele Leute zoomen hinein oder vergrößern die Textgröße ihres Geräts. Eine gut gebaute Website passt sich anmutig an, anstatt sich zu überlappen oder Wörter abzuschneiden. Diese Flexibilität überschneidet sich direkt mit den Prinzipien des Responsive Webdesign – ein Layout, das sich an die Bildschirmgröße anpasst, passt sich normalerweise auch an die Textgröße an.

Farbe, die keine versteckte Bedeutung trägt

Farbe ist ein wunderbares Werkzeug, aber sie darf niemals die einzige Art sein, wichtige Informationen zu kommunizieren. Eine klassische Falle ist ein Formular, das ein Feld rot färbt, um einen Fehler zu signalisieren – für jemanden, der Rot nicht von Grün unterscheiden kann, unsichtbar. Die Abhilfe besteht darin, Farbe mit einem zweiten Hinweis zu kombinieren: einer schriftlichen Nachricht, einem Symbol, einer Unterstreichung. Auf diese Weise bleibt die Bedeutung erhalten, egal wie eine Person Farben wahrnimmt. Der durchdachte Einsatz von Farben reiht sich ein in andere Entscheidungen, die eine Website poliert und professionell wirken lassen, anstatt chaotisch.

Design für Hände, nicht nur Augen

Wie Menschen physisch mit Ihrer Website interagieren, variiert enorm. Manche nutzen eine präzise Maus, andere einen Finger auf Glas, wieder andere nur eine Tastatur, und einige Hilfsmittel, die Sie vielleicht noch nie gesehen haben. Inklusives Design berücksichtigt all diese.

Machen Sie Ziele groß und verzeihend

Schaltflächen und Links sollten groß genug sein, um sie sicher antippen zu können, und weit genug voneinander entfernt, damit ein leicht daneben liegender Druck nicht das Falsche auslöst. Das hilft Menschen mit zittrigen Händen, großen Fingern oder in einem schwankenden Zug, also fast jedem irgendwann. Großzügige, gut verteilte Ziele sind auch ein Merkmal einer klaren visuellen Hierarchie, bei der wichtige Aktionen leicht zu finden und zu treffen sind.

Alles sollte mit der Tastatur funktionieren

Erstaunlich viele Menschen berühren niemals eine Maus und navigieren stattdessen mit der Tastatur oder einem Gerät, das diese nachahmt. Wenn Ihre Menüs, Schaltflächen und Formulare nur auf einen Klick reagieren, haben Sie diese Besucher ausgesperrt. Ein guter Test ist, Ihre eigene Maus beiseite zu legen und zu versuchen, eine wichtige Aufgabe nur mit der Tastatur zu erledigen. Wenn Sie stecken bleiben, werden sie es auch tun.

Einfache Wege schlagen clevere

Über das Aussehen und die Bedienung einer Seite hinaus geht es beim inklusiven Design darum, wie viel Sie von den Menschen verlangen. Lange Formulare, mehrstufige Kaufabwicklungen und verwirrende Formulierungen erhöhen alle die kognitive Belastung – den mentalen Aufwand, um etwas zu erledigen. Je höher diese Belastung, desto mehr Menschen brechen ab, und die ersten, die abbrechen, sind oft diejenigen, die bereits andere Barrieren haben.

Das Heilmittel ist Großzügigkeit: Fragen Sie nur nach dem, was Sie wirklich brauchen, unterteilen Sie lange Aufgaben in klare Schritte, verwenden Sie einfache Wörter anstelle von Fachjargon und sagen Sie den Leuten genau, was als Nächstes passieren wird. Dieselben Instinkte sind es, die eine Website tatsächlich dazu bringen, Besucher in Kunden umzuwandeln, denn die Reduzierung von Reibung hilft allen, nicht nur denen mit spezifischen Bedürfnissen. Wenn Menschen spüren, dass Mikrointeraktionen und Feedback klar und beruhigend sind, entspannen sie sich – ein Thema, das in unserem Beitrag über Mikrointeraktionen im Webdesign näher beleuchtet wird.

Bewegung und Ton, mit Sorgfalt behandelt

Animationen und automatisch abspielende Medien können entzücken – oder überfordern. Manche Menschen erleben Schwindel oder Unbehagen bei großen sich bewegenden Elementen, und andere empfinden plötzliche Geräusche als störend oder unmöglich zu verfolgen. Inklusives Design hält Bewegungen sanft, bietet den Menschen eine Möglichkeit, alles, was sich von selbst bewegt, anzuhalten oder zu stoppen, und verlässt sich niemals nur auf den Ton, um eine Bedeutung zu vermitteln. Eine kurze Bildunterschrift oder ein Transkript macht Video und Audio für Menschen, die es nicht hören können, und für jeden in einem ruhigen Büro oder einem lauten Café nutzbar.

Ältere Besucher verdienen besondere Aufmerksamkeit

Mit zunehmendem Alter neigen mehrere Dinge dazu, sich gleichzeitig zu verschieben: Das Sehvermögen lässt nach, die Feinmotorik wird weniger präzise und ungewohnte Muster brauchen länger zum Lernen. Ein älterer Besucher ist nicht weniger fähig, aber er verzeiht schlechtes Design weniger. Größerer Text, größere Schaltflächen, vorhersehbare Layouts und einfache Anweisungen helfen alle. Vermeiden Sie unbedingt trendige Interaktionen, die wichtige Dinge hinter Gesten oder unerklärten Symbolen verbergen. Das klarste Design ist das, das keiner Erklärung bedarf, und diese Klarheit ist Teil dessen, was eine starke Homepage für Erstbesucher jeden Alters funktionieren lässt.

Testen Sie mit echten, vielfältigen Menschen

Sie können jede Richtlinie der Welt lesen und trotzdem Probleme übersehen, die erst auftauchen, wenn ein echter Mensch versucht, Ihre Website zu nutzen. Das Wertvollste, was Sie tun können, ist, Menschen zu beobachten, die sich wirklich von Ihnen unterscheiden – unterschiedliche Altersgruppen, unterschiedliche Fähigkeiten, unterschiedlicher Komfort mit Technologie – wie sie echte Aufgaben erledigen. Ihre Stolpersteine werden Ihnen mehr lehren als jede Checkliste. Auch die Leistung spielt eine Rolle: Eine langsame, schwere Seite ist am schwierigsten für diejenigen mit älteren Geräten oder schwächeren Verbindungen, daher unterstützt das schlanke Halten der Dinge die Inklusion ebenso wie die mobile Leistung im Allgemeinen. Wenn Sie eine frische, fachkundige Meinung dazu wünschen, ob Ihre Website wirklich alle willkommen heißt, können Sie uns jederzeit kontaktieren.

Häufig gestellte Fragen

Referenzen

1. Weltgesundheitsorganisation. „Behinderung und Gesundheit.“ who.int.
2. W3C Web Accessibility Initiative. „Barrierefreiheit, Usability und Inklusion.“ w3.org.
3. Nielsen Norman Group. „Barrierefreiheit & Inklusives Design.“ nngroup.com.