Tipps und Beispiele für kreative und schöne 404-Seiten
Die Fehlermeldung „404: Not Found“ benachrichtigt Website-Besucher darüber, dass sich auf der aufgerufenen Seite keine Inhalte befinden. Was ein Error 404 (auch Code 404 genannt) genau ist, wie er zustande kommt und wie man am besten mit ihm umgeht, können Sie im Artikel "Error 404: Was bedeutet der Fehler?" nachlesen. Wie sieht nun ein ideenreicher Umgang mit der Fehlermeldung aus? Viele Websites beweisen, dass man den Hinweis auf den Fehler 404 mit Text und Bild kreativ aufwerten und originell gestalten kann, statt auf eine standardisierte Fehleranzeige zurückzugreifen. Wir geben Ihnen allgemeine Tipps für die Aufmachung einer 404-Seite und zeigen 20 Paradebeispiele.
Warum sollte man eine 404-Seite kreativ gestalten?
Es kommt häufiger vor, als man es sich wünscht: Durch einen Link gelangt man von einer Suchmaschine oder einer anderen Website auf eine 404-Seite – eine Sackgasse im Internet. Das kann durchaus frustrierend sein – zumal neben dem offensichtlichen Fehlen der versprochenen Inhalte die Ernüchterung oft noch dadurch verstärkt wird, dass das Design der Fehlerseite trist und lieblos ist.
Mit einer ausgefallenen 404-Webseite können Sie den Frust Ihrer Besucher schnell vergessen machen. Überraschen Sie die User mit dem Design des 404-Errors im positiven Sinne und bringen Sie sie zum Schmunzeln, werden viele nachsichtig sein und überdies Ihre Website gut in Erinnerung behalten.
Wie kann man eine 404-Seite kreativ gestalten?
Grundsätzlich gilt: Gute Fehlerseiten zeichnen sich durch eine ansprechende optische Umsetzung und einen charmanten und/oder amüsanten Text aus. Dabei können Sie sich an einigen Richtlinien orientieren:
- Dem Stil der Website treu bleiben: Eine gute 404-Webseite sollte zum Design des Webauftritts und zur Identität des dahinter stehenden Unternehmens passen. Achten Sie darauf, dass sich die Fehlermeldung hinsichtlich Inhalt, Ton und Optik in Ihr Webangebot einfügt.
- Dem Besucher kurz erklären, was passiert ist: Nicht jeder User weiß, was der Code 404 bedeutet. Anstatt nur „404 Not found“ oder „Fehler 404: Seite nicht gefunden“ anzugeben, können Sie kurz und knapp schildern, warum der Nutzer auf diese Seite gelangt ist. Dies kann durchaus auf amüsante Weise geschehen – häufig nehmen kreative Fehlerseiten Bezug auf den Kontext, dass sich die Besucher verlaufen bzw. in den Weiten des Internets verloren haben oder der Inhalt der Webseite verschoben wurde.
- Humor: Viele gelungene Hinweise auf den Code 404 punkten mit einem witzigen und selbstironischen Ansatz. Dabei sollte der für den Fehler 404 eingesetzte Text nicht länger als nötig sein. Die Besucher Ihrer Website haben sich eigentlich andere Inhalte von dieser Seite versprochen – deshalb sollten Sie mit dem Wortwitz schnell auf den Punkt kommen. Selbstverständlich können Sie auch über Bilder, Animationen oder sogar Videos die Besucher unterhalten.
- Animationen oder Mini-Browserspiele integrieren: Der Einsatz von animierten oder gar interaktiven 404-Seiten ist zwar mit einigem Aufwand verbunden, allerdings erzeugen solche Inhalte auch die größte Aufmerksamkeit.
20 witzige, originelle oder einfach schöne 404-Seiten
Um Ihnen einige Inspirationen für das Design Ihrer eigenen Fehlermitteilung zu geben, listen wir nachfolgend einige Musterbeispiele auf. In der Auswahl finden Sie charmante, skurrile, lustige und überraschende Ideen, wie man eine 404-Seite kreativ umsetzen kann.
Lego
Auf der Website des dänischen Unternehmens erscheinen bei der Fehlermeldung einige Lego-Figuren, die die Reaktion auf den 404-Error reizend verkörpern: Ein gutes Beispiel, wie sich die Benachrichtigung gut mit der Corporate Identity vereinbaren lässt.
Moviepilot
Die Filmwebsite beschreibt auf ihrer 404-Fehlerseite den Plot eines (fiktiven) Films, der denkbar gut zur Situation passt. Gelungen ist neben der augenzwinkernden Metaebene (durch den Kommentar des Moviepilot-IT-Teams) auch die Anmerkung oben rechts – hier wird erklärt, warum der Besucher auf dieser Seite gelandet ist.
Blizzard Entertainment
Die Blizzard-Fehlerseite schiebt den Error 404 scherzhaft den Besuchern in die Schuhe: Der Videospiele-Hersteller zeigt hier eine demolierte Version des Internetauftritts als Ergebnis der fehlerhaften Webseitenanfrage.
Kochatelier Berlin
Das Kochatelier Berlin schlägt beim Error 404 eine Brücke von der fehlerhaften Webseitenanfrage zu einer gehaltvollen Essenszubereitung.
Das soziale Netzwerk für berufliche Kontakte verweist bei der Fehlermeldung mit Text und Bild auf die Suchfunktion der Website. Das Foto wirkt erfrischend unprofessionell, da es einen handgeschriebenen Zettel zeigt.
GitHub
Den Onlinedienst für Software-Entwickler nutzen sicherlich auch etliche „Star Wars“-Fans. Die 404-Page von GitHub spielt auf ein bekanntes Zitat aus der Saga an und wird schon einige User zum Schmunzeln gebracht haben – inklusive GitHub-Maskottchen im Jedi-Meister-Look.
iStock
Die kanadische Bildagentur bietet bei ihrer Fehlerseite zwar kein Filmzitat, setzt aber ähnlich wie GitHub auf ein drolliges Design.
Jackrabbit Design
Auch die Marketingagentur Jackrabbit Design präsentiert ihre Fehlerseite verspielt. Inhaltlich bezieht sich die Meldung wie so oft darauf, dass die Besucher vom Weg abgekommen sind.
Fork
Der Online-Auftritt des Content-Management-Systems Fork hält es eher maritim (passend zum Corporate Design der Software): Die 404-Seite möchte den Nutzern weismachen, dass die angeforderte Seite auf hoher See verloren gegangen ist.
Audiko
So eine stilvolle 404-Webseite findet man selten – die Fehlermeldung vom Online-Klingeltonarchiv Audiko verbindet die Suche nach der richtigen Seite mit Sherlock Holmes und einer surrealen Gestaltung.
Huwshimi and Friends
Diese Designer-Website bietet den Besuchern ebenfalls eine schöne 404-Seite: Angeblich ist ein Dieb am Verschwinden der Webseite schuld. Die Meldung verzückt zusätzlich durch eine absurd-poetische Anweisung.
Umbro
Die Fehlermeldung des Sportartikelherstellers aus England interpretiert den Code 404 in kreativer und unterhaltsamer Weise als eine (noch nie dagewesene) Fußballaufstellung.
Airbnb
Neben vielen nützlichen Links bietet die Plattform für die Suche nach privaten Unterkünften auf ihrer 404-Webseite eine kleine Animation, bei der versehentlich eine Kugel Eis verloren geht.
This by Them
In der US-amerikanischen Software-Schmiede arbeiten anscheinend David-Bowie-Fans. Zumindest wird ein bestens passendes Zitat des Musikers bei dieser animierten 404-Seite verwendet, bei der sich ein verlorener Astronaut langsam in den Weiten des Weltalls verliert. Obendrein lassen sich die Sterne im Hintergrund durch Bewegungen des Mauszeigers umherschieben.
Code School
Bei der Online-Programmierschule Code School ist die Fehlerseite ebenfalls mit einem Raumfahrtszenario bebildert. Der per Animation dargestellte Start verläuft nicht sonderlich erfolgreich: Ein Seil im Boden verankertes Seil hält die Raumfähre zurück. Statt der Entdeckung neuer Sphären erwartet Sie der 404-Code – und ein dazu passendes bekanntes Zitat.
Bluegg
Die britische Agentur zeigt auf der 404-Webseite ihre scherzhafte Seite mit einem Video einer schrill schreienden Ziege.
Steve Lambert
Die 404-Webseite des Künstlers Steve Lambert ist eine der sonderbarsten Seiten ihrer Art. Der Künstler wendet sich in diesem mehrminütigen Video direkt an den fehlgeleiteten Besucher. Sein Gerede ist dabei ähnlich inhaltsleer wie der Raum, in dem er sich befindet, bzw. die Webseite, auf der man gelandet ist. Dies passt bestens zum Image, das der Künstler pflegt.
Emailcenter UK
Auf der Fehlerseite des Unternehmens Emailcenter UK geht es ein wenig interaktiv zu. Hier können Sie als vermeintliche Strafe für den 404-Error eine Person aus dem Entwicklerteam feuern oder allen verzeihen und einfach zur Homepage zurückkehren. Wenn Sie sich für eine virtuelle Entlassung entscheiden, erhalten Sie im Anschluss ein paar Zusatzinformationen über den jeweiligen Mitarbeiter.
Blue Fountain Media
Auf der Website von Blue Fountain Mountain wird man mit einer Runde Pacman vertröstet.
Gamespot
Passend zu den Inhalten der Gamespot-Website bietet auch diese Fehlermitteilung ein kleines Browserspiel.
Ähnliche Artikel
Error 404: Was die Fehlerseite bedeutet und wie man sie nutzen kann
Wie oft sind Sie schon beim Surfen im Netz in einer Sackgasse gelandet? Auf HTTP-404-Fehlerseiten trifft man recht häufig – sie dienen den Nutzern als Information, dass die angeforderte Seite nicht vorhanden ist. Ärgerlich nicht nur für User, sondern auch für Website-Inhaber, denn ein toter Link kann einen schlechten Einfluss auf das Suchmaschinenranking des Internetauftritts haben. Allerdings…
Ruslan GrumbleShutterstock Website-Design-Inspiration für kreative Websites
Sie sind auf der Suche nach Website-Design-Inspiration für Ihre Homepage? Im Netz finden sich zahlreiche Online-Plattformen, Communitys und Blogs zum Thema Homepage-Gestaltung. Wir haben die besten Quellen für‘ Webdesign-Inspiration für Sie zusammengestellt. Egal, ob Flat-Design, One-Page-Website oder WordPress-Theme, hier finden Sie Input für Ihr Online-Projekt.
Ruslan GrumbleShutterstock Die populärsten Webdesign-Trends für das Jahr 2024
Webdesigner werden im Jahr 2024 ihrer Kreativität freien Lauf lassen können: von nostalgischen und maximalistischen Designs bis hin zu technischen Raffinessen wie Parallax-Scrolling und Chatbots. Dabei liegt die Herausforderung hauptsächlich darin, die ausgewählten Komponenten auf möglichst stimmige Weise im eigenen Projekt unterzubringen. Wir zeigen Ihnen, welche Webdesign-Trends Sie…
MichaelJayBerlinShutterstock HTTP 400 (Bad Request): Bedeutung und Fehlerbehebung
Als Internet-Nutzer ist man immer wieder mit Fehlermeldungen konfrontiert. Besonders störend können die HTTP-Statuscodes sein – vor allem, wenn man nicht versteht, was sie bedeuten. Auch die Meldung „HTTP 400 – der Bad Request“ – ist für viele Internetnutzer ein Rätsel. Aber es ist eines, das sich in den meisten Fällen lösen lässt. Wir erklären Ihnen, was die Fehlermeldung bedeutet, und zeigen…
301 Redirects
Weiterleitungen vom Typ 301 Redirect gehören zum Standardrepertoire im Onlinemarketing, SEO und der Webentwicklung. Die permanenten Weiterleitungen kommen zum Einsatz, um 404-Fehler zu vermeiden, wenn sich die Adresse eines Webinhalts geändert hat. Wir zeigen, wie Redirects funktionieren und wie sich die 301-Weiterleitung per htaccess-Eintrag realisieren lässt.
