Links und Buttons sind die Stellen, an denen aus Anschauen Bedienen wird. Hier klickt jemand etwas an, schickt ein Formular ab oder springt zur nächsten Seite. Genau diese Stellen sind für viele Besucher der wunde Punkt.
Eine Seite kann gut aussehen und trotzdem unbedienbar sein, sobald die Links nichts sagen, ein Button gar nicht als Button erkennbar ist oder die Klickfläche für den Finger zu klein bleibt. Du brauchst dafür kein neues Design. Ein paar saubere Entscheidungen und ein prüfender Blick genügen.
Warum „hier klicken" scheitert
Ein Linktext sollte aus sich heraus verständlich sein. „Hier klicken" oder „mehr erfahren" funktioniert nur, solange Du den Satz drumherum mitliest. Genau das tut nicht jeder.
Viele Screenreader-Nutzer lassen sich eine Liste aller Links einer Seite vorlesen, um schnell zum Ziel zu springen. In dieser Liste steht der Link ohne seinen Kontext. Zehnmal „hier" hintereinander stiftet nur Ratlosigkeit statt Orientierung. Wie eine Seite überhaupt vom Screenreader vorgelesen wird, zeigt der eigene Beitrag dazu.
Schreib stattdessen ins Ziel: Der Linktext beschreibt, wohin er führt. Wie Du durchgehend sinnvolle Linktexte formulierst, vertieft der eigene Beitrag dazu. Aus „mehr erfahren" wird „Preise im Überblick", aus „hier klicken" wird „Kontaktformular öffnen". Aussagekräftige Linktexte tragen ihre Bedeutung schon im Wort, lange bevor jemand sie anklickt.
Vorsicht auch bei der Häufung: Wenn auf einer Seite drei Links denselben Text tragen, aber an verschiedene Ziele führen, verwirrt das jeden, der die Link-Liste abhört. Gib jedem Link einen eindeutigen Text. Öffnet ein Link überraschend einen neuen Tab oder lädt eine Datei herunter, gehört dieser Hinweis sichtbar in den Text. Dann sucht niemand den Zurück-Knopf vergeblich oder wundert sich über den plötzlichen Download.
Link oder Button — was der Unterschied verrät
Ein Link führt woanders hin, ein Button löst etwas aus. Diese kleine Trennung steckt voller Erwartung: Wer einen Link sieht, rechnet damit, eine neue Seite zu öffnen. Wer einen Button drückt, erwartet eine Aktion an Ort und Stelle, etwa ein abgeschicktes Formular oder ein aufgeklapptes Menü.
Wird das vertauscht, fühlt sich die Seite falsch an, noch bevor jemand den Grund benennen kann. Ein Button, der heimlich auf eine andere Seite wirft, reißt den Nutzer aus dem Kontext und untergräbt das Vertrauen in die nächste Schaltfläche.
Für Menschen mit Hilfssoftware wiegt diese Trennung noch schwerer. Der Screenreader kündigt vorab an, ob das Element ein Link oder eine Schaltfläche ist. Passt die Ansage nicht zum tatsächlichen Verhalten, läuft das Versprechen ins Leere.
Du musst dafür nichts über den Aufbau dahinter wissen. Achte beim Durchklicken aufs Gefühl: Bringt mich dieser Klick auf eine neue Seite oder passiert etwas hier? Wo Anschein und Wirkung auseinanderlaufen, liegt eine Stolperstelle für die Agentur.
Woran Du einen guten Button erkennst
Eine gute Schaltfläche sieht aus wie eine Schaltfläche. Sie hebt sich vom Fließtext ab und lädt zum Drücken ein. Wenn Besucher erst suchen müssen, was hier klickbar ist, hat die Gestaltung ihre wichtigste Aufgabe verfehlt.
Genauso zählt ein sprechender Name. Ein nacktes Symbol, etwa ein kleiner Mülleimer zum Löschen, sagt der Hilfssoftware nichts. Erst eine hinterlegte Beschriftung verrät, was beim Druck passiert. Prüf bei jedem Icon ohne Text, ob klar ist, welche Aktion es auslöst. Welche Symbole für alle verständlich bleiben, zeigt der eigene Beitrag dazu.
Diese drei Merkmale taugen als schnelle Sichtprüfung Deiner eigenen Seite:
- Erkennbar: Die Schaltfläche hebt sich klar vom umgebenden Text ab.
- Benannt: Auch ein reines Symbol trägt einen vorgelesenen Namen.
- Eindeutig: Der Text sagt, was passiert, statt bloß „los" oder „OK".
Findest Du eine Schaltfläche, die keines dieser Merkmale erfüllt, hast Du einen konkreten Punkt für die nächste Abstimmungsrunde. Eine saubere Bedienung beginnt damit, dass jeder Knopf seinen Zweck verrät.
Klickflächen groß genug für jeden Finger
Am Smartphone tippt niemand mit einem pixelgenauen Mauszeiger, sondern mit einer Fingerkuppe. Sitzen Links und Buttons zu eng oder zu klein, trifft man ständig daneben oder den Nachbarn.
Als Richtwert haben sich rund 44 mal 44 Pixel pro Klickfläche etabliert, etwa die Breite einer Fingerkuppe. Das gilt auch für reine Text-Links: ein wenig Luft rundherum vergrößert die anklickbare Fläche, ohne dass der Text größer wirkt. Zwischen zwei Schaltflächen gehört genug Abstand, damit kein Fehlgriff passiert.
Testen kannst Du das ganz ohne Werkzeug: Nimm Dein Handy, lege den Daumen ab und tippe die wichtigen Knöpfe der Reihe nach an. Wo Du den Nachbarn erwischst oder zielen musst, ist die Fläche zu klein. Genau dort verlieren ungeduldige Besucher die Lust.
Davon profitieren längst nicht nur Menschen mit motorischen Einschränkungen. Wer im Bus mit einer Hand tippt oder kalte Finger hat, trifft größere Ziele zuverlässiger. Großzügige Klickflächen sind komfortabler für alle.
Alles per Tastatur erreichen und sehen
Nicht jeder bedient eine Seite mit der Maus. Wer aus motorischen Gründen oder mit Hilfssoftware arbeitet, springt mit der Tab-Taste von Element zu Element. Jeder Link und jeder Button muss sich auf diesem Weg erreichen und mit Enter auslösen lassen. Wie sich eine Seite ganz ohne Maus bedienen lässt, vertieft der eigene Beitrag dazu.
Damit das gelingt, muss jederzeit sichtbar sein, wo der Fokus gerade steht. Eine Markierung wandert beim Tab-Durchlauf von Element zu Element, sie ist der Mauszeiger der Tastatur-Bedienung. Ohne sie tappt jeder im Dunkeln, der die Seite ohne Maus bedient.
Browser zeigen dafür von sich aus einen Rahmen um das aktive Element. In vielen Projekten wird er nachträglich entfernt, weil er als störend empfunden wird. Damit verschwindet die einzige Orientierung für alle, die ohne Maus unterwegs sind.
Der Fokus gehört also gestaltet statt entfernt. Ein klar sichtbarer Rahmen oder eine farbige Hervorhebung passt sich Deinem Design an und bleibt erkennbar. Sinnvoll sind außerdem drei unterscheidbare Zustände:
- Fokus: Das Element ist per Tastatur angesteuert und deutlich umrandet.
- Hover: Die Maus liegt darüber, der Zustand reicht aber allein nie aus.
- Besucht: Ein bereits geöffneter Link darf sich abheben, das spart Orientierung.
Bleibt beim Durchgehen jederzeit klar, wo Du gerade stehst, ist die halbe Miete erledigt. Verlierst Du selbst den Überblick, tut es jeder andere auch.
Fazit
Links und Buttons entscheiden, ob eine Seite bedienbar ist oder nur schön. Sag im Linktext, wohin er führt, gestalte Schaltflächen erkennbar und benannt, halte die Klickflächen fingergerecht und lass den Fokus sichtbar.
Keiner dieser Schritte braucht ein neues Design, nur Sorgfalt und einen Durchgang ohne Maus. Wer dieselbe Klarheit in seine barrierefreien Formulare trägt und sie in die Grundlagen der Barrierefreiheit einordnet, baut eine Seite, die unter mehr Bedingungen funktioniert.