Pages Erreur 404 : les plus originales et créatives de 2017 !

Besoin d’inspiration pour créer une page erreur 404 qui sorte du lot ? Voici des exemples de pages 404 créatives, originales, décalées, drôles en provenance de sites Francophones et Anglophones variés !

Que les choses soient claires dès le départ, cette liste de pages 404 n’est pas un classement (il serait trop dur de choisir), nous vous présentons donc ici uniquement des exemples créatifs d’erreurs 404 découvertes à droite et à gauche, sur des sites francophones et anglophones. Ces designs originaux pourront vous inspirer pour créer la vôtre ou repenser votre page 404 traditionnelle actuelle. Nous avons tout de même glissé dans cette liste quelques pages avec un design orienté pour une cible un peu plus pro.

Il d’ailleurs intéressant de garder à l’esprit qu’outre le design, une page erreur 404 doit, si possible, avoir un réel intérêt pour l’internaute qui s’y perd. Si vous pouvez réaliser une page 404 à la fois belle graphiquement, décalée et optimisée pour la conversion, vous serez gagnants à 200% !

La page 404 qui vous fait jouer à Pac-Man

Attention, cette page 404 a beau être géniale, ce n’est pas la plus discrète…

URL : https://www.bluefountainmedia.com/404

La 404 de Madmoizelle

Quand on parle de page 404 créative et décalée…

URL : https://www.madmoizelle.com/404

La page erreur 404 de Hot Dot

Cette page erreur 404 créative a le mérite d’aller avec le nom du site internet « hot dot » (point chaud).

URL : https://hotdot.pro/en/404/

La page 404 d’Angry Birds

URL : https://www.angrybirds.com/erreur-404

Une 404 décalée peut faire son petit effet

Créer une 404 originale et décalée, c’est bien, l’accompagner d’un texte qui l’est tout autant, c’est encore mieux ! (Si la cible s’y prête bien entendu)

URL : https://retardzone.com/404

La 404 de Star Wars

On en attendait pas moins de Star Wars…

URL : https://www.starwars.com/erreur-404

La 404 de Ridley

Cette page 404 a le mérite d’être cohérente avec l’activité de l’entreprise : fabricant de vélos.

URL : https://www.ridley-bikes.com/fr/nl/404

La page 404 pour les amateurs d’Android

Si vous êtes un adepte des smartphones sous Android, il y a de fortes chances que ce site vous dise quelque chose. Le moins que l’on puisse dire, c’est que leur page 404 est cohérente avec le thème du site !

URL : https://www.frandroid.com/404

La page 404 de Rushy

Les 404 dans le domaine du jeu vidéo sont généralement une très bonne source d’inspiration.

URL : https://rushy.fr/404/

Une page 404 originale dans le prêt à porter

On peut difficilement admettre que cette page 404 ne soit pas originale. En revanche, dommage de ne pas avoir repris le header du site, cela pourrait être la page 404 de n’importe quel site de prêt à porter…

URL : https://www.reversible.fr/404

L’erreur 404 de l’ESCY

Une page 404 non conformiste pour un établissement scolaire catholique.

URL : https://www.escy.net/404

La page 404 de Chuck… Web Alliance

Si vous êtes en manque d’inspiration, Chuck Norris reste une valeur sûre qui fera son petit effet sur les internautes.

URL : https://www.web-alliance.fr/404-2/

La page 404 d’Innocent

En gros, leur page erreur 404 est pas mal.

URL : https://www.innocent.fr/erreur-404

La page 404 de Golden Moustache

Golden Moustache a intégré un Gif sur sa 404, le moins que l’on puisse dire, c’est que c’est dans l’air du temps.

URL : https://www.goldenmoustache.com/dsdvdsq

La 404 de Louis Vuitton

Les marques de luxe peuvent également réaliser des 404 à leur image, c’est le cas de celle de Louis Vuitton qui est très réussie.

URL : https://fr.louisvuitton.com/fra-fr/homepage:CDVQDV

La 404 version Airbnb

URL : https://www.airbnb.fr/VFSSQV

La page 404 de Nintendo

URL : https://www.nintendo.fr/erreur-404

L’erreur 404 de Vins d’Alsace

Parfois, il ne suffit pas de grand chose pour transformer une erreur 404 classique en quelque chose d’un peu plus créatif. C’est le cas de ce site qui a opté pour une illustration sympa en lien avec son activité.

URL : https://www.vinsalsace.com/fr/404/

La page erreur 404 de Foot Direct

Ce site vous permet carrément de jouer à un jeu de foot directement depuis sa page 404. Si vous souhaitez tester, on vous recommandera de le faire depuis un ordinateur car l’expérience utilisateur sur mobile est plus limitée (impossible de scroller la page une fois sur le jeu).

URL : https://www.foot-direct.fr/erreur-404

D’autres pages erreur 404 créatives à découvrir

Nous pourrions vous en présenter une centaine. En voici d’autres qui valent le détour :

• https://http.cat/404
• https://moz.com/404
• https://www.sudouest.fr/404.php
• https://www.ateliercompote.fr/404
• https://yieldmo.com/404
• https://www.trocathlon.fr/404/
• https://www.cocktails-faciles.fr/404
• https://www.6play.fr/404
• https://www.magnt.com/404/
• https://bluegg.co.uk/404
• https://mailchimp.com/dvfs
• https://www.dacloud.me/404/
• https://www.carrefour.fr/erreur404
• https://www.shamballajewels.com/404
• https://tigresdegarges.com/404
• https://www.lego.com/fr-frdvasvszqa
• https://audiko.net/404
• https://klout.com/erreur-404
• https://wearespry.com/404

Si vous connaissez d’autres pages 404 créatives ou originales, n’hésitez pas à les partager dans les commentaires ci-dessous.

Comment mettre en ligne une nouvelle page erreur 404 personnalisée ?

Maintenant que vous avez l’inspiration nécessaire pour créer une page erreur 404 personnalisée pour vous différencier, comment faire en sorte que cette nouvelle page 404 remonte lorsqu’un internaute arrive sur un code 404 ? La procédure est simple mais elle requiert un accès au serveur qui héberge votre site internet via FTP :

• Si ce n’est pas déjà fait, passez en ligne votre nouvelle page 404 et récupérer son URL finale (vous en aurez besoin pour la suite)
• Connectez-vous ensuite au FTP de votre hébergement mutualisé ou dédié qui héberge le site dont vous avez optimisé la page erreur 404
• Rendez-vous dans le dossier précis du site avec la page 404 de base à remplacer par la nouvelle personnalisée
• A la racine du dossier, recherchez un fichier nommé .htaccess et le télécharger sur votre bureau
• Faites une copie dans un autre dossier de ce fichier au cas ou vous feriez une mauvaise manipulation qui rende inaccessible le site (oui c’est possible)
• Éditez ensuite le fichier .htaccess avec un éditeur de texte comme Notepad ou un logiciel plus avancé comme Dreamweaver, SublimeText, Notepad++, …
• Recherchez la mention « ErrorDocument 404 » dans votre fichier .htaccess :
  – Si aucune mention n’est ajoutée, il vous suffira alors d’ajouter ceci à votre fichier « ErrorDocument 404 /url-de-votre-404-en-ligne.html » (votre URL peut se terminer par .html, .php, .jsp ou autre chose, veillez à garder uniquement ce qui se trouver après votre nom de domaine en ajoutant bien le « / » au début).
  – Si une mention « ErrorDocument 404 » est détectée, il suffira juste de remplacer la page 404 actuelle par la nouvelle en suivant la même procédure que ci-dessus.
• Une fois la mention « ErrorDocument 404 » remplacée dans votre fichier .htaccess, il ne suffira plus qu’à l’enregistrer et l’uploader à nouveau sur votre serveur. Votre FTP vous demandera alors si vous souhaitez remplacer votre fichier actuel, vous n’aurez qu’à dire oui.
• Une fois cette dernière manipulation terminée, vous n’aurez plus qu’à tester votre nouvelle page 404 en vous rendant en navigation privée sur votre site internet et en tapant une fausse URL à votre convenance. Ex: wwww.mondomaine.com/jeveuxtestermanouvellepage404.html