404 est sans aucun doute le code http le plus connu car sa signification (indiquer que la page demandée n'existe pas) a dépassé le monde du développement pour devenir un objet de société, presque populaire.

On en trouve de tous les genres, allant du texte noir sur fond blanc jusqu'à de vrais mini-jeux, mais à quelle point cette page est-elle importante ? Que doit contenir une bonne page 404 ?

C'est ce à quoi nous allons répondre dans cet article !

Pourquoi la personnaliser ?

Il ne faut pas penser que l'erreur 404 est quelque chose que l'on peut éviter en tant que développeur. N'importe quelle personne voulant partager une page spécifique de votre site peut se tromper dans l'url, générant alors une frustration pour le visiteur.

En effet, si vous ne configurez pas de page personnalisée, votre hébergeur s'en chargera pour vous et le plus souvent l'utilisateur arrivera simplement sur un message du genre "404 Not Found" au milieu de nul part, sans même avoir le temps de découvrir votre identité graphique.

Même si vous savez ce que signifie cette page, ce n'est pas le cas de tout le monde, et si c'est une page par défaut, la confiance en votre site va fortement diminuer pour le visiteur.

Qu'est-ce qu'une bonne page 404 ?

Il existe trois règles simples afin de contourner tous ces problèmes, les voici :

1 - Expliquer, rassurer

Il n'y a pas besoin d'expliquer pendant trois heures pourquoi la page est introuvable, mais il ne faut surtout pas limiter le message à : "Erreur 404".

Vulgarisez, dédramatisez, soyez pédagogue !

Privilégiez une phrase simple et positive que le visiteur lira forcément comme : "Oups, la page à laquelle vous tentez d'accéder n'existe pas, mais on en a pleins d'autres bien plus intéressantes !"

2 - Captiver l'attention

Même si le visiteur comprend ce qui lui arrive et qu'il a lu votre texte, il a de grandes chances de fermer l'onglet la seconde d'après.

C'est pour ça que vous avez besoin d'avoir un élément qui attire l'attention afin de le retenir, un élément différenciant votre sites des autres, pour lui donner le temps (et l'envie) de regarder l'intégralité de votre page, de votre menu, etc...

Une image drôle, une jolie animation, un mini-jeu, tout est bon pour ne pas perdre le lecteur et pouvoir le rediriger correctement, mais attention, il faut que le contenu reste en accord avec la ligne éditoriale ET la charte graphique du site !

3 - Rediriger

C'est le nerf de la guerre, une fois que votre visiteur a compris où il était, qu'il n'a pas perdu confiance en votre site et que vous avez réussi à le retenir, il faut l'inciter à revenir dans le droit chemin.

Pour cela il vous suffit d'un bouton bien visible vers l'accueil de votre site par exemple, et si vous possédez un site e-commerce, ça peut être le moment de le rediriger vers le produit le plus vendu de votre site. (Et pourquoi pas une petite réduction en prime ?)

Quelques exemples

Voici quelques exemples de page 404 efficaces qui respectent toutes les règles que je viens de vous énoncer, et évidemment pour commencer je vous partage celle que j'ai mise en ligne pour mon site personnel ! (La bombe est animée par une vibration qui la rend plus vivante que sur l'image)

Une de mes pages 404 préférée est celle de l'application Slack : le visiteur arrive dans un environnement appaisant (qui donne confiance et déculpabilise) dans lequel il peut se déplacer à l'horizontal et intéragir avec l'environnement. Cette page est à cheval entre la belle animation et le mini-jeu !

Et enfin une page très simpliste mais aussi très efficace, tout y est, même une référence bien connue de l'univers du film légo, et le call-to-action typique des sites e-commerces. Clair, net précis !


Vous avez aimé cet article ? Vous voulez laissez un commentaire ? Alors on se retrouve sur Facebook, Linkedin , Twitter ou mon site web !

A bientôt !