Was macht eine große 404-Fehlerseite aus?

Niemand möchte glauben, Website-Besucher verbringen Zeit auf Fehlerseiten, aber das passiert. Die 404-Fehlerseite ist eine Stelle, an der diese Interaktionen ziemlich häufig auftreten. Gestalten Sie die Website so, dass sie mit den Benutzern spricht, anstatt sie zum Verlassen Ihrer Website zu ermutigen.

Denkwürdigere und weniger frustrierende 404-Fehlerseiten sind die erfolgreichsten. Sie können auch am meisten Spaß machen. Was können Sie also tun, um die beste 404-Seite für Ihre Site zu erstellen? Hier sind ein paar Tipps, Tricks und eine Galerie mit tollen Beispielen.

Was ist eine 404-Fehlerseite?

Website-Besucher landen auf einer 404-Fehlerseite, wenn sie versuchen, eine Seite aufzurufen, die nicht vorhanden ist. Dies kann daran liegen, dass die Seite entfernt wurde, der Server oder die Internetverbindung unterbrochen ist, Benutzer auf einen fehlerhaften Link geklickt oder eine falsche URL eingegeben haben.

In der Regel erzeugen 404-Fehlerseiten eine der folgenden Meldungen:

  • 404 Nicht gefunden
  • HTTP 404 nicht gefunden
  • 404 Fehler
  • Die Seite kann nicht gefunden werden
  • Die angeforderte URL wurde auf diesem Server nicht gefunden

Für das Gesamtdesign von 404 Seiten gibt es zwei Optionen - eine generische 404-Seite oder eine benutzerdefinierte 404-Seite. Generische Seiten spucken die obigen Nachrichten aus, ohne Rücksicht auf das Design. Benutzerdefinierte Seiten sind diejenigen, für die Sie Optionen entwerfen und erstellen. Sie müssen dazu Zugriff auf den Host-Server haben. (Das ist nicht etwas, worauf wir hier eingehen werden, aber Sie können in A List Apart mehr darüber erfahren.)

Gute angepasste 404-Fehlerseiten teilen den Benutzern mit, was zu tun ist, wenn sie auf irgendeine Weise fehlgeleitet werden. Die Seiten sollten nützliche Informationen enthalten, die einem Besucher helfen, auf Ihrer Website zu bleiben und die gewünschten Informationen zu finden. (Hoffentlich haben sie auch ein schickes Design.)

Grundlegende Must-Have-Informationen

Eine 404-Fehlerseite sollte möglichst einfach sein. Sie sollten den Benutzern mitteilen, dass ein Fehler aufgetreten ist (offensichtlich) und welche Optionen sie benötigen, um von dieser Seite nach vorne zu gelangen.

Was eine 404-Seite nicht haben sollte, ist ein Haufen technischer Fachjargon. (Sie wollen den Benutzern keine Angst machen, oder?) In Wirklichkeit sollten Sie wahrscheinlich nicht einmal die Überschrift verwenden? 404 Fehler? weil viele ihrer benutzer keine ahnung haben, was das bedeutet. Halten Sie sich an etwas mit mehr Bedeutung, z. B.? Die Seite kann nicht gefunden werden.?

Auf der 404-Seite gibt es noch weitere Informationen. Denken Sie daran, dass die Besucher weiterhin klicken müssen, wenn sie die Seite fehlerhaft fanden, und sie nicht verlieren.

  • Eine starke Überschrift oder ein Text, der einem Benutzer erklärt, warum er hier ist. Es ist erschütternd, wenn Sie auf einer Webseite landen, die nicht Ihren Vorstellungen entspricht. Stellen Sie sicher, dass die Benutzer wissen, dass sie sich nicht auf der richtigen Seite befinden, sich aber auf der richtigen Website befinden.
  • Suche. Stellen Sie sicher, dass die 404-Fehlerseite über dieselbe Suchfunktion (und an derselben Position) verfügt wie der Rest Ihrer Website. Auf diese Weise können Benutzer nach der Seite suchen, die sie besuchen wollten.
  • Links zu Ihrer Homepage und Sitemap. Wahrscheinlich geschieht dies als Gestaltungselement, das eine Kopf- oder Fußzeile enthält, die zum Rest der Site passt.
  • Ansonsten nur minimale Informationen. Erwägen Sie, die komplizierte Navigation zu entfernen. Wenn ein Benutzer irrtümlicherweise auf eine Seite gelangt, geben Sie dieser Person nur einige Optionen, die zum Erfolg führen. Zu viele Optionen können den Benutzer weiter frustrieren oder verwirren.
  • Fügen Sie einen offensichtlichen Aufruf zum Handeln hinzu. Sagen Sie den Benutzern, was als Nächstes zu tun ist.

Machen Sie 404 Seiten verwendbar

Ein Teil des Designprozesses, wenn über 404 Seiten nachgedacht wird, sollte die Benutzerfreundlichkeit sein. Fügen Sie Funktionen hinzu, die die Seite für den verlorenen Benutzer optisch ansprechend und funktional machen.

Google hat eine Liste mit großartigen Informationsvorschlägen, die auf einer benutzerdefinierten 404-Seite in seine Webmaster-Tools aufgenommen werden können. Diese Tipps umfassen:

  • Sagen Sie den Besuchern deutlich, dass die gesuchte Seite nicht gefunden werden kann. Verwenden Sie eine freundliche und einladende Sprache.
  • Stellen Sie sicher, dass Ihre 404-Seite das gleiche Aussehen und Verhalten wie der Rest Ihrer Website aufweist.
  • Erwägen Sie das Hinzufügen von Links zu den beliebtesten Artikeln oder Posts.
  • Überlegen Sie, ob Sie Benutzern die Möglichkeit geben können, einen fehlerhaften Link zu melden.
  • Stellen Sie sicher, dass Ihr Webserver einen tatsächlichen 404-HTTP-Statuscode zurückgibt, wenn eine fehlende Seite angefordert wird, damit diese nicht in den Suchergebnissen angezeigt wird.
  • Verwenden Sie das Widget Enhance 404, um ein Suchfeld auf Ihrer benutzerdefinierten 404-Seite einzubetten.
  • Verwenden Sie das Tool zum Ändern der Adresse, um Google über die Verschiebung Ihrer Website zu informieren.

Zu dieser Liste von Tipps gehört noch mehr für Designer: Seien Sie kreativ. Eine 404-Seite muss nicht langweilig sein, wenn sie technisch einwandfrei ist.

Entwerfen Sie 404 Seiten mit dem Zweck

Wenn Sie über das Design einer 404-Fehlerseite nachdenken, überlegen Sie zunächst, wie sie in Bezug auf den Rest der Site funktioniert. Was ist die Stimmung oder der Ton Ihres Gesamtdesigns? Wie kann diese Seite diesem Gefühl entsprechen?

Große Fehlerseiten fügen sich nahtlos in die Website ein, auf der sie leben. Wenn Ihre Site einen leichten und humorvollen Ton hat, sollte dies auch die Seite 404 sein. Die Farben und Bilder sollten auch ein einheitliches Design haben. Achten Sie jedoch beim Design darauf, dass der Benutzer nicht auf der falschen Seite landet. (Dies passiert häufiger als Sie vielleicht denken.)

Denken Sie über das Design einer Fehlerseite nach, wie Sie es auch bei jeder anderen Seite im allgemeinen Designschema tun würden.

  • Beibehaltung der Design-Konsistenz Verwenden Sie dieselben Farb-, Typografie- und Bildstile, die auf anderen Seiten der Website integriert sind.
  • Branding beibehalten Wenn Sie dasselbe Logo, dieselbe Kopf- und Fußzeile verwenden, können Benutzer Ihre Website besser erkennen.
  • Halten Sie es einfach visuell. Weniger ist mehr, wenn es um Fehlerseiten geht.
  • Lassen Sie die Benutzer nicht blättern. Dies ist ein Ein-Bildschirm-Design.
  • Vermeiden Sie zu viele Gimmicks. Während es eine gute Idee ist, den Ton und das Gefühl Ihrer Website und Marke beizubehalten, zu viele "Extras"? Benutzer können vergessen, wonach sie gesucht haben.
  • Entschuldige dich und sei einfühlsam. Es tut mir leid, dass ein Benutzer am falschen Ort gelandet ist.
  • Wenn für Ihre Site ein Login erforderlich ist, fügen Sie einen Platz dafür hinzu.(Ist der Fehler aufgetreten, weil der Benutzer angemeldet sein musste?)
  • Seien Sie kreativ. Oder lustig. Aber testen Sie die Seite zuerst. Stellen Sie sicher, dass zufällige Benutzer es bekommen.
  • Wenn Sie einen 404-Fehler verwenden? Fügen Sie eine zweite Textzeile hinzu, die den Benutzern mitteilt, was dies bedeutet oder was sie als Nächstes tun müssen.

12 gute Beispiele

Es gibt nichts Besseres als eine große 404-Fehlerseite. Es erleichtert die Frustration eines schlechten oder gebrochenen Links. Hier sind ein Dutzend Seiten, auf die Sie bei einem Fehler stolpern wollen.

Abweichende Kunst

Gig Masters

iFolderLinks

Lego

LimpFish

Magnt

Mattel

ModCloth

NPR

Steve Lambert

Titleist

Tobi

Fazit

Es kann schwer vorstellbar sein, eine Seite zu entwerfen, die das Ergebnis eines Fehlers ist, als Spaß oder als Ort, an dem Kreativität gezeigt wird. Die Gestaltung einer effektiven 404-Seite ist eine Mischung aus Einfachheit, Benutzerfreundlichkeit und Design-Flair.

Haben wir eines der Elemente vermisst, die Sie auf einer 404-Fehlerseite sehen möchten? Haben Sie eine tolle 404-Seite entworfen? Teilen Sie Ihre Gedanken und Entwürfe mit uns in den Kommentaren, auf Facebook oder Twitter.