Warum ist Empty State Design auf Ihrer Website wichtig?

Warum verdient dieser Bildschirm Ihre Aufmerksamkeit? Ein leeres Suchergebnis oder ein leerer Warenkorb ist oft das Erste, was ein Besucher auf Ihrer Website bemerkt. Deshalb prägt der Umgang mit diesem Moment den ersten Eindruck Ihrer Marke.

In diesem Beitrag zeigen wir, welche Seitentypen Priorität verdienen und welche Elemente ein gutes Empty State Design braucht. Außerdem zeigen wir, wie aus einer Seite ohne Suchergebnisse eine Chance statt einer Sackgasse entsteht. Zum Schluss gehen wir auf die Logik hinter leeren Warenkörben, leeren Benachrichtigungen und leeren Favoritenlisten auf konzeptioneller Ebene ein.

Wir verwenden den Begriff Empty State Design durchgehend, da er sich in der Branche durchgesetzt hat. Manche Teams nennen es auch Leerzustand. Welchen Begriff Ihr Team auch bevorzugt, die Gestaltungsprinzipien dahinter bleiben gleich.

Zudem richten wir diesen Beitrag besonders an Shops und Dienstleistungswebsites. Beide Seitentypen führen Besucher nämlich ständig durch Suche, Filter und Warenkorb. Trifft ein leerer Bildschirm an irgendeiner Stelle dieses Ablaufs auf den Besucher, schadet das seinem Vertrauen in die Website.

Warum darf ein Suchergebnis nicht einfach leer bleiben?

Ein Besucher tippt einen Suchbegriff ein, und nichts kommt zurück. Ein komplett leerer Bildschirm lässt ihn sich auf Ihrer Website verloren fühlen. Dieser Moment entscheidet oft, ob der Besucher bleibt oder geht. Deshalb kostet Sie eine rein technische Meldung an dieser Stelle leise einen Besucher, den Sie bereits hatten.

Genau hier hilft ein gut gestaltetes Empty State. Zum Beispiel erkennen Sie einen wahrscheinlichen Tippfehler und schlagen eine passende Alternative vor. Ebenso verlinken Sie auf beliebte Kategorien oder häufig angesehene Seiten. Dadurch sucht der Besucher weiter, statt die Seite zu verlassen.

Dieser Ansatz stärkt zudem die gesamte Konsistenz Ihrer Oberfläche, nicht nur einen einzelnen Bildschirm. Unser Beitrag zu UX Fehlern, die Umsatz kosten behandelt diesen größeren Zusammenhang genauer.

Sucht ein Besucher auf einer Dienstleistungsseite zum Beispiel nach einem Ort, den Ihr Team noch nicht abdeckt, hilft ein Vorschlag für das nächstgelegene Gebiet. Dieser kleine Kniff hält den Besucher auf der Seite, und er sucht weiter.

Außerdem sollten Sie dabei nicht nur die Suchlautstärke im Blick behalten, sondern auch die Quote leerer Ergebnisse regelmäßig prüfen. Eine hohe Quote leerer Ergebnisse deutet nämlich oft auf eine Lücke in Ihrem Katalog oder in Ihrer Suchlogik hin.

Warum reicht eine technische Fehlermeldung nicht aus?

Eine knappe Systemmeldung wie 'Keine Ergebnisse' sagt einem Besucher nicht, was er als Nächstes tun soll. Sie nennt nur eine Tatsache, ohne eine Richtung vorzugeben. Der Besucher muss den nächsten Schritt allein finden. Deshalb klickt ein großer Teil der Besucher an dieser Stelle einfach zurück.

Die Untersuchung der Nielsen Norman Group zu Empty State Design weist auf ein wichtiges Problem hin. Diese Art von Meldung verursacht Verwirrung darüber, ob das System überhaupt funktioniert. Laut dem Artikel der Organisation schadet eine Meldung besonders, wenn sie ungenau ist oder später mit anderem Inhalt kollidiert.

Deshalb sollten Sie einen Ansatz wählen, der die Situation erklärt und einen Weg nach vorn anbietet. Ein bloßer Fehlercode kann das allein nicht leisten. Doch was genau sollte dieser Ansatz enthalten?

Wählen Sie statt einer kühlen Fehlermeldung einen Ton, der den Besucher wie einen Menschen behandelt. Dieser Ton schafft Vertrauen statt Misstrauen. Besonders auf kleinen Bildschirmen sollten Sie diesen Text kurz halten.

Außerdem sollte Ihr UX Team beim Formulieren solcher Texte auch den Support einbeziehen. Der Support beobachtet nämlich täglich, an welchen leeren Bildschirmen Besucher am häufigsten hängen bleiben, und diese Beobachtung macht den Text deutlich realistischer.

Welche drei Bestandteile braucht ein gutes Empty State Design?

Ein gutes Empty State Design vereint drei Bestandteile. Der erste ist ein kurzer Text, der die Situation erklärt. Als zweiten Bestandteil brauchen Sie einen Link oder Button für den nächsten Schritt. Der dritte ist ein einfaches, markengerechtes Bild oder Icon.

• Statustext: erklärt dem Besucher kurz, warum dieser Bereich gerade leer ist.
• Leitender Link oder Button: führt den Besucher zum nächsten sinnvollen Schritt.
• Einfaches Bild oder Icon: spiegelt den Markenton, ohne aufwendige Animation.

Ist zum Beispiel eine Favoritenliste leer, kann der Text lauten: 'Sie haben noch keine Favoriten gespeichert.' Der Link führt zu einer Kategorie, das Icon kann ein einfacher Stern sein. Achten Sie außerdem darauf, dass der Ton zu Ihrer Typografie passt. Ein unpassender Text stört sonst die optische Einheit der Seite.

Keiner dieser drei Bestandteile wirkt allein gut; sie entfalten ihren Sinn erst gemeinsam. Fügen Sie zum Beispiel nur ein Bild ohne Hinweis ein, bleibt dem Besucher der nächste Schritt verborgen.

Deshalb lohnt es sich, für diese drei Bestandteile eine gemeinsame Vorlage im Team zu nutzen. Zum Beispiel erstellt Ihr Designteam eine einzige Vorlage mit allen drei Elementen und teilt sie mit der Entwicklung.

Wie formulieren Sie den Statustext richtig?

Der Statustext sollte kurz, ehrlich und direkt sein. Schreiben Sie statt einer allgemeinen Zeile wie 'Ein Fehler ist aufgetreten' einen Satz, der die tatsächliche Situation benennt. Zum Beispiel liest sich 'Wir haben keinen Treffer für Ihre Suche gefunden' deutlich klarer als eine knappe Zeile wie 'Fehler: 0 Treffer'.

Behalten Sie beim Formulieren dieses Textes die vermutliche Stimmung des Besuchers im Blick. Ein Besucher, der gerade null Treffer erhalten hat, ist womöglich schon enttäuscht. Deshalb sollte der Text hilfsbereit klingen, nicht vorwurfsvoll.

Für einen ausführlicheren Rahmen zu solchen Texten lesen Sie unseren Leitfaden zu UX Writing. Dort behandeln wir auch die Formulierung von Buttons und Links.

Achten Sie beim Schreiben auf kurze Sätze und verzichten Sie auf unnötige Fachbegriffe. Doch welcher Link oder Button sollte diesen Text ergänzen?

Verwenden Sie außerdem konsequent die persönliche Anrede mit 'Sie', denn das macht den Text spürbar persönlicher. Zum Beispiel wirkt 'Wir haben Ihr Produkt nicht gefunden' wärmer als die unpersönliche Zeile 'Produkt nicht gefunden'.

Warum brauchen Sie einen Link oder Button für den nächsten Schritt?

Ein Statustext allein reicht nicht aus. Sie müssen dem Besucher auch eine konkrete Handlung anbieten. Sonst versteht der Besucher die Situation, weiß aber trotzdem nicht, was er tun soll, und verlässt die Seite.

Dieser Link oder Button sollte direkt zum Kontext passen. Ein Button bei leerem Warenkorb kann zum Beispiel 'Beliebte Produkte ansehen' lauten. Ein leeres Benachrichtigungsfach verlinkt dagegen zu den Benachrichtigungseinstellungen oder zu einer Hilfeseite. Dadurch findet der Besucher einen einzigen Klick, der ihn weiterbringt.

Die Nielsen Norman Group betont, dass dieser Link den Besucher direkt zur gesuchten Funktion führen sollte. Ein allgemeiner Link zur Startseite erfüllt diesen Zweck selten.

Ist zum Beispiel eine Dienstleistungsliste leer, kann der Button direkt zu einer passenden Kategorie oder zu einem Kontaktformular führen. So muss der Besucher den nächsten Schritt nicht selbst suchen.

Zum Beispiel ist der Linktext selbst genauso wichtig wie das Bild daneben. Schreiben Sie statt 'Hier klicken' lieber eine Formulierung, die die folgende Aktion klar benennt, etwa 'Beliebte Produkte ansehen'.

Welche Rolle spielt ein markengerechtes Bild oder Icon?

Ein einfaches Bild oder Icon verhindert, dass der leere Bildschirm wie eine reine Textwarnung wirkt. Es schafft Raum zum Atmen und etwas Markenidentität. Die Material Design Richtlinie von Google empfiehlt für dieses Bild einen neutralen, markengerechten Ton.

Das Bild sollte die Seite jedoch nicht mit aufwendiger Animation oder langer Ladezeit ausbremsen. Das Ziel ist nicht, Aufmerksamkeit zu erzwingen, sondern die Klarheit von Text und Link zu unterstützen.

Dieses Bild sollte außerdem zur Layoutlogik Ihrer Seite passen. Auf einer Seite mit Spaltenraster folgt das Bild im Empty State denselben Ausrichtungsregeln. Sonst wirkt die Seite unruhig.

Berücksichtigen Sie bei der Auswahl dieses Bildes auch Ihre Markenfarben und Ihren Illustrationsstil. Ein uneinheitliches Bild vermittelt dem Besucher sonst den Eindruck von Eile.

Wie verwandeln Sie eine Seite ohne Suchergebnisse in eine Chance?

Eine Seite ohne Suchergebnisse verwandelt sich bei richtiger Gestaltung in eine Chance. Sie hält den Besucher bei der Suche, statt ihn von der Website zu drängen. Dafür darf die Seite nicht nur die Situation nennen; sie braucht auch eine Lösung.

Tippt ein Besucher zum Beispiel einen falsch geschriebenen Begriff, schlägt das System den richtigen Begriff vor. Diese kleine Korrektur führt den Besucher ohne erneute Eingabe zum Treffer. Außerdem listen Sie häufig gesuchte Begriffe oder beliebte Kategorien auf derselben Seite auf.

So bleibt der Besucher selbst in dem Moment auf der Seite, in dem seine Suche eigentlich scheitert. Doch wie funktioniert ein Tippfehlervorschlag genau?

Dieser Ansatz zählt besonders für Shops mit saisonalen Produkten. Sucht ein Besucher ein gerade nicht lieferbares Produkt, helfen ähnliche Kategorien als Vorschlag. Dadurch denkt der Besucher nicht, seine Suche sei komplett erfolglos gewesen.

Außerdem lohnt es sich, Ihre Suchprotokolle regelmäßig durchzusehen. Sehen Sie zum Beispiel, welche Begriffe ständig ohne Treffer bleiben, erkennen Sie oft eine Lücke in Ihrem Katalog.

Warum ist ein Tippfehlervorschlag bei der Suche wichtig?

Besucher tippen einen Suchbegriff nicht immer korrekt ein. Ein fehlender Buchstabe oder ein Tippfehler kann ein lagerndes Produkt in ein Ergebnis ohne Treffer verwandeln. Deshalb senkt eine einfache Rechtschreibkorrektur in Ihrer Suche die Zahl der leeren Ergebnisse.

Das System kann zum Beispiel die ähnlichsten Produkte mit einem Hinweis wie 'Meinten Sie...?' vorschlagen. Dieser Vorschlag bringt den Besucher mit einem Klick zum richtigen Treffer. Außerdem erspart er die erneute Eingabe der Suche.

Dieser Vorschlagsmechanismus ist Teil Ihrer gesamten Suchfunktion. Er wirkt am besten zusammen mit der internen Suche Ihrer Website.

Schon eine einfache Ähnlichkeitsprüfung macht hier einen Unterschied. Eine Toleranz von ein oder zwei Buchstaben fängt zum Beispiel die meisten Tippfehler ab.

Vor allem bei langen Produktnamen lohnt sich diese Toleranz, denn dort passieren Tippfehler besonders häufig. Dennoch sollten Sie die Toleranz nicht zu großzügig einstellen, sonst erscheinen plötzlich unpassende Treffer.

Welche Logik gilt für einen leeren Warenkorb?

Eine Warenkorbseite, die nur 'Ihr Warenkorb ist leer' zeigt, verschenkt die Chance, den Besucher zurück zum Einkauf einzuladen. Dieser Bildschirm braucht einen klaren Link zurück zum Shop.

Außerdem können Sie hier zuletzt angesehene Artikel oder beliebte Kategorien auf konzeptioneller Ebene vorschlagen. Das erleichtert dem Besucher den Wiedereinstieg in den Einkauf. Natürlich schwankt die genaue Klickrate solcher Vorschläge von Website zu Website; eine feste Zahl nennen wir hier bewusst nicht.

Es lohnt sich außerdem, dieses Thema zusammen mit Warenkorbabbrüchen zu betrachten. In unserem Beitrag zum Reduzieren von Warenkorbabbrüchen teilen wir ausführliche Schritte für gefüllte, aber nicht abgeschlossene Warenkörbe.

Sie können hier auch einen kurzen Hinweis auf Produktkategorien oder eine aktuelle Aktion ergänzen. So verliert der Besucher trotz leerem Warenkorb nicht den Faden beim Einkauf.

Achten Sie dabei außerdem auf die Ladezeit der Warenkorbseite, denn ein schwerer Vorschlagsblock mit vielen Bildern bremst die Seite spürbar aus. Dadurch verlässt der Besucher die Seite am Ende trotzdem.

Wie wirkt sich eine Produktempfehlung auf die Conversion aus?

Produktempfehlungen auf einer leeren Warenkorbseite ersparen dem Besucher eine neue Suche von vorn. Sie können zudem die Wahrscheinlichkeit erhöhen, dass er weiter einkauft. Eine feste Zahl nennen wir hier dennoch nicht, da sich das Besucherverhalten von Website zu Website unterscheidet.

Testen Sie diese Änderung stattdessen auf Ihrer eigenen Website. Vergleichen Sie zum Beispiel Ihre Conversion Rate vor und nach dem Hinzufügen eines Vorschlagsblocks mit unserem Conversion Rate Rechner.

So stützen Sie Ihre Entscheidung auf eigene Daten statt auf eine Vermutung. Dieser Weg ist solider als eine erfundene Prozentzahl.

Ändern Sie bei diesem Test immer nur eine Variable gleichzeitig. Das macht das Ergebnis klarer lesbar. Lässt sich dieselbe Änderung dann auch auf das Benachrichtigungsfach übertragen?

Außerdem sollten Sie die gewonnenen Daten nicht nur für den Warenkorb nutzen. Zeigt sich zum Beispiel, welche Produktvorschläge am häufigsten angeklickt werden, verbessert das auch Vorschlagsblöcke auf anderen Seiten.

Was zeigen Sie in einem leeren Benachrichtigungsfach?

Ein bloßes Icon in einem leeren Benachrichtigungsfach sagt dem Besucher nicht, wofür dieser Bereich überhaupt gedacht ist. Eine kurze Erklärung macht deutlich, welche Art von Benachrichtigungen hier erscheint.

Ein Hinweis wie 'Noch keine Benachrichtigungen; Bestellstatus und Aktionen erscheinen hier' hilft dem Besucher zu verstehen, warum sich ein erneuter Blick lohnt. Ergänzen Sie außerdem einen Link zu den Benachrichtigungseinstellungen.

Dieser Ton sollte zum Rest Ihrer Website passen. Ein Benachrichtigungsfach, das dieselbe Sprache wie die Hilfelinks in Ihrem Footer Design nutzt, gibt dem Besucher ein stimmiges Gefühl.

Diese Erklärung hilft dem Besucher außerdem zu entscheiden, ob er die Funktion überhaupt behalten möchte. Ein Besucher, der nicht weiß, was ihn dort erwartet, ignoriert die Funktion oft komplett.

Zum Beispiel können Sie hier zusätzlich auf die Häufigkeit der Benachrichtigungen hinweisen. Das nimmt dem Besucher außerdem die Sorge, von zu vielen Meldungen überflutet zu werden.

Wie leiten Sie Nutzer bei einer leeren Favoritenliste?

Ist die Favoritenliste leer, erinnern Sie den Besucher daran, wofür das Speichern von Favoriten überhaupt gut ist. Sonst bemerkt er die Funktion vielleicht gar nicht. Ein kurzer Satz plus ein Link zu Kategorien reicht hier aus.

Ein Satz wie 'Speichern Sie hier Produkte, die Ihnen gefallen, für den schnellen Zugriff' erklärt den Nutzen der Funktion. Dadurch entdeckt der Besucher die Favoritenfunktion und nutzt sie künftig öfter.

Ein einfacher Stern oder ein Herz als Icon reicht hier meist völlig aus, ohne aufwendige Illustration. Das Ziel ist, die Funktion zu erklären, nicht Aufmerksamkeit davon abzulenken.

Es hilft außerdem, an dieser Stelle an den Ort der Favoritenfunktion zu erinnern. Ein kurzer Hinweis auf das Herzsymbol auf Produktseiten erleichtert dem Besucher, die Funktion wiederzufinden.

Was tun Sie, wenn die Filterung kein Produkt übrig lässt?

Wendet ein Besucher mehrere Filter an und bleibt am Ende kein Produkt übrig, besteht die erste Aufgabe des Bildschirms darin, den auslösenden Filter zu zeigen. Das erspart dem Besucher, jeden Filter einzeln zum Test auszuschalten.

Ergänzen Sie außerdem eine Option, um einen bestimmten Filter mit einem Klick zu entfernen. Das hält den Besucher davon ab, die Suche komplett neu zu beginnen. Unseren Beitrag dazu finden Sie unter Produktfilter im Onlineshop.

Dieser Empty State lässt den Besucher einen Filter lockern und weitermachen. Er schickt ihn nicht komplett zum Anfang zurück. Dadurch bricht der Suchprozess nicht völlig ab.

Es hilft außerdem, in einem kleinen Hinweis zu zeigen, welcher Filter das Ergebnis am stärksten beeinflusst hat. So erkennt der Besucher sofort, welche Auswahl er lockern sollte.

Außerdem hilft eine einzelne Schaltfläche, die alle Filter auf einmal zurücksetzt. So kehrt der Besucher mit nur einem Klick zur ursprünglichen, breiten Ergebnisliste zurück.

Welche Seitentypen sollten Empty State Design priorisieren?

Nicht jede Seite braucht Empty State Design mit derselben Dringlichkeit. Manche Seitentypen stehen dabei weiter oben auf der Liste. Suchergebnisse, Filteransichten, Benachrichtigungsfächer und Favoritenlisten führen diese Liste an.

• Suchergebnisseiten: der Punkt mit dem höchsten Risiko, dass ein Besucher die Website verlässt.
• Filteransichten: eine Sackgasse, die der Besucher durch seine eigene Auswahl selbst erzeugt.
• Benachrichtigungsfächer: ein Bereich mit Einfluss auf Bindung und Wiederbesuche.
• Favoriten und Wunschlisten: der erste Berührungspunkt, um die Funktion überhaupt zu entdecken.

Außerhalb dieser vier Seitentypen profitieren auch andere Bereiche von Empty State Design. Allerdings ist diese Liste der praktischere Startpunkt, wenn Ihre Ressourcen begrenzt sind.

Diese Reihenfolge verschiebt sich je nach Art Ihrer Website etwas. Auf einer Dienstleistungsseite zählt ein Benachrichtigungsfach zum Beispiel weniger. Warenkorb und Filteransicht stehen dagegen bei einem Onlineshop stärker im Vordergrund.

Was unterscheidet Empty State Design von der Fehlerseite 404?

Ein Empty State beschreibt eine funktionierende Seite Ihrer Website, die gerade keinen Inhalt zeigt. Die Fehlerseite 404 beschreibt dagegen einen Besucher, der eine nie existierende oder inzwischen entfernte Adresse aufruft. Beide brauchen Orientierung, doch der Auslöser unterscheidet sich.

Die Gestaltung einer Fehlerseite 404 behandeln wir ausführlich in unserem eigenen Beitrag dazu. Dort gilt dieselbe Grundlogik: Erklären Sie die Situation, und zeigen Sie den nächsten Schritt.

Behandeln Sie deshalb beide Situationen nach demselben Gestaltungsprinzip aus Erklärung und Orientierung. Das schafft in beiden Fällen ein stimmiges Erlebnis für den Besucher.

Diese Unterscheidung erleichtert außerdem Gespräche mit Ihrem Entwicklungsteam. Denn jede Situation verlangt im Hintergrund eine andere technische Lösung.

Wie wirkt sich Empty State Design auf die Nutzererfahrung aus?

Empty State Design greift genau in dem Moment, in dem der Ablauf eines Besuchers auf Ihrer Website eine Unterbrechung erlebt. Es prägt direkt, wie sich diese Unterbrechung anfühlt. Ein gut gestaltetes Empty State Design macht diese Unterbrechung kaum merkbar.

Die Nielsen Norman Group stellt fest, dass diese Art von Gestaltung die Lernbarkeit eines Systems verbessert. Außerdem hilft sie Besuchern, zentrale Aufgaben schneller zu erledigen. Empty State Design ist also kein rein kosmetisches Detail, sondern Teil der Nutzbarkeit.

Wir stellen diesen Effekt nicht als direkten Rankingfaktor dar. Allerdings trägt ein Besucher, der länger bleibt und nicht sofort zurückspringt, indirekt zu Signalen der Nutzererfahrung bei.

Planen Sie Empty State Design deshalb zusammen mit Ihrer übrigen Usability Arbeit. Nehmen Sie zum Beispiel leere Bildschirme beim nächsten Usability Audit in Ihre Liste auf.

Vor allem sollten Sie Empty State Design langfristig denken, denn es ist kein einmaliges Projekt. Fügen Sie eine neue Funktion hinzu, gestalten Sie deshalb auch deren Empty State mit derselben Sorgfalt.

Was sind die häufigsten Fehler beim Empty State Design?

Der häufigste Fehler ist, den Bildschirm komplett leer zu lassen. Ein naher zweiter Fehler ist, nur einen technischen Fehlercode zu zeigen. Ein dritter häufiger Fehler besteht darin, einen erklärenden Text ohne jeden Link oder Button einzufügen.

• Bildschirm komplett leer lassen: zeigt nicht, ob das System überhaupt funktioniert.
• Nur einen technischen Fehlercode zeigen: sagt dem Besucher nie, was als Nächstes zu tun ist.
• Zu aufwendige Illustration nutzen: markenfremde Bilder, die die Seite ausbremsen.
• Meldung zu früh zeigen: 'keine Einträge' blinkt auf, während der Inhalt noch lädt.

Gerade dieser letzte Fehler zählt besonders. Die Nielsen Norman Group stellt fest, dass eine zu früh gezeigte Meldung wie 'keine Einträge', während der Inhalt noch läuft, das Vertrauen der Besucher besonders schädigt.

Überprüfen Sie zur Vermeidung dieser Fehler jeden leeren Bildschirm auf Ihrer Website einzeln. Die richtige Logik auf einer Seite gerät auf einer anderen leicht in Vergessenheit.

Vergleich: Leerer Bildschirm und gestaltetes Empty State Design

Die folgende Tabelle fasst die wichtigsten Unterschiede zwischen einem leer gelassenen Bildschirm und einem bewusst gestalteten Empty State zusammen.

Der Unterschied in der Tabelle besteht meist aus wenigen Textzeilen und einem Link. Das zeigt: Empty State Design verlangt keinen großen Entwicklungsaufwand. Zudem stärken diese kleinen Eingriffe die gesamte Konsistenz Ihrer Website.

Priorisieren Sie beim Übertragen dieses Vergleichs auf Ihre eigene Website zunächst die meistbesuchten leeren Bildschirme. Das gibt Ihnen einen praktischen Startpunkt.

Außerdem erleichtert diese Tabelle die Abstimmung zwischen Design und Entwicklung, denn beide Seiten lesen dieselbe Vorgabe für jeden Bildschirmtyp. Das spart am Ende Zeit in der Diskussion.

Welche Schritte bereiten Empty State Design vor?

Listen Sie zu Beginn auf, welche Bildschirme auf Ihrer Website leer bleiben können. Legen Sie anschließend für jeden Bildschirm einen Statustext, einen Link und ein einfaches Bild fest.

1. Listen Sie alle Bildschirme für Suche, Warenkorb, Benachrichtigungen, Favoriten und Filter auf Ihrer Website auf.
2. Schreiben Sie für jeden Bildschirm einen kurzen, ehrlichen Statustext.
3. Ergänzen Sie einen Link oder Button zum nächsten Schritt.
4. Wählen Sie ein einfaches, markengerechtes Bild oder Icon.
5. Prüfen Sie, dass die Meldung nicht zu früh erscheint, bevor der Inhalt fertig geladen ist.

Sie können diese Schritte selbst umsetzen. Möchten Sie lieber die gesamte Gestaltung Ihrer Website überprüfen lassen, unterstützt Sie dabei unser Webdesign Service. Wir behandeln Empty States in diesem Prozess als Teil des gesamten Gestaltungssystems.

Empty State Design ist also ein kleines, aber in der Wirkung kumulatives Detail. Vernachlässigen Sie es nicht; beginnen Sie mit wenigen Bildschirmen und weiten Sie dieselbe Logik mit der Zeit auf die ganze Website aus.

Sie müssen diese Arbeit nicht in einem Zug abschließen. Beginnen Sie mit den zwei oder drei meistbesuchten Bildschirmen, und beobachten Sie die Reaktion der Besucher. Weiten Sie dieselbe Logik anschließend Schritt für Schritt auf den Rest der Website aus.

Zudem sollten Sie die Ergebnisse in regelmäßigen Abständen erneut prüfen, denn so bleibt die Gestaltung aktuell. Wächst Ihre Website, entstehen schließlich fast immer neue Bildschirme, die dieselbe Logik brauchen.