WebRankInfo : la plus grande communauté francophone du référencement
Olivier Duffez
Créateur de WebRankInfo,
consultant en référencement
Il est (malheureusement) courant que des internautes arrivent sur une page introuvable sur votre site. Plutôt que de leur afficher la page 404 par défaut, vous devriez créer une page 404 personnalisée. Voici comment faire avec plein d'astuces !
Publié le . Auteur : Olivier Duffez
Le code 404 signifie "not found" c'est-à-dire "non trouvé". C'est normal et même conseillé que votre serveur renvoie ce code HTTP si l'URL n'existe pas.
Si un internaute ou un robot (Googlebot et les autres) cherche à accéder à une page de votre site qui n'existe pas, votre serveur doit renvoyer le code HTTP 404. S'il renvoie autre chose c'est qu'il est mal configuré…
Quand l'URL est introuvable, selon ce que vous avez prévu sur votre site ou votre CMS, la page qui va s'afficher sera plus ou moins compréhensible et agréable pour l'internaute.
Déjà que l'internaute risque d'être déçu de tomber sur une page introuvable, mieux vaut tout faire pour "rattraper le coup" en rassurant l'internaute pour qu'il reste malgré tout sur votre site.
C'est pour ça que vous devez avoir une page d'erreur 404 personnalisée ! C'est très facile à faire, surtout en suivant ce tuto.
Si vous ne prévoyez rien, en cas d'erreur, la page qui s'affichera sera la page d'erreur par défaut de votre serveur (Apache ou autres) ou peut-être une page prévue par le navigateur (Chrome, Firefox, Safari, Internet Explorer, Edge, Opera, etc.).
La page d'erreur 404 par défaut d'Apache affiche quelque chose de ce genre, avec comme titre le fameux "404 Not Found" :
Not Found
The requested URL /test-erreur-xyz was not found on this server.
Avouez que ce n'est pas super accueillant !
Sur Apache, il suffit d'ajouter une ligne dans votre fichier .htaccess
(situé à la racine de votre site). Téléchargez par FTP ce fichier en local sur votre ordinateur, éditez-le et ajoutez la directive ErrorDocument (par exemple en fin de fichier). Puis uploadez-le.
La syntaxe de la directive ErrorDocument
est la suivante :
<code HTTP> est le code de l'erreur à personnaliser (dans les 400 ou les 500).
et <action> peut être :
Concrètement, vous devez indiquer dans <action> l'URI d'une page HTML créée spécialement pour l'occasion. Elle peut être en PHP, en HTML ou ce que vous voulez.
Concrètement, voici donc un exemple valide :
Conseil n°1 : dans le fichier .htaccess, l'URI de votre page personnalisée doit commencer par / et pas par http ou https, car sinon votre serveur ne va renvoyer un code 302 (redirection temporaire) au lieu du code d'erreur (404 par exemple). En d'autres termes, il ne faut pas ce genre de ligne :
Conseil n°2 : la page personnalisée doit reprendre le design de votre site, avec le même modèle de page que les autres pages de votre site (menu, barre latérale, pied de page). Ainsi, les internautes comprendront qu'ils sont toujours bien sur votre site et seront rassurés. Je ne suis pas le seul à vous le conseiller, l'aide officielle de Google pour créer des pages d'erreur 404 "utiles" indique ceci :
Assurez-vous que votre page d'erreur 404 garde la même apparence graphique (navigation comprise) que le reste de votre site.
Conseil n°3 : la page personnalisée doit rester légère, sans inclure d'éléments lourds à charger ou longs à exécuter. Dans le cas contraire, si vous avez trop d'erreurs 404, votre serveur saturera… Par exemple, ne listez pas les dernières actualités.
Conseil n°4 : en plus de rassurer l'internaute, donnez-lui des moyens de retrouver ce qu'il cherchait. Je vous suggère d'afficher directement au milieu de la page :
Conseil n°5 : vérifiez que votre page 404 ne génère pas à son tour des erreurs 404 ! Par exemple, si votre template utilise des chemins relatifs en référence à vos fichiers images, CSS, Javascript ou autres, alors il peut arriver que ces chemins ne pointent plus où il faut quand la page 404 est appelée.
Conseil n°6 : si vous avez plusieurs sous-domaines, configurez une page personnalisée pour chaque sous-domaine.
Conseil n°7 : renseignez-vous sur la bonne manière de configurer votre outil de mesure d'audience pour enregistrer le maximum d'informations sur les erreurs 404 (ou 500, etc.). Vous pouvez par exemple créer des alertes pour être prévenu si le nombre d'erreurs dépasse un certain seuil ou augmente trop. Pour aller plus loin, configurez un objectif (même si vous souhaitez qu'il y ait le moins d'erreurs 404 possible) car vous pourrez alors étudier le chemin qui a mené l'internaute vers l'erreur (s'il s'agit de liens internes). Lisez par exemple cet article (en anglais) sur le blog officiel de Google Analytics.
Conseil n°8 : personnalisez l'erreur 404 mais aussi les autres ! Ainsi, le message pourra être plus précis, ce qui sera apprécié par l'internaute. Voici un rappel des erreurs les plus courantes (consultez ma liste complète ou bien celle du W3C) :
Par exemple, pour configurer une page d'erreur 404 personnalisée et aussi une page d'erreur 410 personnalisée, créez les pages page-404.php
et page-410.php
et mettez ces lignes dans votre fichier .htaccess
:
Si vous utilisez WordPress, c'est vraiment très simple ! Vous pouvez utiliser un plugin dédié (par exemple 404page), mais ça me semble mieux de ne pas surcharger la liste et d'utiliser ce qui est prévu. En effet, il est probable que votre thème contienne un fichier 404.php. Pour le vérifier, une fois dans le back office de WordPress, cliquez sur "Apparence > Editeur" puis sur "404.php" pour l'éditer en ligne.
Il vous suffit alors de modifier le titre (balise H1 a priori) et le texte situé en-dessous, puis d'enregistrer vos modifications. C'est tout !
Si votre page 404.php n'affiche pas de formulaire de recherche interne, ajoutez ceci dans la zone principale du contenu de votre page 404.php :
Vous pouvez également créer une page 410.php pour gérer les erreurs 410, et ainsi de suite pour les autres codes d'erreur.
Pour créer une page d'erreur 404 personnalisée pour votre site Joomla, suivez ces étapes :
Remplacez l'information de 'page-404' par l'alias que vous avez choisi pour l'élément de menu que vous avez créé.
Si vous souhaitez trouver de l'inspiration, regardez des sites fun comme bonjour404.fr qui référence les meilleures idées de pages 404 personnalisées.
Vous pouvez même exploiter votre page d'erreur personnalisée dans votre stratégie de communication ! Ou pourquoi pas de recrutement (pour chercher des bons geeks ou développeurs web) !
Tout dépend de la cause de l'erreur 404 :
Je précise tout de même un peu les choses et vous incite à cliquer sur les liens pour en savoir plus :
Lisez mon tuto ! Comment réparer les erreurs 404 en SEO.
Des questions ? N'hésitez pas à les poser dans les commentaires !
Source de l'image d'illustration : Shutterstock, sous licence
Cet article vous a-t-il plu ?
Remarques :
Si vous souhaitez poser une question ou détailler un problème technique, il ne faut pas utiliser le formulaire ci-dessous qui est réservé aux avis. Posez votre question directement dans le forum Gmail de WebRankInfo. L'inscription est gratuite et immédiate.
En postant un avis, vous acceptez les CGU du site WebRankInfo. Si votre avis ne respecte pas ces règles, il pourra être refusé. Si vous indiquez votre adresse email, vous serez informé dès que votre avis aura été validé (ou refusé…) ; votre adresse ne sera pas utilisée pour vous envoyer des mailings et ne sera pas revendue ou cédée à des tiers.
13 commentaires
Bonjour,
Merci pour l'article de qualité (comme tous les autres).
Petite question, est-ce que faire une redirection de l'erreur 404 vers la page d'accueil du site est une mauvaise idée ? (surtout niveau SEO)
Oui c'est une mauvaise idée. Si une URL n'existe pas, il FAUT que le serveur renvoie un code 404, pas autre chose.
Merci pour la réponse.
D'accord, donc mettre cette ligne dans le .htaccess :
ErrorDocument 404 /Accueil
ce n'est pas bon ?
C'est bien le même principe qu'avec une page personnalisé ?
ça serait OK puisque le code renvoyé serait bien un 404, mais l'internaute n'aurait aucun message qui lui explique la situation. Je ne vois donc pas l'intérêt ?
En effet, je n'ai pas pensé au visiteur sur ce coup.
Un grand merci pour le conseil !
Merci Olivier pour tes articles,
Voici une belle illustration :
http://www.formigueres.fr/Blabla
bonjour, bel article.
moi j'ai réussi à faire une page 404 personnalisée…qui renvoie une erreur 404! Si je savais comment j'ai pu faire cela 🙂
Bonjour,
Merci beaucoup Olivier, vraiment très complet ton Tuto.
En complément, j'ai fait un petit article là-dessus : http://www.blackchili.fr/lerreur-404-page-not-found-les-plus-belles-erreurs/
J'ai fait une très belle sélection d'idée de pages 404, je vous laisse la découvrir.
Régis – Blackchili.fr
Merci Régis ! Si tu tant apprécié mon tuto (que j'ai voulu exhaustif en effet), n'hésite pas à le citer dans les ressources à la fin de ton petit article
Merci pour ces conseils!
Bien à vous
Vos conseils m'ont fortement aidé.
Bien à vous.
R.J.
Article très intéressant mais je pense qu'il s'y est glissé une petite coquille.
Vous préconisez de ne pas faire de chemin absolu après la code HTML, pourtant vous le faites dans le conseil n°8.
Cordialement,
Thomas
Merci Thomas, c'est corrigé !
Inscription à la newsletter
Catégories
Consulting SEO
Envie d'améliorer votre référencement ?
Consultant SEO depuis 2003, j'ai une très grande expérience en audit et consulting. Que ce soit pour une demande ponctuelle, pour un audit ou du long terme, je peux vous aider.
WebRankInfo / Tous droits réservés 2022 – Mentions légales – Me contacter