40 Clevere 404-Fehlerseiten von echten Websites

Eine erfolgreiche Website zu betreiben bedeutet, auf Fehler wie fehlerhafte Seiten oder langsame Leistung zu achten. Manchmal gibt es jedoch Probleme, die Sie einfach nicht vermeiden können, und 404-Fehler sind einer davon.

Ein 404 tritt auf, wenn ein Benutzer eine Seite auf Ihrer Website anfordert, die nicht existiert, wodurch eine 404-Fehlerseite ausgegeben wird, die die Benutzer auffordert, an die richtige Stelle zurückzukehren. Ganz gleich, wie viele Ressourcen Sie investieren, um sicherzustellen, dass Ihre Website niemals ausfällt … es besteht immer die Möglichkeit, dass Benutzer hier landen.

Es ist unbequem, aber eine Tatsache des Lebens. Und die Reaktion von Besuchern, wenn sie auf einer nicht existierenden Seite landen, kann von „es gelassen nehmen“ bis „total den Verstand verlieren“ reichen.

Während Sie gegen letzteres nichts tun können, können Sie die Dinge etwas weniger schmerzhaft machen, indem Sie eine kreative Fehlermeldung 404 erhalten. Dies kann Wunder bewirken, um Ihre Website-Besucher in einer ansonsten frustrierenden Situation zum Lächeln zu bringen.

Um Ihr Website-Design zum Fließen zu bringen, werden in diesem Beitrag einige unserer beliebtesten Website-Fehlerseiten vorgestellt. Hoffentlich können Sie ein paar Ideen mitnehmen, um Ihre eigene 404-Nachricht zu erstellen.

Was ist ein 404-Fehler?

Ein 404-Fehler ist ein Standard-HTTP-Fehlermeldungscode, der bedeutet, dass die Website, die Sie erreichen wollten, auf dem Server nicht gefunden werden konnte. Es handelt sich um einen clientseitigen Fehler, d. h. entweder wurde die Webseite entfernt oder verschoben und die URL nicht entsprechend geändert, oder die Person hat die URL einfach falsch eingegeben.

Zum größten Teil können Sie Ihren Server so konfigurieren, dass er eine benutzerdefinierte 404-Fehlerseite erstellt. (Wenn Sie HubSpot-Kunde sind, klicken Sie hier, um zu erfahren, wie Sie Ihre 404-Seite in HubSpot anpassen können.)

Einige angepasste 404-Fehlerseiten enthalten ein Heldenbild, eine witzige Beschreibung, eine Sitemap, ein Suchformular oder grundlegende Kontaktinformationen.

Die besten Beispiele für 404-Webseiten

Im Laufe der Jahre haben Websites verschiedene Wege gefunden, Besucher über einen 404-Fehler zu informieren und sie an die richtige Stelle zurückzuleiten, manche einfach, manche kreativ und manche urkomisch. Beginnen wir mit einem Blick auf einige kreative 404-Seiten und sehen uns dann einige lustige Beispiele an, die jeden begeistern werden, der ihnen begegnet.

Seite nicht gefunden: Creative 404-Fehlerseiten

1. Pipcorn

Während sich eine 404-Seite leicht von einer Website abheben kann, passt die Fehlerseite von Pipcorn perfekt zum restlichen Branding der Website. Es gibt einen schönen animierten Hintergrund, eine freundliche Textaufforderung, die die Besucher anweist, die Website zu durchsuchen (komplett mit einem cleveren Wortspiel), und ein Stück Popcorn, das als „0“ in „404“ verwendet wird.

2. Spotify

Der Musik-Streaming-Gigant Spotify hat seine Grundlagen mit einer cleveren 404-Seite abgedeckt. Mit einem witzigen Wortspiel aus Kanye Wests Album „808s and Heartbreak“ und einer Plattenanimation unterhält die Website kurz und schickt die Besucher dann wieder auf die Seite zurück, von der sie gekommen sind.

3. Genial

Eine einfache Möglichkeit, die Spannung auf Ihrer 404-Seite abzubauen, besteht darin, ein schnelles „Oops!“ hinzuzufügen. Nachricht – Ihre Website wirkt sympathischer, da Sie die Benutzer zurück an die richtige Stelle führen. Im Fall von Geniallys Website enthält die Seite auch eine raffinierte Illustration, gepaart mit einer verspielten Kopie.

4. Adobe

Wie zu erwarten, ist die 404-Fehlerseite von Adobe sowohl nützlich als auch optisch ansprechend. Es listet beliebte Links auf, die sich Besucher wünschen könnten, neben einigen coolen digitalen Kunstwerken, die als visuelle Metapher für eine kaputte oder verlorene Seite dienen. Ehrlich gesagt sollten Websites häufiger visuelle Metaphern verwenden.

5. Clorox

Die 404-Seite für Clorox-Reinigungsprodukte wechselt zwischen drei fröhlichen Fotos, um den Besuchern zu signalisieren, dass sie einen Fehltritt begangen haben. Es ist eine intelligente Verwendung von Branding, um einen kurzen Freudenmoment hinzuzufügen und gleichzeitig verlorenen Benutzern zu helfen.

6. Duma-Kollektiv

In anderen Fällen brauchen Sie vielleicht keinen witzigen Klappentext – sagen Sie den Besuchern einfach, dass es keine Seite unter der Adresse gibt, und lassen Sie sie weitermachen. Die Unterhaltungsberatungsagentur Duma Collective macht genau das mit ihrer Fehlerseite, obwohl sie durch ein Hintergrundbild für ein wenig Flair ergänzt wird.

7. Kühlhaus

Apropos Flair, die Self-Care-Marke Chillhouse hat zusätzliche Arbeit investiert, um ihre Besucher stilvoll umzuleiten. Die 404-Seite ist entsprechend gebrandet und nimmt die Besucher sogar mit auf eine kleine Reise durch ein paar Standbilder, bevor sie zurück auf die Homepage gehen.

8. Bitly

Wenn Sie einen falschen Bitly-Link eingeben, werden Sie auf die 404-Seite von Bitly weitergeleitet. Wir gehen davon aus, dass dies häufig vorkommt, weshalb die 404-Seite direkt auf den Punkt kommt. Es erklärt, was möglicherweise schief gelaufen ist, und fordert die Benutzer auf, die Bitly-Homepage zu besuchen, wenn sie danach suchen.

9. IKEA

Die 404-Seite von Ikea ist ähnlich minimalistisch, schafft es aber dennoch, ein intelligentes Branding einzuschleusen. Dieses Beispiel zeigt, dass Ihre Fehlerseiten nicht aufwändig sein müssen, um den Punkt zu vermitteln, aber es ist auch nichts falsch daran, etwas Spaß zu machen.

10. Moxie Design Co.

Sicher, „das Internet in die Luft jagen“ ist vielleicht ein bisschen übertrieben, aber es sagt den Besuchern, dass Moxie Design Co. sich selbst mit kleinen Ausrutschern wie diesem nicht allzu ernst nimmt. Außerdem ist eine Suchleiste bequem unten platziert, um Sie auf den Weg zu schicken.

11. McKissack & McKissack

Ah, der klassische „Wir haben die Seite verloren“-Trick. Wieder eine einfache Möglichkeit, einen 404 zu präsentieren, ohne Ihr Publikum zu verärgern. Wenn Sie eine Agentur wie McKissack & McKissack sind, die viele Kundeninteraktionen verwaltet, ist ein klarer und prägnanter Text für alle Seiten Ihrer Website, einschließlich der Fehlerseiten, unerlässlich.

12. CSS-Tricks

Haben Sie schon einmal die Umhüllung einer Website abgerissen, um zu sehen, was sich darunter befindet? Das ist das Konzept, das CSS Tricks auf ihrer 404-Fehlerseite anstrebte. Das ist sowohl witzig als auch eine Erinnerung an das, worum es auf der Website geht: die intelligente Verwendung des Seitenstils.

13. Gute alte Spiele

Bei anderen Websites packen Sie das Frontend aus und da ist … nur die riesige Leere des Raums. Diese Seite ist eine clevere Referenz zu GOG Galaxy, dem nativen Videospiel-Client von Good Old Games. Zum Glück gibt es eine kleine Videospielfigur, die Besuchern die Möglichkeit gibt, einen Fehler zu melden, wenn sie möchten.

14. Leinwand

Eine etwas andere Variante finden Sie auf der 404-Seite von Canva. Es enthält nicht nur eine Fehlermeldung, sondern ein raffiniertes Kachelpuzzle, das Besucher für eine kurze Unterhaltung spielen können. Es schadet doch nicht, Ihre Besucher ein paar Minuten in Ruhe zu lassen, oder?

15. Innotech

Ähnlich wie bei Canvas Ansatz bietet Innotech auf seiner 404-Seite ein Pong-ähnliches Spiel, um eine kurze Unterhaltung zu bieten. Wahrscheinlich werden Sie sich an eine Website wie diese erinnern. Außerdem ergänzt der unterhaltsame Abstecher eine wirklich beeindruckende Website – im Ernst, wenn Sie mit dem Spielen fertig sind, gehen Sie zur Homepage und nehmen Sie alles in sich auf.

16. Unzählige

Die Videoagentur Myriad hat sich für ein skurriles, markenkonformes 404-Seitendesign entschieden, das die klassischen SMPTE-Farbbalken nachahmt, die auf alten Bändern und Fernsehern zu sehen sind. Es ist ein lustiger Rückblick auf ältere Technologien, während es das modernere Problem einer nicht existierenden Webseite darstellt.

17. KonMari

Marie Kondo, die für ihre beliebten Reinigungs- und Organisationsmethoden und ihre Marke bekannt ist, hat der 404-Seite ihrer Website ein ähnliches Gefühl verliehen. Die Kopie erinnert kurz und humorvoll an ihre Aufräumphilosophie – ein kleines, aber gut gebrandetes Detail, das Fans erkennen werden.

18. BrandCrowd

Die Illustration auf dieser Fehlerseite ist nicht nur detailliert und ansprechend – die Kopie ist auch clever. Wir lieben den Bezug zum Semisonic-Song „Closing Time“: „You can click anywhere other, but you can’t click here.“

19. Hot Dot-Produktionen

Die Fehlerseite von Hot Dot bleibt ihrem Slogan treu: „Die Schnittmenge von neuen Technologien und Design“. Die Seite wird durch Hunderte winziger Punkte animiert, die die Richtung ändern, wenn Sie Ihren Cursor bewegen. Es ist faszinierend und ein großartiges Beispiel für die Designfähigkeiten der Agentur.

20. Orangenmantel

Wenn Sie eine Fehlermeldung ausgeben, warum unterhalten Sie den Benutzer nicht ein paar Sekunden lang, während Sie ihm helfen? Nach einer freundlichen Begrüßung bietet OrangeCoat ein Flussdiagramm, das den Benutzern tatsächlich dabei hilft herauszufinden, warum sie überhaupt auf eine Fehlerseite gelangt sind.

21. Ervin & Smith

Diese 404-Seite tut mehr, als Benutzer zurück zu aktiven Seiten umzuleiten. Stattdessen lädt Sie die 404-Seite von Ervin & Smith ein, nach unten zu scrollen und zu erfahren, warum Sie eine Agentur für digitales Marketing brauchen und warum Sie sich insbesondere für Ervin & Smith entscheiden sollten, abgerundet mit einem Kontaktformular. Getreu ihrer Mission zeigt diese Agentur, dass jede Seite eine Conversion-Möglichkeit sein kann.

22. DayCloud-Studios

… oder Ihr 404 kann nur ein Ort sein, an dem Sie für eine Minute Zeit verschwenden können, wie auf der Website von DayCloud Studios zu sehen ist. Wenn Sie den Cursor über den Bildschirm bewegen, wird eine 404-Nachricht angezeigt, die von Lasern beleuchtet wird, die aus den Augen einer Katze schießen. Weil warum nicht?

23. Kopfraum

Ein weiteres Beispiel einer Website, die ihre Markenbotschaft auf intelligente Weise in eine 404-Seite integriert – die geführte Meditations-App Headspace bemüht sich, die Benutzer zu beruhigen, indem sie uns ermutigt, tief durchzuatmen und dann zur Hauptseite zurückzukehren.

24. Wildwood-Bäckerei

Einige Websites haben bisher clevere Markentexte in ihre Seiten integriert, während andere auf ihren Seiten ausgewachsene Online-Spiele gehostet haben. Aber es ist nichts falsch mit einem kurzen Schubs zurück in die richtige Richtung. Die exquisite Website von Wildwood Bakery hält die Dinge kurz und bündig (im wahrsten Sinne des Wortes).

Seite nicht gefunden: Lustige 404-Fehlerseiten

25. Astuteo

Die 404-Seite der Designagentur Astuteo ist eine perfekte Balance aus eleganter Optik, Humor und Hilfsbereitschaft. Das minimale Layout bietet den Benutzern die Informationen, die sie benötigen, neben einer weiteren amüsanten visuellen Metapher, einem sinkenden Frachtschiff und einer fliehenden Gestalt.

26. LEGO

Auf der 404-Fehlerseite von LEGO sind nur wenige Worte erforderlich – der Ausdruck des Charakters macht alles klar. Außerdem werden Fans der LEGO-Filmreihe die lustige Referenz in der Kopie genießen.

27. Magnet

In dieser lustigen Fehlermeldung macht sich Magnt über die Tatsache lustig, dass, ja, sie könnten etwas kaputt gemacht haben – oder Sie können einfach nicht tippen. Das Bild dient als schnelle Möglichkeit, ihren Standpunkt schnell zu veranschaulichen.

28. IconFinder

Die Fehlerseite von IconFinder ist einfach, aber reizvoll. Das Maskottchen des Unternehmens, das eine Robe trägt und müde wirkt, ist eine nachvollziehbare Anspielung auf verlorene Besucher. Keine Sorge, da die Website unten einige ihrer Links auflistet, die Sie besuchen können.

29. Süße Träume

Anscheinend hat das Team des Schlafmittelunternehmens Sweet Dreams laut der 404-Seite der Website zu viele seiner Produkte genommen. Diese Seite ist nicht nur humorvoll – sie fügt sich auch gut in die übrige Front-End-Ästhetik und die Botschaften der Website ein, um ein zusammenhängendes Gefühl zu erzeugen.

30. GitHub

Die Zeile „Das sind nicht die Droiden, nach denen Sie suchen“ bezieht sich auf Obi-Wan Kenobis Jedi-Gedankentrick über Sturmtruppen in Star Wars Episode IV , und es ist zu einem bekannten Satz geworden, der verwendet wird, um jemandem zu sagen, dass er das Falsche verfolgt Vorgehensweise. GitHub spielt mit dieser berühmten Zeile in ihrer 404-Fehlermeldung.

31. Patagonien

Die benutzerdefinierte 404-Seite von Patagonia fängt die Stimmung der Marke perfekt ein, komplett mit einem Bumerang-Video eines Frisbee-Twirlers, einem cleveren Wortspiel, das „404“ und „Aloha“ kombiniert, und Links zu den Produktseiten. Es ist eine freundliche und lustige Art, Besucher zu begrüßen, die am falschen Ort gelandet sind.

32. Cloud-Sigma

Probieren Sie es aus: Cloud Sigma lässt uns hinter die Kulissen blicken. Ihre 404-Fehlerseite gibt vor, die Homepage eines Junior-Entwicklers zu sein – dieser Junior-Entwickler ist, nun ja, eine Katze.

33. AMC-Kinos

Sie waren vielleicht schon einmal in einem AMC-Kino, aber Sie haben hoffentlich noch nie die 404-Seite ihrer Website gesehen. Die Website verwendet einen schnellen, lustigen und relevanten Einzeiler, bevor sie Sie an die richtige Stelle zurückleitet.

34. Bruno

Es ist kein Zufall, dass Kreativagenturen großartig darin sind, coole 404-Seiten zu erstellen. Hier ist eine weitere von den Kreativen bei Bruno, die den 2000er Kultkomödienklassiker Dude, Where's My Car? Nein, es hat nichts mit dem Unternehmen oder der Website zu tun, aber es wird sicher ein Schmunzeln hervorrufen.

35. NPR

Auf den ersten Blick scheint die Fehlerseite von NPR nichts Besonderes zu sein. Aber lesen Sie weiter und Sie werden sehen, wie sie einige ihrer großartigen Geschichten über verlorene Menschen, Orte und Dinge geschickt verknüpfen, wie einen Artikel über Amelia Earhart und einen über Waldo. Dies könnte dazu führen, dass sich verlorene Benutzer etwas weniger allein fühlen.

36. Mittel

Medium verfolgt einen ähnlichen Ansatz wie die 404-Seite von NPR und empfiehlt Artikel darüber, wie man sich verirrt und Dinge verliert. Sehen Sie sich diese Artikel an, wenn Sie Zeit haben – sie sind ziemlich gut zu lesen.

37. HomeStarRunner

HomeStarRunner.com, die Heimat einer Flash-animierten Zeichentrickserie, hatte im Laufe der Jahre eine Reihe lustiger 404-Fehlerseiten. Die neueste zeigt Charaktere aus der Zeichentrickserie in einer Szene, die direkt aus einer ihrer Folgen stammen könnte. Wenn Sie den Ton beim Laden der Seite einschalten, hören Sie ihren Charakter Strong Bad – bekannt dafür, Sätze laut zu brüllen – sagen: „404'd!“

38. Blizzard-Unterhaltung

Hier ist eine einfache Idee, die am Ende raffiniert aussieht: Die 404-Seite von Blizzard Entertainment enthält eine animierte Figur, die in einem echten Schneesturm verloren geht, und etwas Humor, den World of Warcraft-Fans zu schätzen wissen.

39. Hallo große Idee

Ein kurzer Ausflug zu Marketing- und Social-Media-Experten Die Website von Hello Big Idea wird Ihnen sagen, was Sie über den kühnen und unverblümten Textstil wissen müssen. Und natürlich ist die 404-Fehlerseite keine Ausnahme.

40. HubSpot

Das passiert uns auch! Dies ist die Nachricht, die wir veröffentlichen, um unsere Website-Besucher darüber zu informieren, dass es einige Website-Probleme gibt. Unser Ziel war es, der Markenstimme von HubSpot treu zu bleiben, indem wir so liebenswert, einfühlsam und hilfsbereit wie möglich sind.

Verwandeln Sie eine 404-Fehlerseite in einen Genussmoment

Niemand möchte auf einer 404-Seite landen – sie sind nervig und unerwartet. Sie können sie jedoch nicht wirklich vermeiden, daher ist es immer eine gute Idee, eine 404-Seite zu haben, auf die Sie für Ihre Website zurückgreifen können.

Und aus Sicht der Benutzererfahrung sollte Ihre 404-Seite eine kleine Bremsschwelle sein, keine Mauer. Das richtige Design kann den Unterschied zwischen einem frustrierten Sprung und einer möglichen Konvertierung ausmachen, also warum nicht Spaß machen?

Anmerkung des Herausgebers: Dieser Beitrag wurde ursprünglich im Dezember 2015 veröffentlicht und wurde aus Gründen der Vollständigkeit aktualisiert.