Strona 404 — najlepsze praktyki i inspiracje projektowe
Jeśli nie znasz jeszcze tego terminu, strona błędu 404 to strona, która ma za zadanie powiadomić użytkownika, że link, do którego próbowali uzyskać dostęp, jest uszkodzony lub nie istnieje. Nie trzeba dodawać, że otrzymanie strony błędu 404 jest irytujące dla każdego użytkownika, który go doświadcza.
Aby uczynić to zdarzenie bardziej znośnym dla użytkowników, wielu projektantów stron internetowych podjęło się dostosowania swojej strony błędu 404 tak, aby wyglądała bardziej „zabawna" i niepowtarzalna. Zwykle robią to, dodając humor, dowcip i projekt, który zawiera twórczą oryginalność na swojej stronie.
Jeśli masz również plan zaprojektowania w ten sposób własnej strony 404, to przyjrzenie się kilku przykładom już wykonanych niestandardowych stron 404 może być dla Ciebie miłą inspiracją. Dlatego zdecydowaliśmy się udostępnić listę dowcipnych i unikalnych przykładów stron błędu 404, które mogą ci pomóc podczas tworzenia.
Jak powinna wyglądać strona błędu 404
Najpierw wspomnimy o niektórych cechach, które naszym zdaniem powinna mieć niestandardowa strona błędu 404. Niektóre z tych strategii zostały faktycznie zastosowane przez wiele wpływowych stron internetowych.
1 Powinien pasować do ogólnego stylu Twojej strony internetowej
Jeśli pytasz nas, to powinno być oczywiste. Jest tak wiele motywów WordPress, które są specjalnie zaprojektowane, aby pasowały do klimatu określonego rodzaju działalności lub charakteru usług lub produktów, które promuje witryna. Dlatego to naturalne, że powinieneś dostosować projekt strony 404 zarówno do szablonu witryny, jak i ogólnego motywu witryny. Na przykład, jeśli prowadzisz witrynę restauracyjną specjalizującą się w wykwintnej kuchni, dobrze byłoby umieścić na stronie błędu 404 zdjęcie wymyślnie wyglądającego posiłku oraz jego nazwę. W ten sposób Twoi goście przynajmniej nie zapomną, że serwujesz dobre jedzenie, pomimo niedogodności, na jakie natknęli się w tej chwili. Dzięki wielu darmowym stronom internetowym i licznym zasobom z ilustracjami wektorowymimożesz poprawić wygląd swojej strony błędu 404 zgodnie z Twoimi potrzebami.
2 Powinien zawierać jakąś formę przeprosin
Wyskakująca strona błędu 404 jest nie tylko denerwująca, ale jest to również coś, co nie powinno mieć miejsca w pierwszej kolejności. Dlatego zawsze dobrze jest umieścić na stronie błędu jakieś przeprosiny, w których podkreślasz, że naprawdę przepraszasz za kłopoty użytkownika.
3 Strona błędu 404 powinna zawierać pasek wyszukiwania
Może to być również dobra praktyka. Jeśli dodasz pasek wyszukiwania do swojej strony błędu 404, może to sprawić, że użytkownicy pozostaną w Twojej witrynie, aby móc dalej ją przeglądać.
4 Rozważ dodanie linku
Podobnie jak pasek wyszukiwania, przydatny link może przynieść więcej korzyści niż szkody. Może to być dowolny link, który uważasz za ważny, taki jak blog, strona kontaktowa, a nawet strona główna. Ponadto dodanie linku w WordPressie jest bardzo łatwe.
5 Rozjaśnij to humorem
Wspomnieliśmy już wcześniej o humorze. Czy to dowcipne, autodestrukcyjne, czy po prostu dziwne, używanie humoru w takich sytuacjach może naprawdę znacznie poprawić nastrój gościa. Kto wie, twoje zrelaksowane i komediowe podejście może nawet skończyć się bardziej pozytywnym wrażeniem Twojej marki.
Krótko mówiąc, jeśli masz dobry pomysł na dowcipną linijkę, która może pojawić się na twojej stronie błędu 404, nie wahaj się jej dodać, ponieważ wiele osób wita humorystyczne podejście. A nawet jeśli Twoi goście nie uznają tego za zabawne, zawsze lepiej zachować beztroskę niż być maszynowym.
Możesz także ustawić przekierowanie do strony błędu 404. Na przykład, jeśli wystąpi błąd, Twoja strona może zostać przekierowana na stronę główną. Nie jest to jednak najlepsze rozwiązanie, ponieważ jeśli coś jest nie tak z Twoją stroną główną, wracasz do punktu wyjścia.
Ale zanim zagłębisz się w najlepsze przykłady, które przygotowaliśmy, poświęć trochę czasu na odświeżenie swojej pamięci o budowaniu strony 404 w WordPressie:
Nasz wybór inspiracji na stronie błędu 404
Teraz, gdy wiesz, jakie elementy mogą stworzyć dobrą stronę błędu 404, przedstawimy Ci również kilka przykładów stron z błędem 404, które przykuły naszą uwagę swoim poczuciem humoru i ogólnym wpływem ich projektu.
Mamy nadzieję, że sposób, w jaki wygląda ta strona błędu 404, nie pokazuje, jak zareagujesz, gdy natkniesz się na ten problem. Pixar zdecydował się dodać postać o imieniu Sadness z popularnego zdjęcia Inside Out z 2015 roku, z komunikatem, który radzi, aby nie brać takich rzeczy zbyt do siebie. Nie mogliśmy się bardziej zgodzić.
Po wprowadzeniu nowej tożsamości i projektu marki Mailchimp zmienił również wygląd swojej strony błędu. Witryna specjalizująca się w usługach e-mailowych biuletynów zdecydowała się zamieścić niekonwencjonalny obraz osła, którego głowa jest schowana głęboko w dziurze, co oznacza, że przeszukał każdy zakamarek witryny i po prostu nie znalazł żadnej strony. Cóż, jest oczywiste, że osioł naprawdę starał się znaleźć dla ciebie tę stronę, więc naprawdę nie ma sensu się tym zbytnio denerwować.
Ta profesjonalna, oparta na fotografii strona internetowa specjalizuje się w robieniu portretów noworodków, ślubów i innych wydarzeń rodzinnych. Tak więc pasuje tylko to, że zdecydowali się zamieścić zdjęcie rozmazanego malucha wpadającego w złość na swojej stronie 404. Mimo że ze zdjęcia widać, że dziecko zjadło ciasto, tekst subtelnie sugeruje, że strona, której szukałeś, również została zjedzona. Ale jak możesz się złościć na płaczące dziecko? To było po prostu ciekawe i przez przypadek pochłonęło twoją stronę!
Projekt strony 404 firmy Blizzard Entertainment ma pewien zwrot. Oprócz zepsutego okna i zniekształconego menu (które nadal działa, nawiasem mówiąc), pojawia się komunikat, który obwinia użytkownika o błąd. Byli nieco odważni w swoim podejściu, ponieważ jest to zdecydowanie zmiana w stosunku do zwykłych przeprosin, które zwykle pojawiają się na stronach błędów. Jednak wciąż jest wyjątkowy i orzeźwiający, więc ten niespodziewany obrót stolików z pewnością ucieszy przynajmniej część osób.
Widok całkowicie pokonanego antagonisty Angry Birds na ekranie oficjalnej strony tej gry tylko dlatego, że nie można znaleźć strony, może w rzeczywistości działać uspokajająco na osobę, która ją ogląda. W końcu to nic innego jak Bad Piggy może odnosić się do twojego nieszczęścia.
Flywheel to firma specjalizująca się w pomaganiu programistom i projektantom w tworzeniu witryn WordPress. Ich strona 404 jest uproszczona, ale składa się z kilku angażujących elementów do projektowania stron internetowych. Jest „to naprawdę do bani!” wiadomość, która jest w rzeczywistości sprytną grą słów, biorąc pod uwagę, że cyfra zero jest w rzeczywistości animowaną czarną dziurą, która wciągnęła coś, co wydaje się być laptopem z uszkodzoną stroną.
Każdy dobry projektant UX zdaje sobie sprawę, że chociaż najpierw skupiasz się na rozwiązywaniu największych problemów, jakie napotyka użytkownik, musisz również dostosować się do sytuacji, w których one nie są zgodne ze scenariuszem. Właśnie dlatego skromni ludzie z carwow stworzyli niesamowitą stronę 404, zawierającą grę wyścigową na wypadek, gdy strony nie ładują się zgodnie z planem.
Brytyjski humor często charakteryzuje się tym, że nie traktuje się zbyt poważnie. Sami właściciele firmy są Brytyjczykami, więc w tej sytuacji wpadają w szał. Zrobili to, rysując dwie eleganckie postacie, które są głęboko pogrążone w rozmowie o niedziałającej stronie. Cały czas doradzają użytkownikowi, co powinien zrobić dalej, używając brytyjskich zwrotów, które w tym kontekście brzmią wręcz komicznie.
Osobiście straciliśmy to, gdy nazwali stronę „czterysta czwartym komunikatem o błędzie” i kiedy skomentowali, że „ich kamerdyner internetowy naprawi ich błąd w mgnieniu oka”.
Slack to platforma współpracy, która pomaga firmom i firmom współpracować i iść naprzód. Ale jeśli wylądujesz na ich stronie 404, uważaj się za naprawdę zagubionego. Ich strona błędu zawiera ładną animację, która porusza się również po przeciągnięciu wskaźnika myszy po ekranie. Mimo że jest wizualnie angażująca, jest to przykład strony, która nie ma żadnego związku z treścią witryny, ale nadal dobrze spełnia swoją rolę.
Zainspiruj się i przygotuj do eksperymentów
Oprócz starannie stworzonych przykładów 404 stron używanych przez znane marki, istnieje wiele innych świetnych szablonów, do których możesz się zwrócić. Zaprojektowane przez doświadczonych artystów z dbałością o każdy szczegół to nasze ulubione.
Ten szablon, zaprojektowany przez Lenę Zaytsevę, jest doskonałym przykładem interaktywnego, nietypowego układu strony błędu 404. Minimalistyczny, ale efektowny, łączy biało-żółty kolor z animowanymi tekstami. Słowa z nazwą strony są rozdzielone liczbą „404″. Jednocześnie na dole strony pojawia się główna wiadomość wraz z przyciskiem powrotu. To rozwiązanie świetnie sprawdza się w przypadku ostrych stron internetowych i kreatywnych nisz.
Chociaż ta strona 404 może się początkowo wydawać prosta, jest dobrym przykładem tego, jak prostota może być skuteczna. Z dominującym odcieniem niebieskiego koloru i inteligentną ilustracją 3D pokazuje, że oryginalne, nietradycyjne strony 404 mogą zrobić prawdziwą różnicę. Jeśli chcesz, aby Twoja prezentacja online się wyróżniała, może to być odpowiednie rozwiązanie.
Strony błędów 404 w większości sprawiają, że czujemy się zagubieni w przestrzeni. W oparciu o tę metaforę ten przykład strony 404 to skuteczny sposób na przekierowanie odwiedzających witrynę na stronę główną. Urocza grafika i płaskie elementy są głównymi elementami tego szablonu. W przypadku, gdy potrzebujesz strony 404, która jest małym dziełem sztuki i może idealnie pasować do każdego rodzaju kreatywnej witryny, nie wahaj się wypróbować tego układu.
Zaprojektowany przez Caroline Lee, ten odważny układ 404 stron jest doskonałym wyborem dla każdego, kto preferuje wielokolorowy styl retro. Klimat tego szablonu przypomina nam pionierskie gry wideo i starą dobrą erę telewizji. Mieszanka jasnych kolorów, takich jak różowy, żółty, niebieski i zielony oraz różne rozmiary kształtów, będzie pasować do każdego studia projektowego lub gamingowego.
Jeśli istnieje jedno słowo, które może opisać ten układ, byłoby to żółte! Zainspirowany estetyką amerykańskiego pop-artu, ten model 404 łączy dwa odcienie żółci, kultowe kropki i paski. JEŚLI chcesz wnieść trochę grafiki na tego rodzaju stronę, jest to droga do zrobienia.
Prostota czasami tak wiele do zaoferowania. Ten szablon jest najlepszym dowodem. Po lewej stronie ilustracja przedstawiająca gitarzystę z gitarą ze zerwaną struną. Silna symbolika tej ilustracji doskonale pasuje do kontekstu strony błędu 404. Po drugiej stronie znajduje się prosta wiadomość z przyciskiem Wróć.
Patrzenie na już istniejące strony błędów 404 może być zabawne, ale stworzenie jednej może być zupełnie inną historią. Do pracy wymaga dowcipu, kreatywności i odrobiny otwartości. Niemniej jednak mamy nadzieję, że niektóre z naszych sugestii pomogą przynajmniej w uzyskaniu dobrego startu.