Zum Inhalt springen

Loading State

Männliche Person, frontal, schaut in die Kamera; trägt kariertes Hemd über dunkelfarbigem T‑Shirt; heller Innenraum mit unscharfem Monitor oder Poster links und Fenster rechts.

von Richard Albrecht am 24.09.2026

Ein Loading State ist der Zustand einer Ansicht, solange die angeforderten Daten noch fehlen und an ihrer Stelle ein Hinweis auf den laufenden Vorgang steht. Er endet, sobald der Inhalt steht oder ein Fehler gemeldet wird. Gemeint ist die ganze Ansicht: Ein Button, der nach dem Klick einen Kreis dreht, zeigt dagegen einen seiner eigenen Zustände.

Loading State

Zustand einer Ansicht, solange die angeforderten Daten noch fehlen und an ihrer Stelle ein Hinweis auf den laufenden Vorgang steht.
Beispiel: „Ohne Loading State wirkt die Übersicht beim Öffnen leer, obwohl die Daten längst unterwegs sind.“

Auch: Ladezustand. Die englische Bezeichnung hält sich im Entwurf, weil sie neben Empty State und Error State steht.

Der Skeleton Screen ist eine Bauform des Loading State und kein eigener Zustand. Er beantwortet die Frage, wie der Ladezustand aussieht, nicht die Frage, welcher Zustand gerade vorliegt.

Ab wann eine Anzeige überhaupt nötig ist

Ob ein Ladezustand gebraucht wird, hängt an der Dauer. Jakob Nielsen beschreibt drei Grenzen für die Antwortzeit: Bis etwa 0,1 Sekunden wirkt eine Reaktion unmittelbar, bis etwa 1 Sekunde bleibt der Gedankengang ungestört, und ab etwa 10 Sekunden richtet sich die Aufmerksamkeit auf etwas anderes.

Unterhalb einer Sekunde braucht es deshalb meist keine Anzeige: Das kurze Aufblitzen macht mehr Unruhe als das Warten. Zwischen einer und zehn Sekunden genügt ein Hinweis, dass etwas passiert. Wird es länger, gehört ein Fortschritt dazu, der zeigt, wie viel noch fehlt.

Welche Bauform wohin passt

Der Ladekreis teilt nur mit, dass gearbeitet wird. Ein Fortschrittsbalken sagt zusätzlich, wie weit der Vorgang ist, und setzt voraus, dass die Anwendung das wirklich weiß.

Drei Ansichten: links ein Ladekreis auf leerer Fläche, in der Mitte graue Platzhalterflächen in der Anordnung des späteren Inhalts, rechts dieselbe Ansicht fertig geladen. Hilfslinien zeigen, dass Platzhalter und Inhalt dieselben Maße haben.
Beide Formen zeigen denselben Zustand. Die rechte verrät zusätzlich, was gleich erscheinen wird.

Wir empfehlen, die Form am Ort festzumachen: Was eine bekannte Struktur nachlädt, etwa eine Liste, bekommt Platzhalterflächen. Was eine Aktion auslöst, bekommt die Rückmeldung am Bedienelement selbst.

Woran Ladezustände in der Praxis scheitern

Der häufigste Fehler ist der Sprung im Layout. Ist der Platzhalter niedriger als der Inhalt, der ihn ersetzt, rutscht die Seite im Moment des Ladens nach unten, und wer gerade auf einen Button zielt, klickt daneben.

Der zweite Fehler ist der Ladezustand ohne Ende. Kommt keine Antwort, dreht der Kreis weiter, und niemand weiß, ob noch etwas passiert. Jeder Ladezustand braucht eine Zeitgrenze und danach eine Meldung mit der Möglichkeit, es erneut zu versuchen. Wichtig ist außerdem, den Vorgang maschinenlesbar auszuzeichnen: Ein Kreis, der nur gezeichnet wird, kommt bei einem Screenreader nicht an.

Siehe auch:

Skeleton Screen

Bauform des Loading State, die den erwarteten Inhalt als graue Platzhalterflächen in seiner späteren Anordnung andeutet.

#Benutzererfahrung (UX)

Empty State

Zustand einer Ansicht, die keine Inhalte zeigt, weil noch keine angelegt, keine gefunden oder alle abgearbeitet wurden.

#Benutzererfahrung (UX)

Doherty Threshold

Antwortzeit von 400 Millisekunden, unterhalb der Nutzer und System ohne merkliche Wartezeit zusammenarbeiten.

#Benutzererfahrung (UX)

Zustände von Bedienelementen (Default, Hover, Active, Disabled)

Die verschiedenen Darstellungen, die ein Bedienelement je nach Situation annimmt, um seinen Status erkennbar zu machen.

#Webdesign-Grundlagen