40 Pagini de eroare inteligente 404 de pe site-uri web reale

Rularea unui site web de succes înseamnă să fii atent pentru erori, cum ar fi pagini sparte sau performanță lentă. Cu toate acestea, uneori există probleme pe care pur și simplu nu le puteți evita, iar erorile 404 sunt una dintre ele.

Un 404 apare atunci când un utilizator solicită o pagină de pe site-ul dvs. web care nu există, aruncând astfel o pagină de eroare 404 care solicită utilizatorilor să revină la locul potrivit. Indiferent de câte resurse ai investit pentru a te asigura că site-ul tău web nu se prăbușește niciodată… există întotdeauna șansa ca utilizatorii să ajungă aici.

Este incomod, dar o realitate. Iar reacția vizitatorilor atunci când aterizează pe o pagină inexistentă poate varia de la „a-l lua cu liniște” la „și-și pierde complet mințile”.

Deși nu puteți face nimic în privința acestuia din urmă, puteți face lucrurile puțin mai puțin dureroase dacă aveți un mesaj de eroare creativ 404. Acest lucru poate face minuni pentru a-i face pe vizitatorii site-ului dvs. să zâmbească într-o situație altfel frustrantă.

Pentru ca site-ul dvs. să curgă, această postare va prezenta unele dintre paginile noastre de eroare preferate ale site-ului. Sperăm că veți putea să luați câteva idei pentru a vă reda propriul mesaj 404.

Ce este o eroare 404?

O eroare 404 este un cod standard de mesaj de eroare HTTP, care înseamnă că site-ul web la care încercați să accesați nu a putut fi găsit pe server. Este o eroare la nivelul clientului, adică fie pagina web a fost eliminată sau mutată și adresa URL nu a fost modificată în consecință, fie persoana tocmai a introdus adresa URL incorect.

În cea mai mare parte, vă puteți configura serverul pentru a crea o pagină de eroare 404 personalizată. (Dacă sunteți client HubSpot, faceți clic aici pentru a afla cum să vă personalizați pagina 404 în HubSpot.)

Unele pagini de eroare 404 personalizate includ o imagine eroului, o descriere plină de spirit, o hartă a site-ului, un formular de căutare sau informații de contact de bază.

Cele mai bune 404 exemple de pagini web

De-a lungul anilor, site-urile web au găsit diferite modalități de a informa vizitatorii despre o eroare 404 și de a-i canaliza înapoi la locul potrivit, unele simplu, altele creativ și altele hilar. Să începem prin a ne uita la câteva pagini creative de 404, apoi să vedem câteva exemple amuzante care cu siguranță vor încânta pe oricine le întâlnește.

Pagina nu a fost găsită: Pagini de eroare Creative 404

1. Sâmburi de porumb

În timp ce o pagină 404 poate ieși cu ușurință dintr-un site web, pagina de eroare a lui Pipcorn se aliniază perfect cu restul branding-ului site-ului. Există un fundal animat drăguț, un text prietenos care îi direcționează pe vizitatori să caute pe site (complet cu un joc de cuvinte inteligent) și o bucată de floricele de porumb folosită ca „0” în „404”.

2. Spotify

Gigantul de streaming de muzică Spotify și-a acoperit bazele cu o pagină inteligentă de 404. Cu un joc de cuvinte plin de spirit despre albumul lui Kanye West „808s and Heartbreak” și o animație record, site-ul distrează pentru scurt timp și apoi trimite vizitatorii înapoi la pagina de care au venit.

3. Genial

O modalitate simplă de a reduce tensiunea de pe pagina dvs. 404 este să adăugați un rapid „Hopa!” mesaj – vă ajută site-ul să se simtă mai personal pe măsură ce ghidați utilizatorii înapoi la locul potrivit. În cazul site-ului Genially, pagina include, de asemenea, o ilustrație ingenioasă asociată cu o copie jucăușă.

4. Adobe

După cum v-ați aștepta, pagina de eroare 404 a Adobe este atât utilă, cât și plăcută vizual. Acesta enumeră linkurile populare pe care vizitatorii le-ar putea dori alături de niște lucrări de artă digitale interesante care servesc drept metaforă vizuală pentru o pagină ruptă sau pierdută. Sincer, site-urile ar trebui să folosească metafore vizuale mai des.

5. Clorox

Pagina 404 pentru produsele de curățare Clorox se rotește între trei fotografii ușoare pentru a semnala vizitatorilor că au făcut un pas greșit. Este o utilizare inteligentă a branding-ului pentru a adăuga un scurt moment de încântare, în timp ce ajutați utilizatorii pierduți.

6. Colectivul Duma

Alteori, s-ar putea să nu aveți nevoie de o informație plină de spirit – spuneți-le vizitatorilor că nu există nicio pagină la adresă și lăsați-i să meargă mai departe. Agenția de consultanță în divertisment Duma Collective face exact acest lucru cu pagina sa de eroare, deși este completată de o imagine de fundal pentru un fler minor.

7. Chillhouse

Vorbind despre fler, marca de auto-îngrijire Chillhouse a depus eforturi suplimentare pentru a-și redirecționa vizitatorii cu stil. Pagina 404 este marcată corespunzător și chiar îi duce pe vizitatori într-o mică călătorie prin câteva imagini statice înainte de a reveni la pagina de pornire.

8. Puțin

Dacă introduceți un link Bitly incorect, veți fi direcționat către pagina 404 a Bitly. Presupunem că acest lucru se întâmplă destul de mult, motiv pentru care pagina 404 ajunge direct la obiect. Acesta explică ce s-ar putea să fi mers prost și îi solicită utilizatorilor să viziteze pagina de pornire Bitly dacă asta caută.

9. Ikea

Pagina 404 a lui Ikea este la fel de minimalistă, dar reușește totuși să introducă un branding inteligent acolo. Acest exemplu arată că paginile dvs. de eroare nu trebuie să fie elaborate pentru a înțelege ideea, dar nici nu este nimic greșit în a injecta ceva distracție.

10. Moxie Design Co.

Sigur, „a aruncat în aer internetul” ar putea fi puțin hiperbolic, dar le spune vizitatorilor că Moxie Design Co. nu se ia prea în serios cu mici derapaje ca aceasta. De asemenea, o bară de căutare este plasată convenabil în partea de jos pentru a vă trimite pe drum.

11. McKissack și McKissack

Ah, trucul clasic „am pierdut pagina”. Din nou, o modalitate ușoară de a prezenta un 404 fără a vă înstrăina publicul. Dacă sunteți o agenție precum McKissack & McKissack care gestionează multe interacțiuni cu clienții, copierea clară și concisă este esențială pentru toate paginile site-ului dvs., inclusiv pentru paginile de eroare.

12. Trucuri CSS

Ați rupt vreodată ambalajul unui site web pentru a vedea ce se află dedesubt? Acesta este conceptul pe care Tricks CSS îl urma în pagina lor de eroare 404. Acest lucru este atât spiritual, cât și amintește despre ceea ce este site-ul web: utilizarea inteligentă a stilului paginii.

13. Jocuri vechi bune

Pentru alte site-uri web, desfaceți front-end-ul și există... doar vastul gol al spațiului. Această pagină este o referință inteligentă la GOG Galaxy, care este clientul nativ de jocuri video al Good Old Games. Din fericire, un mic personaj de joc video este acolo pentru a oferi vizitatorilor un loc în care să raporteze o eroare dacă doresc.

14. Canva

Pentru ceva puțin diferit, consultați pagina 404 a Canva. Include nu doar un mesaj de eroare, ci și un puzzle chic pe care vizitatorii îl pot juca pentru un scurt divertisment. Nu e niciun rău să-ți lași vizitatorii să stea câteva minute, nu?

15. Innotech

Similar cu abordarea Canva, Innotech prezintă un joc Pong-esque pe pagina sa 404 pentru a oferi un scurt divertisment. Sunt șanse să vă amintiți un site ca acesta. În plus, ocolul distractiv completează un site web cu adevărat impresionant - serios, când ați terminat de jucat, mergeți la pagina de pornire și luați totul în considerare.

16. Miriade

Agenția video Myriad a optat pentru un design ciudat, de 404 pagini, pe marcă, care imită clasicele bare de culoare SMPTE care apar pe casetele și televizoarele vechi. Este o întoarcere amuzantă la tehnologiile mai vechi, în timp ce reprezintă problema mai modernă a unei pagini web inexistente.

17. KonMari

Cunoscută pentru metodele și marca ei populare de curățare și organizare, Marie Kondo a adus o senzație similară paginii 404 a site-ului ei. Copia, pe scurt și cu umor, aduce înapoi la filozofia ei de îngrijire – un detaliu mic, dar bine marcat, pe care fanii îl vor recunoaște.

18. BrandCrowd

Nu numai că ilustrația de pe această pagină de eroare este detaliată și captivantă, ci și copia este inteligentă. Ne place referirea la melodia Semisonic „Closing Time”: „Puteți face clic oriunde altundeva, dar nu puteți face clic aici.”

19. Hot Dot Productions

Pagina de eroare a lui Hot Dot rămâne fidelă sloganului său, „intersecția noilor tehnologii și design”. Pagina este animată de sute de puncte minuscule care își schimbă direcția ca răspuns la locul în care mutați cursorul. Este fascinant și o expoziție excelentă a capacităților de design ale agenției.

20. OrangeCoat

Dacă veți trimite un mesaj de eroare, de ce să nu distrați utilizatorul câteva secunde în timp ce îl ajutați? În urma unui salut prietenesc, OrangeCoat oferă o diagramă de flux care îi ajută de fapt pe utilizatori să-și dea seama de ce au ajuns la o pagină de eroare în primul rând.

21. Ervin & Smith

Această pagină 404 face mai mult decât redirecționează utilizatorii înapoi la paginile active. În schimb, pagina 404 a lui Ervin & Smith vă invită să derulați în jos și să aflați de ce aveți nevoie de o agenție de marketing digital și de ce să alegeți în special Ervin & Smith, încheiat cu un formular de contact. Fidelă misiunii sale, această agenție arată că orice pagină poate fi o oportunitate de conversie.

22. DayCloud Studios

… sau, 404-ul tău poate fi doar un loc în care să pierzi timpul pentru un minut, așa cum se poate vedea pe site-ul web al DayCloud Studios. Deplasarea cursorului pe ecran dezvăluie un mesaj 404 iluminat de lasere care trage din ochii unei pisici. Pentru că de ce nu?

23. Spațiul capului

Un alt exemplu al unui site care încorporează inteligent mesajele mărcii sale într-o pagină 404 - aplicația de meditație ghidată Headspace face efortul de a calma utilizatorii, încurajându-ne să respirăm adânc, apoi să revenim la site-ul principal.

24. Brutăria Wildwood

Unele site-uri web au integrat până acum o copie inteligentă de marcă în paginile lor, în timp ce altele au găzduit jocuri online complete pe ale lor. Dar, nu este nimic în neregulă cu o scurtă împingere înapoi în direcția corectă. Site-ul rafinat al Wildwood Bakery păstrează lucrurile scurte și dulci (la propriu).

Pagina negăsită: 404 pagini de eroare amuzante

25. Astuteo

Pagina 404 a agenției de design Astuteo este un echilibru perfect între elemente vizuale elegante, umor și utilitate. Aspectul minim oferă utilizatorilor informațiile de care au nevoie alături de o altă metaforă vizuală amuzantă, o navă de marfă care se scufundă și o figură care fuge.

26. LEGO

Sunt puține cuvinte necesare pe pagina de eroare 404 a LEGO - expresia personajului face totul clar. În plus, fanii francizei de filme LEGO se vor bucura de referința distractivă din copie.

27. Magnt

În acest mesaj de eroare amuzant, Magnt își bate joc de faptul că, da, ar fi putut sparge ceva - sau, pur și simplu nu poți scrie. Elementul vizual servește ca o modalitate rapidă de a ilustra rapid punctul lor.

28. IconFinder

Pagina de eroare a IconFinder este simplă, dar încântătoare. Mascota companiei care poartă un halat și pare obosită este un semn de referință pentru vizitatorii pierduți. Nu vă faceți griji însă, deoarece site-ul listează câteva dintre linkurile sale de vizitat mai jos.

29. Vise dulci

Aparent, echipa de la compania de ajutor pentru somn Sweet Dreams a luat prea multe dintre produsele sale, conform paginii 404 a site-ului. Această pagină nu numai că este plină de umor, ci se îmbină bine cu restul esteticii și mesajelor frontale ale site-ului pentru o senzație de coeziune.

30. GitHub

Linia „Aceștia nu sunt droizii pe care îi căutați” se referă la trucul mental Jedi al lui Obi-Wan Kenobi pe Stormtroopers din Star Wars Episodul IV și a devenit o expresie binecunoscută folosită pentru a spune cuiva că urmărește greșit. curs de acțiune. GitHub joacă pe această linie faimoasă în mesajul lor de eroare 404.

31. Patagonia

Pagina personalizată 404 a lui Patagonia surprinde perfect vibrația mărcii, completă cu un videoclip bumerang al unui frisbee twirler, un joc de cuvinte inteligent care combină „404” și „aloha” și linkuri către paginile sale de produse. Este un mod prietenos și amuzant de a saluta vizitatorii care au ajuns în locul greșit.

32. Cloud Sigma

Uită-te: Cloud Sigma ne lasă să participăm la o acțiune din culise. Pagina lor de eroare 404 se preface a fi o „pagina de pornire a dezvoltatorului junior” – acel dezvoltator junior fiind, ei bine, o pisică.

33. Teatrele AMC

Poate că ați mai fost la un cinema AMC înainte, dar sperăm că nu ați văzut niciodată pagina 404 a site-ului lor. Site-ul web folosește un text rapid, amuzant și relevant înainte de a vă trimite înapoi la locul potrivit.

34. Bruno

Nu este o coincidență că agențiile de creație sunt grozave în a crea 404 de pagini. Iată încă unul de la creativii de la Bruno, care interpretează clasicul comedie de cult din 2000 Dude, Where's My Car? Nu, nu are nimic de-a face cu compania sau site-ul web, dar sigur că va fi chicotit.

35. NPR

La început, pagina de eroare a NPR nu pare nimic special. Dar continuă să citești și vei vedea cum se leagă în mod inteligent la unele dintre poveștile lor grozave despre oameni, locuri și lucruri pierdute, cum ar fi un articol despre Amelia Earhart și unul despre Waldo. Acest lucru ar putea face utilizatorii pierduți să se simtă puțin mai puțin singuri.

36. Mediu

Medium adoptă o abordare similară cu pagina 404 a NPR, recomandând articole despre pierderea și pierderea lucrurilor. Consultați aceste articole dacă aveți timp - sunt lecturi destul de bune.

37. HomeStarRunner

HomeStarRunner.com, adăpostul unei serii de desene animate Flash, a avut o serie de pagini hilare de eroare 404 de-a lungul anilor. Cele mai recente prezintă personaje din serialul de desene animate într-o scenă care ar fi putut ieși direct dintr-unul dintre episoadele lor. Dacă activați sunetul când încărcați pagina, veți auzi personajul lor Strong Bad – cunoscut pentru că țipa fraze cu voce tare – spunând „404’d!”

38. Blizzard Entertainment

Iată o idee simplă care sfârșește prin a arăta elegant: pagina 404 a Blizzard Entertainment prezintă un personaj animat pierdut într-un viscol real și ceva umor pe care fanii World of Warcraft îl vor aprecia.

39. Bună mare idee

O călătorie rapidă pe site-ul web al experților în marketing și rețele sociale Hello Big Idea vă va spune ce trebuie să știți despre stilul său îndrăzneț și clar de copiere. Și, desigur, pagina sa de eroare 404 nu face excepție.

40. HubSpot

Ni se întâmplă și nouă! Acesta este mesajul pe care l-am publicat pentru a le spune vizitatorilor site-ului nostru că există unele probleme ale site-ului. Scopul nostru a fost să rămânem fideli vocii mărcii HubSpot, fiind cât se poate de iubitori, empatici și de ajutor.

Transformă o pagină de eroare 404 într-un moment de încântare

Nimeni nu vrea să aterizeze pe o pagină 404 - sunt enervante și neașteptate. Cu toate acestea, nu le puteți evita cu adevărat, așa că este întotdeauna o idee bună să aveți o pagină 404 la care să apelați pentru site-ul dvs.

Și, din perspectiva experienței utilizatorului, pagina ta 404 ar trebui să fie o mică viteză, nu un zid de cărămidă. Designul potrivit poate fi diferența dintre o săritură frustrată și o posibilă conversie, așa că de ce să nu îl faceți distractiv?

Nota editorului: această postare a fost publicată inițial în decembrie 2015 și a fost actualizată pentru a fi completă.