Si vous envisagez \u00e9galement de concevoir votre propre page 404 de cette mani\u00e8re, l’examen de quelques exemples de pages 404 personnalis\u00e9es d\u00e9j\u00e0 cr\u00e9\u00e9es peut vous inspirer. Ainsi, nous avons d\u00e9cid\u00e9 de partager une liste d’exemples de pages d’erreur 404 pleins d’esprit et uniques qui peuvent vous aider lors de votre cr\u00e9ation.<\/p>\n
\u00c0 quoi devrait ressembler une page d’erreur 404<\/h2>\n
Tout d’abord, nous mentionnerons certaines caract\u00e9ristiques que, \u00e0 notre avis, une page d’erreur 404 personnalis\u00e9e devrait avoir. Certaines de ces strat\u00e9gies ont en fait \u00e9t\u00e9 appliqu\u00e9es par de nombreux sites Web influents.<\/p>\n
1 Il doit correspondre au style g\u00e9n\u00e9ral de votre site Web<\/h3>\n
Si vous nous demandez, cela devrait \u00eatre une \u00e9vidence. Il existe de nombreux th\u00e8mes WordPress sp\u00e9cialement con\u00e7us pour s’adapter \u00e0 l’ambiance d’un certain type d’entreprise ou \u00e0 la nature des services ou des produits dont le site fait la promotion. Par cons\u00e9quent, il est tout \u00e0 fait naturel que vous adaptiez la conception de votre page 404 \u00e0 la fois au mod\u00e8le de votre site Web et au th\u00e8me g\u00e9n\u00e9ral de votre site Web<\/strong>. Par exemple, si vous \u00eates un site Web de restaurant sp\u00e9cialis\u00e9 dans la gastronomie, il serait bon d’incorporer une image d’un repas de fantaisie, ainsi que son nom dans votre page d’erreur 404. De cette fa\u00e7on, vos visiteurs n’oublieront pas au moins que vous servez de la bonne nourriture, malgr\u00e9 les d\u00e9sagr\u00e9ments qu’ils rencontrent en ce moment. Gr\u00e2ce \u00e0 de nombreux sites Web de stock gratuits<\/a><\/strong> et \u00e0 de nombreuses ressources avec des illustrations vectorielles<\/a><\/strong>vous pouvez am\u00e9liorer l’apparence de votre page d’erreur 404 en fonction de vos besoins.<\/p>\n Avoir une page d’erreur 404 pop-up n’est pas seulement ennuyeux, c’est aussi quelque chose qui n’aurait pas d\u00fb se produire en premier lieu. C’est pourquoi c’est toujours une bonne id\u00e9e d’inclure une sorte d’excuse dans votre page d’erreur<\/strong>, o\u00f9 vous soulignez que vous \u00eates vraiment d\u00e9sol\u00e9 pour les ennuis de l’utilisateur d’une mani\u00e8re ou d’une autre.<\/p>\n Cela peut aussi \u00eatre une bonne pratique. Si vous ajoutez une barre de recherche \u00e0 votre page d’erreur 404<\/strong>, les utilisateurs peuvent rester sur votre site Web afin de continuer \u00e0 explorer.<\/p>\n Tout comme une barre de recherche, un lien utile peut faire plus de bien que de mal<\/strong>. Il peut s’agir de n’importe quel lien que vous jugez important, comme votre blog, votre page de contact ou m\u00eame votre page d’accueil. De plus, ajouter un lien dans WordPress<\/a><\/strong> est super facile.<\/p>\n Nous avons d\u00e9j\u00e0 mentionn\u00e9 l’humour plus t\u00f4t. Que ce soit plein d’esprit, autodestructeur ou tout simplement bizarre, utiliser l’humour dans des situations comme celles-ci peut vraiment contribuer grandement \u00e0 all\u00e9ger l’ambiance de votre visiteur<\/strong>. Qui sait, votre approche d\u00e9tendue et comique pourrait m\u00eame leur donner une impression plus positive de votre marque dans son ensemble.<\/p>\n En bref, si vous avez une bonne id\u00e9e de ligne pleine d’esprit qui peut aller sur votre page d’erreur 404, n’h\u00e9sitez pas \u00e0 l’ajouter, car l’attitude humoristique est bien accueillie par beaucoup. Et m\u00eame si vos visiteurs ne trouvent pas cela amusant, il est toujours pr\u00e9f\u00e9rable de garder les choses l\u00e9g\u00e8res plut\u00f4t que d’\u00eatre une machine \u00e0 ce sujet<\/strong>.<\/p>\n Vous pouvez \u00e9galement d\u00e9finir une redirection vers votre page d’erreur 404<\/strong>. Par exemple, si une erreur se produit, votre page peut simplement \u00eatre redirig\u00e9e vers votre page d’accueil. Cependant, ce n’est pas la meilleure solution, car s’il y a un probl\u00e8me avec votre page d’accueil, vous revenez \u00e0 la case d\u00e9part.<\/p>\n Mais avant de vous plonger dans les meilleurs exemples que nous avons pr\u00e9par\u00e9s, prenez le temps de vous rafra\u00eechir la m\u00e9moire sur la cr\u00e9ation d’une page 404 dans WordPress :<\/p>\n Maintenant que vous savez quels \u00e9l\u00e9ments peuvent constituer une bonne page d’erreur 404, nous allons \u00e9galement vous fournir quelques exemples de pages d’erreur 404 qui ont retenu notre attention par leur sens de l’humour et l’impact global de leur conception.<\/p>\n<\/p>\n Voir page<\/a><\/p>\n Esp\u00e9rons que l’apparence de cette page d’erreur 404 ne montre pas comment vous r\u00e9agirez lorsque vous rencontrerez ce probl\u00e8me. Pixar a d\u00e9cid\u00e9 d’ajouter un personnage appel\u00e9 Sadness \u00e0 partir d’une image populaire de 2015 Inside Out, avec un message qui vous conseille de ne pas prendre ce genre de choses trop personnellement<\/strong>. Nous ne pouvions pas \u00eatre plus d’accord.<\/p>\n Voir page<\/a><\/p>\n Apr\u00e8s avoir lanc\u00e9 une nouvelle identit\u00e9 de marque et un nouveau design, Mailchimp a \u00e9galement chang\u00e9 l’apparence de sa page d’erreur. Le site Web sp\u00e9cialis\u00e9 dans les services de newsletter par e-mail a d\u00e9cid\u00e9 d’inclure une image non conventionnelle d’un \u00e2ne dont la t\u00eate est enfouie profond\u00e9ment dans un trou, indiquant qu’il a fouill\u00e9 toutes les crevasses du site et qu’il n’y a tout simplement aucune page \u00e0 trouver<\/strong>. Eh bien, il est \u00e9vident que l’\u00e2ne a vraiment fait de son mieux pour trouver cette page pour vous, donc il n’y a vraiment aucune raison d’\u00eatre trop frustr\u00e9 \u00e0 ce sujet.<\/p>\n Voir page<\/a><\/p>\n Ce site Web professionnel bas\u00e9 sur la photographie est sp\u00e9cialis\u00e9 dans la capture de portraits de nouveau-n\u00e9s, de mariages et d’autres \u00e9v\u00e9nements familiaux. Il est donc normal qu’ils aient d\u00e9cid\u00e9 d’inclure une photo d’un bambin tach\u00e9 faisant une crise de col\u00e8re dans leur page 404. M\u00eame s’il ressort clairement de l’image que l’enfant a fini par manger un g\u00e2teau, le texte sugg\u00e8re subtilement que la page que vous cherchiez a \u00e9galement \u00e9t\u00e9 mang\u00e9e<\/strong>. Mais comment se mettre en col\u00e8re contre un enfant qui pleure? C’\u00e9tait juste curieux et a fini par engloutir votre page par accident !<\/p>\n Voir page<\/a><\/p>\n La conception de 404 pages de Blizzard Entertainment a une torsion. Mis \u00e0 part une fen\u00eatre cass\u00e9e et un menu d\u00e9form\u00e9 (qui fonctionne toujours, soit dit en passant), il y a un message qui bl\u00e2me l’utilisateur pour l’erreur<\/strong>. Ils \u00e9taient un peu audacieux dans leur approche car cela change d\u00e9finitivement des messages d’excuses habituels qui ont tendance \u00e0 appara\u00eetre sur les pages d’erreur. Cependant, il est toujours unique et rafra\u00eechissant<\/strong>, donc il est certain qu’au moins certaines personnes seront amus\u00e9es par ce tour de table inattendu.<\/p>\n Voir page<\/a><\/p>\n Voir un antagoniste d’Angry Birds compl\u00e8tement vaincu sur l’\u00e9cran du site officiel de ce jeu simplement parce que la page est introuvable pourrait en fait avoir un effet r\u00e9confortant sur une personne qui la consulte<\/strong>. Apr\u00e8s tout, ce n’est autre qu’un Bad Piggy qui peut \u00eatre li\u00e9 \u00e0 votre malheur.<\/p>\n Voir page<\/a><\/p>\n Flywheel est une entreprise sp\u00e9cialis\u00e9e dans l’aide aux d\u00e9veloppeurs et aux concepteurs pour la cr\u00e9ation de sites Web WordPress. Leur page 404 est de nature simpliste mais comprend quelques \u00e9l\u00e9ments de conception Web attrayants. Il y a un "c’est vraiment nul !" message qui est en fait un jeu de mots intelligent<\/strong>, consid\u00e9rant qu’un num\u00e9ro z\u00e9ro est en fait un trou noir anim\u00e9 qui a aspir\u00e9 ce qui semble \u00eatre un ordinateur portable avec une page cass\u00e9e.<\/p>\n Voir page<\/a><\/p>\n Tout bon concepteur UX reconna\u00eet que si vous vous concentrez d’abord sur la r\u00e9solution des plus gros probl\u00e8mes d’un utilisateur, vous devez \u00e9galement vous adapter lorsqu’ils sortent du script<\/strong>. C’est pourquoi les humbles gens de carwow ont cr\u00e9\u00e9 une superbe page 404 pr\u00e9sentant un jeu de course automobile lorsque les pages ne se chargent pas comme pr\u00e9vu.<\/p>\n Voir page<\/a><\/p>\n L’humour britannique se caract\u00e9rise souvent par le fait de ne pas se prendre trop au s\u00e9rieux. Les propri\u00e9taires de l’entreprise eux-m\u00eames sont britanniques, donc dans cette situation, ils s’en prennent \u00e0 eux-m\u00eames. Ils l’ont fait en dessinant deux personnages chics qui sont profond\u00e9ment plong\u00e9s dans leur conversation \u00e0 propos d’une page qui ne fonctionne pas<\/strong>. Pendant tout ce temps, ils donnent des conseils \u00e0 l’utilisateur sur ce qu’il doit faire ensuite en utilisant des phrases britanniques qui semblent carr\u00e9ment comiques dans ce contexte.<\/p>\n Personnellement, nous l’avons perdu lorsqu’ils ont qualifi\u00e9 la page de "Quatre-cent-quatri\u00e8me message d’erreur" et lorsqu’ils ont comment\u00e9 que "leur web-majordome corrigera leur erreur en un clin d’\u0153il".<\/p>\n Voir page<\/a><\/p>\n Slack est une plateforme collaborative qui aide les entreprises et les entreprises \u00e0 travailler ensemble et \u00e0 aller de l’avant. Mais si vous atterrissez sur leur page 404, consid\u00e9rez-vous vraiment perdu. Leur page d’erreur comporte une jolie animation qui se d\u00e9place \u00e9galement si vous faites glisser le pointeur de votre souris sur l’\u00e9cran<\/strong>. M\u00eame s’il est visuellement attrayant, il s’agit d’un exemple de page qui n’a aucune corr\u00e9lation avec le contenu du site Web, mais qui fait toujours bien son travail.<\/p>\n Outre les exemples de pages 404 soigneusement cr\u00e9\u00e9s et utilis\u00e9s par des marques c\u00e9l\u00e8bres, il existe de nombreux autres excellents mod\u00e8les vers lesquels vous pouvez vous tourner. Con\u00e7us par des artistes exp\u00e9riment\u00e9s avec une attention port\u00e9e \u00e0 chaque d\u00e9tail, ce sont nos favoris.<\/p>\n Voir page<\/a><\/p>\n Con\u00e7u par Lena Zaytseva, ce mod\u00e8le est un excellent exemple de mise en page de page d’erreur 404 interactive et atypique<\/strong>. Minimal, mais efficace, il combine la couleur blanche et jaune avec des textes anim\u00e9s. Les mots avec le nom du site Web sont s\u00e9par\u00e9s par "404". Simultan\u00e9ment, votre message principal accompagn\u00e9 du bouton de retour appara\u00eet en bas de la page. Cette solution est id\u00e9ale pour les sites Web pointus et les niches cr\u00e9atives<\/strong>.<\/p>\n Voir page<\/a><\/p>\n Bien que cette page 404 puisse sembler basique au premier abord, c’est un bon exemple de la fa\u00e7on dont la simplicit\u00e9 peut \u00eatre efficace<\/strong>. Avec une nuance de couleur bleue dominante et une illustration 3D intelligente, cela montre que les pages 404 originales et non traditionnelles peuvent faire une r\u00e9elle diff\u00e9rence. Si vous voulez que votre pr\u00e9sentation en ligne se d\u00e9marque, cela peut \u00eatre la bonne solution.<\/p>\n Voir page<\/a><\/p>\n Les pages d’erreur 404 nous donnent surtout l’impression d’\u00eatre perdus dans l’espace. Bas\u00e9 sur cette m\u00e9taphore, cet exemple de page 404 est un moyen puissant de rediriger les visiteurs du site Web vers la page d’accueil<\/strong>. De beaux graphismes et des \u00e9l\u00e9ments plats sont au centre de ce mod\u00e8le. Dans un cas, vous voulez une page 404 qui est une petite \u0153uvre d’art et qui peut parfaitement fonctionner pour tout type de site Web cr\u00e9atif, n’h\u00e9sitez pas \u00e0 essayer cette mise en page.<\/p>\n Voir page<\/a><\/p>\n Con\u00e7ue par Caroline Lee, cette mise en page audacieuse de 404 pages convient parfaitement \u00e0 tous ceux qui pr\u00e9f\u00e8rent le style r\u00e9tro et multicolore<\/strong>. L’ambiance de ce mod\u00e8le nous rappelle les jeux vid\u00e9o pionniers et une bonne vieille \u00e8re de la t\u00e9l\u00e9vision. Le m\u00e9lange de couleurs vives comme le rose, le jaune, le bleu et le vert et les diff\u00e9rentes tailles de formes s’adapteront \u00e0 n’importe quel studio de design ou de jeu.<\/p>\n Voir page<\/a><\/p>\n S’il y a bien un mot qui peut d\u00e9crire cette mise en page ce serait jaune! Inspir\u00e9 de l’esth\u00e9tique pop art am\u00e9ricaine, cet exemple 404 combine deux nuances de jaune, des pois et des rayures embl\u00e9matiques. SI vous voulez apporter un peu d’art dans ce genre de page<\/strong>, c’est une voie \u00e0 suivre.<\/p>\n2 Il devrait contenir une forme d’excuse<\/h3>\n
3 Une page d’erreur 404 doit inclure une barre de recherche<\/h3>\n
4 Pensez \u00e0 ajouter un lien<\/h3>\n
5 All\u00e9gez-le avec humour<\/h3>\n
\n
Nos s\u00e9lections d’inspiration de page d’erreur 404<\/h2>\n
![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e692533b50.jpg\")
<\/a><\/p>\n![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e6929afc71.jpg\")
<\/a><\/p>\n![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e692e67c09.jpg\")
<\/a><\/p>\n![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e69330362e.jpg\")
<\/a><\/p>\n![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e693715f37.jpg\")
<\/a><\/p>\n![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e693c14d9a.jpg\")
<\/a><\/p>\n![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e694141c45.jpg\")
<\/a><\/p>\n![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e6947140c2.jpg\")
<\/a><\/p>\nInspirez-vous et pr\u00e9parez-vous \u00e0 exp\u00e9rimenter<\/h2>\n
![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e694aab018.jpg\")
<\/a><\/p>\n![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e69501efe6.jpg\")
<\/a><\/p>\n![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e6954677d9.jpg\")
<\/a><\/p>\n![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e6958179b7.jpg\")
<\/a><\/p>\n![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e695d0a1cd.jpg\")
<\/a><\/p>\n
![\"Une](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-337418-633e696159b5e.jpg\")
<\/a><\/p>\n