Ce qui fait une grande page d'erreur 404?

Personne ne veut penser que les visiteurs du site Web passent du temps sur les pages d'erreur, mais cela se produit. La page d'erreur 404 est un endroit où ces interactions se produisent assez fréquemment. Concevez-le d'une manière qui parle aux utilisateurs plutôt que de les encourager à quitter votre site.

Les pages d'erreur 404 les plus mémorables et les moins frustrantes sont les plus réussies. Ils peuvent aussi être les plus amusants à concevoir. Alors, que pouvez-vous faire pour créer la meilleure page 404 pour votre site? Voici quelques conseils, astuces et une galerie d’excellents exemples.

Qu'est-ce qu'une page d'erreur 404?

Les visiteurs du site Web tombent sur une page d'erreur 404 lorsqu'ils tentent de visiter une page qui n'existe pas. Cela peut être dû au fait que la page a été supprimée, que le serveur ou la connexion Internet est en panne, que les utilisateurs ont cliqué sur un lien rompu ou saisi une URL incorrecte.

En règle générale, 404 pages d'erreur génèrent l'un des messages suivants:

  • 404 introuvable
  • HTTP 404 introuvable
  • Erreur 404
  • La page est introuvable
  • L'URL demandée n'a pas été trouvée sur ce serveur

En ce qui concerne la conception globale de 404 pages, il existe deux options: une page générique 404 ou une page personnalisée 404. Les pages génériques ne font que cracher les messages ci-dessus sans aucun égard pour la conception. Les pages personnalisées sont celles pour lesquelles vous concevez et créez des options. Pour ce faire, vous devez avoir accès au serveur hôte. (Ce n'est pas quelque chose que nous allons aborder ici, mais vous pouvez en apprendre plus à ce sujet dans A List Apart.)

De bonnes pages d'erreur 404 personnalisées indiquent aux utilisateurs quoi faire s'ils sont mal adressés. Les pages doivent inclure des informations utiles qui aideront un visiteur à rester sur votre site et à trouver l’information qu’il recherche. (Espérons qu'ils auront un design astucieux aussi.)

Informations de base indispensables

Pour être plus efficace, une page d'erreur 404 doit être de nature simple. Cela devrait indiquer aux utilisateurs qu'il y a une erreur (évidemment) et quelles options ils ont pour avancer à partir de cette page.

Ce qu’une page 404 ne devrait pas avoir, c’est un tas de jargon technique. (Vous ne voulez pas effrayer les utilisateurs, n'est-ce pas?) En réalité, vous ne devriez probablement même pas utiliser le titre? 404 Erreur? parce que beaucoup de vos utilisateurs n’auront aucune idée de ce que cela signifie. Tenez-vous en à quelque chose de plus significatif, tel que? La page est introuvable.?

Il y a quelques autres informations que vous devez avoir sur la page 404. N'oubliez pas que le but est de garder les visiteurs en cliquant s'ils ont trouvé la page par erreur, de ne pas les perdre.

  • Un titre fort ou un texte expliquant à un utilisateur pourquoi il est ici. Lorsque vous atterrissez sur une page Web, vous ne savez pas quoi faire. Assurez-vous que les utilisateurs savent qu'ils ne sont pas sur la bonne page, mais sur le bon site.
  • Chercher. Assurez-vous que la page d'erreur 404 contient la même fonctionnalité de recherche (et au même emplacement) que le reste de votre site. Ainsi, les utilisateurs peuvent rechercher la page qu'ils ont l'intention de visiter.
  • Liens vers votre page d'accueil et votre plan du site. Cela se produira probablement en tant qu'élément de conception comprenant un en-tête ou un pied de page qui correspond au reste du site.
  • Information minimale sinon. Envisagez de supprimer la navigation compliquée. Si un utilisateur accède à une page par erreur, ne lui donnez que quelques options pour réussir. Trop d’options ici pourraient frustrer davantage l’utilisateur ou le rendre plus confus.
  • Inclure un appel évident à l'action. Dites aux utilisateurs quoi faire ensuite.

Rendre 404 pages utilisables

Une partie du processus de conception en matière de 404 pages devrait être la convivialité. Incluez des fonctionnalités qui rendent la page à la fois attrayante et fonctionnelle pour l'utilisateur égaré.

Google propose une liste d’excellentes suggestions d’informations à inclure dans une page 404 personnalisée de ses outils pour les webmasters. Ces conseils incluent:

  • Indiquez clairement aux visiteurs que la page qu'ils recherchent est introuvable. Utilisez un langage convivial et invitant.
  • Assurez-vous que votre page 404 a la même apparence et le même aspect que le reste de votre site.
  • Envisagez d'ajouter des liens vers vos articles ou publications les plus populaires.
  • Pensez à fournir un moyen aux utilisateurs de signaler un lien rompu.
  • Assurez-vous que votre serveur Web renvoie un code de statut HTTP 404 réel lorsqu'une page manquante est demandée, afin qu'elle n'apparaisse pas dans les résultats de la recherche.
  • Utilisez le widget Améliorer 404 pour incorporer un champ de recherche sur votre page 404 personnalisée.
  • Utilisez l'outil Changement d'adresse pour informer Google du déplacement de votre site.

Pour les concepteurs, voici une autre astuce: Soyez créatif. Une page 404 ne doit pas forcément être ennuyeuse si elle est techniquement solide.

Concevoir 404 pages avec un but

Lorsque vous réfléchissez à la conception d'une page d'erreur 404, commencez par examiner son fonctionnement par rapport au reste du site. Quelle est l'ambiance ou le ton de votre conception globale? Comment cette page peut-elle correspondre à cela?

Les pages d'erreur géniales s'intègrent parfaitement au site sur lequel elles résident. Si votre site a un ton léger et humoristique, la page 404 le devrait également. Les couleurs et les images devraient également avoir un design cohérent. Attention, dans la conception, à ne pas reprocher à l'utilisateur de se trouver sur la mauvaise page. (Cela se produit plus souvent que vous ne le pensez.)

Réfléchissez à la conception d'une page d'erreur comme à toute autre page du schéma de conception global.

  • Maintenir la cohérence de la conception. Utilisez la même couleur, la même typographie et les mêmes styles d'image que ceux intégrés aux autres pages du site.
  • Maintenir la marque. L'utilisation du même logo, du traitement des en-têtes et des pieds de page aidera les utilisateurs à reconnaître votre site.
  • Gardez les choses simples visuellement. Moins, c'est plus quand il s'agit de pages d'erreur.
  • Ne faites pas défiler les utilisateurs. Ceci est une conception d'un seul écran.
  • Évitez trop de gadgets. Bien que ce soit une bonne idée de conserver le ton et la convivialité de votre site et de votre marque, trop d’extras? peut faire oublier aux utilisateurs ce qu’ils cherchaient.
  • S'excuser et être empathique. C'est bien de regretter qu'un utilisateur ait atterri au mauvais endroit.
  • Si votre site nécessite un identifiant, ajoutez un emplacement.(L'erreur s'est-elle produite parce que l'utilisateur devait être connecté?)
  • Sois créatif. Ou drôle. Mais testez d'abord la page. Assurez-vous que des utilisateurs aléatoires obtiennent.
  • Si vous utilisez? 404 error ,? ajoutez une deuxième ligne de texte indiquant aux utilisateurs ce que cela signifie ou ce qu'ils doivent faire ensuite.

12 grands exemples

Il n'y a rien comme frapper une grande page d'erreur 404. Cela facilite la frustration d'un lien défectueux ou brisé. Voici une douzaine de pages qui ne manqueront pas de vous donner envie de trébucher sur une erreur.

Art déviant

Gig Masters

iFolderLinks

Lego

Poisson mou

Magnt

Mattel

ModCloth

Radio Nationale Publique

Steve Lambert

Titleist

Tobi

Conclusion

Il peut être difficile de concevoir une page qui soit le résultat d’une erreur aussi amusante que celle d’un lieu propice à la créativité. Concevoir une page 404 efficace allie simplicité, convivialité et style.

Avons-nous oublié l'un des éléments que vous aimez voir dans une page d'erreur 404? Avez-vous conçu une superbe page 404? Partagez vos idées et vos designs avec nous dans les commentaires, sur Facebook ou Twitter.