UX-Gesetz 1

Fitts' Law verständlich erklärt

Fitts' Law beschreibt, dass sich ein Ziel schneller auswählen lässt, wenn es groß ist und nah am Ausgangspunkt der Bewegung liegt. In Benutzeroberflächen betrifft das vor allem Buttons, Links, Menüs und andere interaktive Flächen.

Was beschreibt Fitts' Law?

Das Gesetz verbindet zwei Faktoren miteinander: die Größe eines Ziels und die Entfernung zu diesem Ziel. Je kleiner ein Ziel ist, desto präziser muss der User es ansteuern. Je weiter es entfernt liegt, desto länger dauert die Bewegung dorthin. Beides zusammen beeinflusst, wie schnell und sicher eine Interaktion gelingt.

In der Praxis bedeutet das, dass zentrale Handlungen wie Absenden, Speichern oder Jetzt starten nicht klein oder versteckt sein sollten. Ein gutes Interface unterstützt den User, indem es wichtige Interaktionsflächen sichtbar, groß genug und an einer sinnvollen Position platziert.

Typische Anwendungsbeispiele

In einem Formular sollte der abschließende Button direkt unter dem letzten Feld stehen und nicht klein in einer Ecke verborgen sein. In mobilen Anwendungen sollten zentrale Navigationselemente mit dem Daumen gut erreichbar sein. In Dashboards oder Tools sollten häufig genutzte Aktionen größer und näher an den relevanten Inhalten positioniert sein als seltene Nebenfunktionen.

Besonders wichtig ist Fitts' Law auch bei Touch-Oberflächen. Ein Finger arbeitet weniger präzise als ein Mauszeiger. Zu kleine Touch-Ziele führen deshalb schnell zu Fehleingaben, Frustration und Verlangsamung.

Interaktive Demonstration

Unten siehst du zwei Ziele. Eines ist klein und weit oben rechts platziert. Das andere ist groß und nah im unteren linken Bereich des jeweiligen Containers. Beide lösen dieselbe Art von Aktion aus. Die Seite macht damit den Unterschied zwischen schwerer und leichter Erreichbarkeit direkt erfahrbar.

Kleines, entferntes Ziel

Mehr Präzision, mehr Aufwand, höhere Fehleranfälligkeit

Großes, nahes Ziel

Schneller erreichbar und leichter zu treffen
Große primäre Schaltflächen
Die wichtigsten Handlungen dieser Seite sind bewusst groß gestaltet.
Geringe Bewegungsdistanz
Relevante Aktionen liegen direkt in inhaltlicher Nähe zu den jeweiligen Abschnitten.
Leichte mobile Nutzbarkeit
Buttons haben ausreichend große Interaktionsflächen und klare visuelle Priorität.
Als Nächstes kann ich dir die HTML-Beispielseite für Hick’s Law im gleichen Stil erstellen.