Содержание

Как оформить страницу ошибки 404

Расскажем, что такое ошибка 404, почему она возникает и как оформить под неё страницу, чтобы не терять посетителей сайта. Объясним, как найти ошибки на сайте и предотвратить их появление.

Подпишись на Telegram

Подписаться

Ошибка 404: что это значит?

Иногда при переходе по ссылке вместо страницы сайта на экране появляется надпись: «Страница не найдена. 404 not found. Ошибка 404». Это значит, что такой веб-страницы нет или у неё поменялся адрес.

Пример страницы 404 на сайте Lenta.ru Подключить Roistat бесплатно

Почему возникает ошибка 404:

  • в URL ссылки была допущена ошибка;
  • был изменён URL-адрес страницы;
  • сайт временно не работал или вообще не существовал;
  • неправильно сработал сервер;
  • веб-страницу удалили.

Иногда владельцы сайтов не догадываются о таких ошибках. Особенно сложно следить за корректностью ссылок на крупных порталах с тысячами страниц. Поэтому пользователи периодически сталкиваются с надписью «404 Page Not Found». Иногда страница 404 появляется из-за ошибки самого пользователя, если он вводит или корректирует URL-адрес вручную.

Почему нужна отдельная страница для 404 ошибки

При вводе URL в строке браузера вручную возможны неточности и опечатки. Пользователи так или иначе могут столкнуться с ошибкой 404 на любом сайте. Если не задать такую страницу, посетитель не поймёт, что произошло, почему по ссылке не открылась ожидаемая страница. Для страницы с ошибкой 404 нужно придумать интересное оформление, оптимизировать её, чтобы пользователи не покидали сайт.

Грамотно настроенная страница 404 поможет:

  1. Сохранить трафик сайта и позиции в выдаче результатов поиска.
    Сайт теряет трафик, если пользователи часто закрывают его из-за ошибки 404. Из-за этого поисковые системы могут понизить уровень ранжирования сайта.
  2. Предложить посетителю что-то взамен неоткрывшейся страницы. Пользователь попал на неработающую страницу, когда искал конкретный контент, возможно, даже форму регистрации. Сделайте страницу 404 полезной для посетителя, предложите ему почитать о ваших ключевых продуктах, дайте ссылки на полезные статьи.
  3. Вызвать доверие. Грамотно оформленная страница 404 — это возможность сохранить потенциального клиента на сайте. Извинитесь и помогите пользователю найти то, зачем он зашёл на сайт. Так посетитель с большей вероятностью останется на сайте и завершит оформление заявки или покупку.

Как создать страницу с уведомлением об ошибке 404

Во многих CMS стандартная страница 404 создаётся автоматически для любых страниц, кроме одностраничных сайтов-визиток. Или можно создать дизайн этой страницы самостоятельно. Для создания страницы нужно продумать веб-дизайн и призыв к совершению целевого действия. Это может быть ссылка на каталог товаров или строка поиска, чтобы найти нужную страницу.

Чтобы добавить страницу на сайт:

  1. Перенесите шаблон страницы ошибки 404 в корневую папку сайта.
  2. Откройте файл .htaccess и пропишите код: ErrorDocument 404 http://АДРЕС_САЙТА/404.html
  3. Впишите код в любую свободную строку, залейте на хостинг и проверьте: совершите ошибку в какой-нибудь ссылке, например, удалите букву. Вместо стандартного шаблона 404 должен отобразиться новый вариант. Если нет — проверьте правильность кода, возможно, была допущена ошибка.

Некоторые CMS автоматизируют процесс создания страницы об ошибке: например, в WordPress это можно сделать с помощью плагина 404page. Плагин может кастомизировать страницу на разных темах. Для его установки нужна версия WordPress от 4.0.

Как оптимизировать страницу 404 ошибки

Страница должна быть простой и понятной для пользователя. Пусть она будет креативной и гармонично продолжать концепцию всего сайта, но не усложняет путь к основному пространству, например, в каталог товаров или на главную страницу.

Советы по созданию страницы 404:

  1. Будьте доброжелательны. Расскажите посетителю, что страница удалена или произошла ошибка, помогите вернуться на основные страницы сайта.
  2. Предложите посетителю проверить точность адреса или дайте ссылки на разделы, которые были недавно перемещены.
  3. Дайте ссылки на продукт или статьи, релевантные поиску. Для этого нужно знать, на какую страницу пользователь пытался перейти. Это можно сделать, когда в URL указан раздел или категория.
  4. Сделайте страницу полезной: дайте возможность скачать книгу или перейти на статьи в блоге, которые рассказывают о ценности продукта.
  5. Не ограничивайтесь забавной картинкой. Добавьте ссылку на главную страницу сайта, блог, каталог или афишу событий компании.
  6. Предложите посетить страницу с акциями, спецпредложениями.
  7. Разместите строку поиска, чтобы посетитель сайта мог найти то, что он искал. Например, модель телефона в интернет-магазине или статью на новостном портале.
  8. Покажите посетителю квиз или мини-игру. Это отличный способ свести негативное впечатление пользователя к минимуму.
  9. Выдержите единое оформление, чтобы страница 404 не отличалась от остальных страниц сайта.

Рассказали, как квиз-маркетинг помогает пользователям совершить покупку.

Примеры отличных 404 страниц для сайта

Пусть подборка классных примеров вдохновит вас на создание собственного креативного шаблона страницы 404.

У McDonalds на странице 404 есть навигация по сайту и даже форма для подписки на рассылку:

Пример страницы 404 на сайте McDonalds

На странице 404 блога Roistat пользователю предлагается вернуться на главную страницу блога, перейти в нужный раздел или воспользоваться кнопкой обратного звонка:

Пример страницы 404 в блоге Roistat

На странице 404 для основного сайта Roistat отсутствие страницы нивелируется подарком для пользователя. Дополнительно посетитель может прочитать кейсы работы с сервисом:

Пример страницы 404 на сайте Roistat

На сайте Спортмастера использована забавная тематическая картинка, есть ссылки на главную страницу, каталог товаров и поисковая строка:

Пример страницы 404 на сайте Спортмастер

Ещё одна страница известного интернет-магазина Lamoda. Кроме навигации и строки поиска, пользователям предлагают популярные товары:

Пример страницы 404 на сайте Lamoda

Тинькофф предлагает простую страницу, на которой сообщается об ошибке и даются ссылки на основные услуги банка:

Пример страницы 404 на сайте банка Тинькофф

Страница об ошибке у ресторана KFC очень лаконичная страница. Пользователю предлагают всего 2 кнопки с простым CTA — «Заказать еду» и «Найти ресторан»:

Пример страницы 404 на сайте KFC

Как избегать ошибок на сайте

Неработающие ссылки и большое количество ошибок приводят к потере трафика и снижают позиции сайта в выдаче поисковых систем. Поэтому важно регулярно проверять сайт на ошибки и исправлять их.

Рассказали, как SEO-аудит помогает оптимизировать работу сайта.

Подключить Roistat бесплатно

Упростить проверку сайта поможет услуга SEO-аудита от Roistat. Аналитики проверят страницы сайта, найдут ошибки и создадут список рекомендаций по их исправлению. На весь оплаченный период оптимизации сайта за вами будет закреплён веб-аналитик, который сможет ответить на все вопросы по работе с сайтом.

Подключите сквозную аналитику Roistat

Получайте больше клиентов, не увеличивая рекламный бюджет

Подключить

На нашем Telegram-канале делимся полезными материалами по маркетингу и аналитике, кейсами клиентов, собираем познавательные дайджесты и анонсируем бесплатные обучающие вебинары. Подписывайтесь, чтобы ничего не пропустить!

80+ великолепных страниц ошибки 404

Иногда посетитель сайта видит ошибку 404 потому, что веб-страницы попросту не существует – она удалена или переименована (404 Not Found – страница не найдена). Нередко случается и неправильный ввод адреса. В любом случае, никого не обрадует безликое оформление 404-й или простое сообщение об ошибке. Креативными дизайнерами создаются более полезные для пользователя, эстетически красивые индивидуальные страницы 404.

Для оформления четырестачетвертой страницы есть немало интересных идей, вдохновляющих примеров, оригинальных иллюстраций, забавных видео coub’ов. Наконец, существуют шаблоны.

Подобраны топ-80 самых красивых, качественно отрисованных дизайнером, анимированных или забавляющих интерактивом 404-х страниц.


Интересно и оригинально оформленные 404 страницы

Тут примеры достойных 404 страниц, которые впечатляют не только креативно анимированной иллюстрацией с интересным описанием 404, но и блестящей реализацией нестандартной идеи.

01. Discord App

За работой квантовый хомяк-робот из мира Discord.


02. Beach Park

Плавник акулы, он и в луже 404-й страницы захватывает внимание.


03. Toggl

Красиво анимированная трехмерная графика страницы переносит в сказку с 404-сюжетом. По-мультяшному реалистично.


04. Designzillas

Дизайн-зиллы сделали страшилку из своей 404 страницы. Персонаж монстра служит символом существенных результатов креативной студии. Прокрутите – увидите как вылупляется дракон.


05. Bench

Такой страницы нет, как и снежного человека, единорога или лох-несского чудовища. …или она существует?


06. Pirate Code

Персонаж с главной страницы сайта задумчиво прогуливается по 404-й.


07. Weemss

Каждый раз, когда кто-либо посещает эту страницу, пони превращается в зомби. Чтобы спасти хотя бы 1-го пони предлагают войти или подписаться на софт.


08. Flipping Book

Может кому знакомо? В домашнем хаосе с малышом и котом, вырванные страницы становятся самолетиками.


09. Vebk

Красивая рестро страница 404 ошибки – в тонах и жанровой стилистике самого сайта.


10. De’Nastia

Предлагая уютные товары для дома, De’Nastia встречает ошибающихся адресом пользователей симпатичной 404-й страницей.


11. Slack

В странном месте бродят свинки с курицами, природа буйствует красками. Страница «Not Found» напоминает сказку.


12. Pikabu

В информационно-развлекательном жанре, страница 404-ошибки изображает представителя сообщества пикабу.


13. Rabota Gk-Rte

Обратный отсчет в ожидании столкновения ракеты с землей…


14. Lyft

Страница ошибки сайта американского такси-сервиса.


15. Kick Point

Внедорожник 4×4 на странице 404


16. Madwell

Креативное агентство развело анимированный костер на 404-й странице.


17. Clockwise

Перекати-поле подкатывается к надписи 404. Это растение пустынь и степей, а вы на странице ошибки.


18. Matteo Vandelli

Интерактивная анимация цифр 404 на странице с ошибкой.


19. Grainand Mortar

Трафаретное изображение тигра в белой цифре 404, соответствуя акцентному цвету (коричневый) создает приятный контраст с фоновой текстурой изогнутой сетки.


20. Rails Ware

Тематическая 404-я сайта разработчиков и дизайнеров.


21. Domenart Studio

Красиво оформленная 404-я страница российской студии дизайна.


22. Love Beets

Английская ферма выращивает овощи для салатов. Интереактивный редис под социальный шаринг на 404-й странице – это оригинально и уникально.


Страница 404 и красивая айдентика

Увязанные с оформлением ресурса и айдентикой компании страницы 404. Интересны тем, что знакомят с корпоративным стилем или творческой индивидуальностью.

23. Sketch

В дизайне этой 404 страницы идеально выдержан корпоративный стиль, сохранена навигация. 

24. Puree Maison

После предзагрузки основных страниц, перекатывающийся монстрик покажется старым знакомым.


25. Hungry Boys

Благодаря лого и анимации прелоадера, жест облизывания в перевернутом виде уже понятен.


26. Phive

После эксцентричного поведения при загрузке страниц, значок прелоадера на 404-ой выглядит изможденным: «Не могу согнуться, потеря 404 грамм жира…»


27. Mail Bakery

Бренд персонаж сообщает об ошибке 404. Однако на возможность сделать заказ указывает интерактивная анимация с призывом.


28. Moosend

После редизайна с новым логотипом, ярко выраженную айдентику сайт компании демонстрирует и на 404-й странице.


30. A propos du cancer

Жанровая стилистика сайта мед. учреждения – обращение к докторам хосписа. Иллюстрации, спокойная анимация и успокаивающие тона. На странице 404 ошибки потерявшийся пациент.


31. Studio Wolf

Доменный нейминг студио-волка подчеркивает контурное волчье лого, а еще мигающие пары глаз из темного леса.


32. Horton Works

В дополнение к логотипу и сам слон.


33. Pointless Corp

Бренд-персонажа на 404 странице поместили в  анимированную печать, заставив крутить педали. Столь «достойное применение» медведю объясняет само название агентства.


34. Nagyi Titka

Рекламный персонаж продукта крупным планом на 404-странице.


35. Panoraven

Похоже, персонажу сервиса выдали лупу для детективного изучения собственных следов.


36. Waaffle

На странице с ошибкой персонаж сайта начинает плавиться.


37. Avocode

Страница 404 весьма недвусмысленно подчеркивает креативный нейминг (avocode от авокадо).


38. Yelp

Пес-сыщик Дарвин идет по горячим следам в ходе рассмотрения дела о пропавшей странице. Пока детектив вынюхивает и разбирается, переходим по ссылкам – элементарно, дружище.  Cтраница yelp.com/404 имеет скрытый смысл (yelp – лаять).


Тематичные 404 страницы

Идея этих четырестачетвертых – иронично и коротко представить сайт, чтобы пользователь не унывал, когда попадает на страницу ошибки. Они лаконично выражают направленность деятельности компании.


39. E-co

Анимированное замыкание на 404 странице сайта дистрибьютора производителя источников питания.


40. Slodych

Аппетитная выпечка цифр 404.


41. Codemy Concept

Чашка кофе – символ разработчика.


42. Prob2b

У сервиса по созданию лендингов и повышению бизнес-эффективности лаконичная страница 404 с красивым плоским дизайном.


43. Handy Hat

Оригинальная страница 404 бренда вязанных шапок.


44. Limra Technosys

Индусы иронично и лаконично выразили свою деятельность: строят сайты, приложения, делают софт, SEO-оптимизируют и приводят в порядок маркетинг.


45. Max Style

У агентства по цифровому продвижению компаний эффектная страница 404.

46. Fuse Lab Ceative

Красивый агентский сайт. Страница ошибки эффектно оформлена объемными цифрами 404.


47. 1ps

Онлайн-агентство оказывает digital-услуги и продвигает сайты. Легкая, воздушная 404 страница с идеей – сбрасывать балласт и подниматься.


48. Woodst

Анимированная 404-я на сайте агентства, специализирующегося на графике.


Забавные и необычные 404-е

Самые креативные и занимательные страницы 404-й ошибки. Прикольные иллюстрации, видео-коубы, Gif и анимации могут развлечь и повеселить хоть целевого, хоть праздного посетителя сайта.


47. Tapfiliate

Очень энергичная, эксцентричная 404. Наверное, такая и должна быть ненайденная страница у CPA партнерки.


48. Пора валить

Анимированная 404-страница агентства «Пора валить»: свинья развлекается на тракторе.


49. Vintage

Забавно анимирована страница 404 украинской студии: чем-то обеспокоен трафаретный олень.


50. Insurance Experiments

Свой забавный промо проект UK-страховщики назвали экспериментальным, а мульти-страницу 404 сделали веселой.


51. Multi Work

На 404-й фирменный персонаж проекта, помогающего студенту / клиенту подобрать материал или репетитора. Уходя, сообщает, что страница переехала.


52. Fromage Abondance

Видео-коуб: французская корова-модница — соответствует тенденциям, также как и сайт.


53. Red Collar

Причудливая фантазия с анимацией на 404 странице цифрового агентства.


404 коты, собаки и разные создания

Смешные и позитивные коты и собачки, которые в какой-то мере выражают назначение сайта, поддерживают общую идею дизайна.


54. Html6

Сделано на шаблоне: интерактивный и сердитый кот.


55. Buzz Feed

Gif-ка слегка анимированного кота на 404-й… а как иначе для развлекательного медиа ресурса?


56. Life Daily

Интересующийся кот-404 с развлекательного веб-ресурса.


57. Kayako

Анимированный котенок рыжими пятнами удачно удачно поддержал акцентный цвет сайта.


58. Idesign

Непонятные создания перед непростым решением. Но надо возвращаться на главную.


59. Help Scout

Собачки рвутся с поводка… впрочем позитивных flat-иллюстраций немало на этом сайте.


60. Marketohttps://www.marketo.com/404

Разве кого-то может рассердить такая мордочка.


61. 99designs

Щенок — терминатор.


Красиво иллюстрированные Not Found страницы


62. Enjoy Kamchatka

Красиво оформленная под 404-ю ошибку фоновая фотография привлекает целевую аудиторию на сайт.


63. Skipio

Иллюстрация затерявшегося среди красот природы путешественника. К основной навигации добавлены ссылки. Предлагают осмотреться.


64. Epic

Красивая страница ошибки, выполнена как креативный вариант страницы «О нас».


65. Branded7

Красивая иллюстрация 404 в стиле шапки и футера сайта.


66. Дом со всем

Качественно отрисованная 404-я страница под тематику сайта компании.


67. Bright Scout

Назад в будущее – отличная идея для 404 страницы. Плоская иллюстрация с градиентами выполнена в стиле этого зеленого сайта и современных Web трендов. 


68. Deep Time

Потерянная во времени, винтажная 404-я страница проекта интерактивной инфографики об истории Земли.


Провальное / непреодолимое. Потерянные на 404-ой

На таких страницах ошибки есть непреодолимое препятствие, полный провал. Либо вы ясно понимаете, что потерялись на сайте.


69. FSRussia

Страница 404 сайта федерации фигурного катания: «провальное выступление».


70. Sibirix

Видео-коуб 404 новосибиркой дизайн студии с роботом-собакой.


71. Anton & Irene

Люди будущего медитируют перед тем как провалиться в черную дыру.


72. Straight North

Кирпичная стена за дверью. Ваш клик привел на несуществующую страницу. Может не все клики засчитываются? Попробуйте еще – тут зачтется (специализируются на  PPC рекламе, SEO).


73. Cloud Cart

Попал на распутье (смысл в том, что нужно выбрать подходящий сервис платформы).


74. Ucraft

Страница 404 посвящается потерявшимся в джунглях сервиса (для создания веб-сайта без навыков программирования).


75. Crello

Такое не часто встретишь. Потому сразу говорят: либо уходите, либо воспользуйтесь онлайн-сервисом Crello и создайте свой дизайн.


76. Kleo

На сайте про моду, красоту и бомонд, желательно, чтобы посетитель если уж заблудился, то красиво.


Игровые страницы 404

Не найденные четыреста четвертые страницы с простенькой, но очень занимательной игрой.

77. Heyzap

Лучшая интерактивная страница 404 – тут придется защищаться. Элемент игрового интерактива развлечет и займет на время. Игра может порадовать и человек не пожалеет, что попал по ошибке на 404-ю страницу.


77. Kualo

Веб-хостинг встречает всех попадающих на страницу ошибки увлекательной игрой. «Космические захватчики» – просто волшебные воспоминания прошлого. Используйте пробел.


78. Pointe Pest

Игра развлечет того, кто ничего не имеет против необходимости отстреливаться от нашествия ползущих жуков, клещей, стрекоз и др. насекомых. Используйте пробел.


79. Canva

Сбор пазла – совсем несложная игра.


80. Amphibian

Лягушачий футбол! Если не одна из страниц ошибки 404 не впечатлила, то эта хотя бы может занять…

27 примеров проработанной страницы 404 — Дизайн на vc.ru

{«id»:50308,»type»:»num»,»link»:»https:\/\/vc.ru\/design\/50308-iskusstvo-oshibatsya-27-primerov-prorabotannoy-stranicy-404″,»gtm»:»»,»prevCount»:null,»count»:31}

{«id»:50308,»type»:1,»typeStr»:»content»,»showTitle»:false,»initialState»:{«isActive»:false},»gtm»:»»}

{«id»:50308,»gtm»:null}

19 386 просмотров

Статья будет полезна предпринимателям, для которых сайт компании — не просто визитка, а продающий инструмент, требующий постоянного развития.

Если у вас не лендинг, а крупный сайт со множеством страниц и разделов, то рано или поздно ваши посетители столкнутся с битыми ссылками и ошибкой 404. К этому следует подготовиться.

Грамотно оформленная с точки зрения дизайна и содержания страница 404 способна удержать посетителей на сайте, снизить показатель отказов и повысить конверсию трафика в продажи.

После анализа сотни веб-сайтов разной направленности на предмет наличия проработанной, интересной и нестандартной страницы 404 были выявлены 27 достойных примеров, которые представлены ниже. Также в конце этого материала вы найдёте несколько рекомендаций по теме.

Сервис email-рассылок «MailChimp» Производитель монтажной пены «Profflex» Доска бесплатных объявлений «OLX» Графический редактор «Figma» Станция технического обслуживания «Ремонтов» { «osnovaUnitId»: null, «url»: «https://booster.osnova.io/a/relevant?site=vc&v=2», «place»: «between_entry_blocks», «site»: «vc», «settings»: {«modes»:{«externalLink»:{«buttonLabels»:[«\u0423\u0437\u043d\u0430\u0442\u044c»,»\u0427\u0438\u0442\u0430\u0442\u044c»,»\u041d\u0430\u0447\u0430\u0442\u044c»,»\u0417\u0430\u043a\u0430\u0437\u0430\u0442\u044c»,»\u041a\u0443\u043f\u0438\u0442\u044c»,»\u041f\u043e\u043b\u0443\u0447\u0438\u0442\u044c»,»\u0421\u043a\u0430\u0447\u0430\u0442\u044c»,»\u041f\u0435\u0440\u0435\u0439\u0442\u0438″]}},»deviceList»:{«desktop»:»\u0414\u0435\u0441\u043a\u0442\u043e\u043f»,»smartphone»:»\u0421\u043c\u0430\u0440\u0442\u0444\u043e\u043d\u044b»,»tablet»:»\u041f\u043b\u0430\u043d\u0448\u0435\u0442\u044b»}} } Интернет-магазин автозвука «ZvukDV» Сервис для дизайнеров «Marvel» Платформа для создания посадочных страниц «LPgenerator» Клининговая компания «Qlean» Официальный сайт «KFC» в России Сайт для поиска работы и сотрудников «Superjob» Издательство «МИФ» Интернет-магазин креативных подарков «Enjoyme» Доска объявлений по продаже автомобилей «Колёса» Девелоперская компания «Инград» Магазин строительных материалов «Петрович»

Идеальной формулы для страницы 404, конечно, не существует. Здесь всё индивидуально и зависит от конкретного бизнеса.

В целом страница 404 должна решать следующие задачи:

Общие рекомендации по теме

  1. При разработке или редизайне страницы 404 проявляйте творчество и креатив, отталкиваясь от сферы бизнеса. Здесь можно разместить ограниченные по времени купоны на скидку, форму подписки на выгодные акции, тематическую иллюстрацию, строку поиска по сайту, интерактивные элементы, генератор случайных советов и так далее.
  2. Обязательно проверьте, чтобы страница ошибки 404 на вашем сайте была правильно настроена, а сервер возвращал код статуса HTTP 404 Not Found. Иначе в результатах выдачи поисковых систем могут начать появляться ссылки на несуществующие страницы вашего сайта, что негативно повлияет на SEO.
  3. Регулярно проверяйте ссылки, размещённые на сайте, на предмет актуальности. Заменяйте или удаляйте битые ссылки при обнаружении.

На этом всё. Надеемся, что приведённые выше примеры вдохновят вас на создание своих собственных оригинальных решений, которые будут способствовать улучшению сайта и бизнеса в целом.

Как сделать 404 страницу: 10 красивых вариантов оформления

Зачем нужна такая страница?

404 ошибка представляет собой ответ сервера, который появляется при переходе на несуществующий адрес сайта. Произойти такое может по причине того, что страница была удалена, у нее сменился URL или пользователь допустил ошибку при вводе адреса. В любом случае, задача вебмастера сделать так, чтобы отвлечь посетителя от негатива и смотивировать его на дальнейший серфинг по сайту. Именно поэтому для сайтов делают креативные 404 страницы, цель которых – снизить количество отказов.


Красивое оформление 404 страницы на сайте

По умолчанию на многих ресурсах можно встретить простые и малопривлекательные 404 странички, попав на которые, создается ощущение о неработоспособности всего сайта. После этого, как правило, потенциальный клиент безвозвратно уходит.

Нет времени разбираться?

SEO-продвижение под ключ

Проанализируем конкурентов, подберем запросы с низкой конкуренцией, проведем поисковую оптимизацию сайта, организуем внешнюю ссылочную массу, проработаем карточки компании на онлайн картах, проведем базовую UX-аналитику сайта. Над каждым проектом работает от 6 до 10 специалистов. Собственные разработчики для доработки сайта при необходимости. От вас — сайт, от нас — позиции в Яндекс/Google и трафик.

Ваша витрина (сайт, соцсети и пр.)

Подробнее об услуге


Неудачный вариант 404 страницы — пользователь точно уйдет

Как создать 404 страницу?

Процесс создания правильной 404 страницы на сайте состоит из двух основных этапов — это разработка дизайна и техническая настройка.

Дизайн и структура

Создание такой страницы стоит начать с подготовки ее дизайна, который обязательно должен соответствовать общей стилистике сайта. Задача данного подхода – дать понять посетителю, что он находится именно на том ресурсе, который планировал посетить, просто в данный момент текущая страница недоступна.

Также при проектировке и создании оформления страницы 404 стоит учитывать специфику сайта:

  • Если это информационный сайт, то в таком случае, будет логичным сделать со страницы ошибки ссылки на другие материалы. Можно организовать показ ссылок, релевантных запросу пользователя.
  • Если это интернет-магазин, то рекомендуется подумать о навигационном меню и поисковой строке.
  • Для разработчиков игр – поместить на 404 простенькую флеш игру.
  • И т.д.

Практически в любой сфере можно придумать свои креативы и свести негатив пользователя к минимуму, а может даже повысить его уровень доверия.

Технические аспекты настройки

После подготовки макета дизайна, необходимо сверстать HTML-код. Он включает в себя стандартные блоки разметки и подчиняется HTML синтаксису, как и любая другая страница. Если планируется использовать анимацию, видео вставки или прочие фишки, то нужно учитывать вес всех компонентов, а также помнить о скорости загрузки страницы.

Если движок сайта самописный, то готовую страницу (HTML, PHP и т.д.) следует поместить в шаблон по протоколу FTP. И подключить ее в файле .htaccess, который находится в корне сайта, используя следующий код:

ErrorDocument 404 http://URL_сайта/404.html

Для редактирования .htaccess рекомендуется использовать бесплатный редактор Notepad++.

При использовании одной из популярных CMS, к примеру, WordPress, делать 404 страницу скорее всего не придется. По крайней мере технически она уже настроена и подключена, но если есть необходимость создания уникального решения, то его лучше реализовать внутри специального файла, который находится в корне шаблона (/wp-content/themes/тема/) – 404.php. При вставке верстки, нужно учитывать подключаемые хуки движка, некоторые из них могут понадобиться для корректной его работы. В остальном же все схоже с обычной HTML-версткой.

Не все темы WordPress имеют готовый файл 404.php, поэтому если он отсутствует, следует его создать вручную, наполнить и подключить в .htaccess с помощью следующего кода (если он также отсутствует):

ErrorDocument 404/index.php?error=404

10 красивых примеров страниц 404 ошибки

Приведем примеры идеально сделанных страниц 404 ошибки, они позволят взглянуть на креативность с другой стороны.

Вариант 1

Использование видеокреатива маркетинговым агентством, погружает пользователя в процесс наблюдения за персонажем, который в итоге покидает свое рабочее место. Сделано качественно, с вниманием к мелочам, такая страница однозначно мотивирует на продолжение знакомства с сайтом.

Привлекли 35.000.000 людей на 185 сайтов

Мы точно знаем, как увеличить онлайн–продажи

Применяем лучшие практики digital–продвижения как из вашей тематики, так и из смежных областей бизнеса. Именно это сделает вас на голову выше конкурентов и принесёт лиды и продажи.

Ваш сайт


Использование видеокреатива при создании страницы 404

Вариант 2

Отлично настроенная 404 страница популярного магазина бытовой техники и электроники. Хорошо продуманная навигация, а также выведены популярные категории товаров.


Страница 404 для интернет-магазина с категориями товаров

Вариант 3

Простая и стильная страница, текст которой прямо заявляет об ошибке, но тут же «переводит» фокус внимания на тематику сайта (кредиты, вклады).


Пример 404 страницы для банка

Вариант 4

Популярный ресторан быстрого питания, коротко и ясно.


Страница 404 ресторана быстрого питания

Вариант 5

Применение анимации задерживает внимание (лупа при перемещении мыши двигается).


Пример применения анимации на странице 404

Вариант 6

Тематический юмор сглаживает негатив. Кроме текста, на странице присутствует полноценное меню, контактная информация, калькулятор, а также чат со специалистом. Вероятность потерять лид, даже при возникшей 404 ошибке, минимальна.


Пример тематического дизайна на странице 404

Вариант 7

Провайдер, который даже при 404 ошибке, предлагает ознакомиться с тарифами. Если бы данная информация и призывы к действию (кнопка «Подключить») отсутствовали, то процент отказов был бы явно выше.


Пример страницы 404 на сайте интернет-провайдера

Вариант 8

Указание на отсутствие страницы и следом предложение об услуги (агрегатор, который поможет приобрести билет на самолет в любую точку планеты).


Вариант оформления 404 страницы для агрегатора авиабилетов

Вариант 9

Просто и понятно.


Страница 404 для сайта кофейни

Вариант 10

Использование забавных персонажей (которые гармонируют с дизайном сайта) позволяет повысить лояльность среди большого числа людей. В довесок используется торговое предложение, которое скорее всего заинтересует целевую аудиторию сайта


404 страница для турагентства

Вышеприведенные примеры страниц объединяют несколько качеств:

  • Они креативные и уникальные – непохожие на 90% 404 страниц других сайтов.
  • Помимо дизайна, несут в себе практическую пользу, удерживают внимание и сглаживают негатив у потенциального лида.
  • В некоторых случаях наоборот могут повысить лояльность к компании (сайту) со стороны пользователя.

Мы привели примеры наиболее креативных 404 страниц и объяснили причины их успешности с точки зрения удержания пользователя. Создайте 404 страницу, увидев которую, посетителям не захочется покидать ваш сайт.

ТОП-50 лучших примеров дизайна 404 страницы – Plerdy

Каждая страница в сети Интернет имеет свой собственный уникальный адрес с помощью которого на нее можно попасть. Если же страница удалена, перенесена или в адресе допущена ошибка, тогда пользователь будет перенаправлен на 404-ю страницу. 404-я ошибка означает, что сервер не смог найти никаких данных по запросу клиента, то есть у сайта нет страницы, соответствующей вашему запросу.

Очень важно правильно настроить или продумать 404-ю страницу, ведь она может стать последней, которую увидит пользователь на вашем сайте. Для этого можно использовать несколько тактик:

  • Для интернет-магазинов прекрасно подходит идея оформления 404-й страницы в своем фирменном стиле и презентации на ней различных товарных предложений. Таким образом пользователь сможет или легко вернуться на необходимую страницу, или перейти на товар которого он еще не видел.
  • Для любителей креатива тоже есть интересный вариант. Можно оформить страницу ошибки в интересном стиле: шутка, провокация, крутой дизайн, мини игры и тому подобное.
  • Для остальных случаев следует просто оформить эту страницу в корпоративном стиле и дать возможность пользователю продолжить свое путешествие по вашему ресурсу.

Что ж, на этом с теорией закончим, а сейчас давайте познакомимся с 50 крутыми идеями для оформления 404-й страницы.

Первым участником нашего ТОПа стала известная американская компания Blizzard Entertainment. Blizzard занимается разработкой игр. В частности, их творениями являются такие известные продукты как: World of Warcraft, StarCraft, Heroes of the Storm, Diablo, Overwatch. 404-я страница выглядит как разбитый экран, показывающий сломанный сайт.

Всемирно известный алкогольный бренд, тоже поработал над оформлением страницы 404. Пользователь имеет возможность увидеть пустую дорогу и надпись «Похоже, ты заблудился, друг». Страница выполнена в корпоративном стиле, а благодаря навигации можно легко вернуться к необходимой странице.

Прекрасный пример оформления 404-й страницы в шутливом стиле от редакции издания Tproger (проект о разработке и всего, что с ней связано). Кроме статуса ошибки, пользователь может посмотреть забавное видео, которое точно поднимет настроение после неудачного поиска.

Прекрасный пример использования корпоративного стиля для оформления 404-й страницы. Для этого Github взяли свой логотип (кота-восьминога) и стилизовали его под «Звездные войны».

Geekbrains — это известный российский портал, посвященный онлайн образованию. В случае если пользователь попадет на 404-ю страницу, его ждет одно из 3-х тематических видео в качестве оформления этой ошибки. Также есть возможность оставить сообщение об ошибке или вернуться на главную страницу.

Компания Adidas решила не отходить от своего корпоративного стиля при оформлении страницы ошибки. Мы видим прекрасный пример минимализма в веб-дизайне, а также текст, который мотивирует нас не сдаваться.

Пожалуй, одна из самых известных 404-х страниц, которая принесла большой трафик и популярность компании Emailcenter. Выполнена в шутливом стиле, она предлагает уволить кого-то из команды разработчиков в знак наказания. Или же пользователь может простить программистов и вернуться к пользованию сайтом.

Marvel, известное американское издательство комиксов, показывает замечательный пример оформления 404-й ошибки. Сама страница присутствует в нескольких вариантах, каждый из которых выполнен в стиле определенного комикса этого издания. Кроме красивого дизайна, Marvel продумали еще и удобную навигацию, которая поможет восстановить работу с сайтом.

Сервис онлайн редактирования изображений Crello имеет красивое оформление 404-й страницы в юмористическом стиле. Похищение страницы голубями — одно из самых оригинальных объяснение возникновения ошибки.

Компания Sketch решила оформить свою 404-ю страницу в корпоративном стиле. Хороший пример соблюдения фирменного стиля и простоты навигации.

Известный производитель энергетических напитков Red Bull вполне верен своему стилю. В случае ошибки,пользователь попадет на страницу с эффектным видео и надписью: «Хм, это сбивает с толку. Куда делась страница?! »

Итальянская дизайн студия Cayenne придумала интересный вариант страницы 404. Она создана в стиле диалога пользователя и модератора, где последний предлагает посетителю варианты решения его проблемы.

Сервис поиска авиабилетов Aviasales решил оформить страницу 404 в корпоративном стиле. Дополнительной «изюминкой» этого участника является то, что через некоторое время по странице начинают перемещаться маленькие изображения самолетов.

Один из самых известных производителей детских игрушек в мире — компания LEGO также решила соблюсти в оформлении 404 страницы своего фирменного, немного шутливого стиля.

Французская дизайн студия Studiofables решила подойти к вопросу дизайна 404 страницы с присущим ей колоритом. Пользователю предлагают успокоиться, посмотреть видео про трех поросят и, впоследствии, перейти на главную страницу ресурса.

Львовский IT-Cluster также решил проявить творческий подход. В случае ошибки, посетителя ждет оригинальная страница 404 и кнопка для возврата на главную.

Мультипликационная студия Pixar решила соблюсти своего стандартного стиля в дизайне 404-й страницы. В случае ошибки гостю сайта предложат не плакать, и объяснят, что это всего лишь 404-я ошибка.

Кинокомпания 20th Century Fox хорошенько поработала над своей 404-й страницей. Пользователю случайным образом показывают один из вариантов оформления, каждый из которых включает видео и уникальный текст.

Сеть кинотеатров «Планета Кино» решила, кроме соблюдения своего стиля, использовать известную фразу из “Аполлона-13″. Кроме этого есть удобная кнопка для возврата на главную.

Львовский бизнес-инкубатор Startup Depot, первый в нашем списке кто использовал для оформления 404 страницы мем с Винсентом Вегой (фильм «Криминальное чтиво). Этот момент из фильма пользуется широкой популярностью для объяснения отсутствия понимания каких-то вещей, поэтому его использование является удивительно удачным.

Компания MentorMate решила прибегнуть к простому и проверенному приему. Обыграть код ошибки «404» в виде какой-то красивой картинки. В данном случае это чашка кофе и цифры в цветовой стилистике сайта.

Specialized занимается продажей велосипедов и необходимого снаряжения, поэтому этот вид 404-й страницы подходит им лучше всего.

Как уже упоминалось, СтартапДепо, не единственные кто решил использовать мем с Винсентом Вегой. Тот самый момент на своей странице использовала интернет-платформа 9GAG. Учитывая количество юмористического контента в пределах сервиса, это решение можно считать идеальным.

Действительно оригинальное решение в оформлении 404-й страницы придумали в дизайнерской компании Orangecoat. Когда пользователь попадает на 404-ю страницу, он видит диаграмму, которая пошагово дает ответы на большинство задаваемых вопросов.

Если вы попадете на 404-ю страницу сайта креативного агентства Teehan + Lax вам отобразится один из нескольких вариантов 404-й ошибки. В каждом из них использован другой задний фон и надпись «Что-то пошло не так. Очень, очень, очень не так «.

Страница 404 на сайте Hakim.se от шведского дизайнера и разработчика с именем Hakim El Hattab точно придется по вкусу всем фанатам творчества Говарда Филиппа Лавкрафта. Сразу после перехода на пользователя начинают пялиться с десяток страшных глаз и ему предлагают вернуться на главную страницу сайта.

На портале CSS-tricks страница 404-й ошибки оформлена в минималистическом, тематическом стиле. Когда пользователь попадает на эту страницу, он видит белый фон, и разрыв по которым виден код web-страницы. Единственным недостатком этой идеи является отсутствие кнопки для возврата на главную страницу.

The New Yorker — это известное американское еженедельное издание, которое публикуется с 1925 года. 404-я страница оформлена в корпоративном стиле и имеет удобную навигацию.

Dribbble — это известное сообщество дизайнеров, которая тоже красиво оформила свою 404-ю страницу. В этом случае гостю сайта объясняется, что материалов, которые он ищет не существует, а на фоне изображено колоритную фотографию.

Компания Sumatosoft решила с фантазией и юмором подойти к оформлению 404-й ошибки. Летающая тарелка похищает коровку. Что может быть лучшей иллюстрацией на 404-й странице?

Команда сервиса для рассылок Skipio смогла создать красивый дизайн для своей 404-й страницы. На ней изображен заблудившийся путешественник, который не смог найти то, что искал. Однако он может оглянуться и найти другие «сокровища» этого сервиса, о чем нас и информирует текст.

Биотехнологическая компания CoolFarm нашла прекрасное решение для своей 404-й страницы. Когда посетитель попадает на страницу ошибки, он может сыграть в бессмертную классику — Space Invaders. Прекрасная идея для того чтобы удержать пользователя на сайте.

404-я страница на сайте платформы Squarespace реализована просто и со вкусом. Мы видим затемненное фото командного центра, текст и большую кнопку для возвращения на главную страницу сайта.

Прекрасный пример демонстрирующий, что не только крупным компаниям следует задумываться об оформлении 404-й страницы. Этот участник нашего ТОПа — сайт-портфолио разработчика Дастина Миллера (Dustin Miller). Страница оформлена в характерном для сайта стиле и имеет интересный вид.

Этот участник нашего ТОПа также решил порадовать своих пользователей оригинальной 404-й страницей. В случае ошибочного запроса посетитель сможет сыграть в игру Pac-Man в стилистике сайта.

Рекламная компания Agens также поработала над креативным оформлением страницы 404. Гостья сайта встретит надпись «похоже, что ты потерялся в космосе» и изображение астронавта на астероиде.

Хороший пример оформления 404-й страницы от Rachel Nabors. Rachel the Great — это серия авторских комиксов, поэтому такой дизайн идеально подходит.

Дизайн официального сайта Fork cms выполнен в морской тематике, поэтому компания решила не изменять своему стилю. На 404-й странице пользователя ждет Нептун, и надпись «Эта страница исчезла в море»

Маркетинговое агентство Incore таже решило подойти к оформлению своей 404-й страницы со стилем и юмором. На ней посетителя встретит изображение хищных птиц и вопросы «Привет, мой друг. Нас ищешь? Действительно? «И кнопка с текстом» Нет, спасибо. Вернемся назад к Incore «.

Один из самых оригинальных участников нашего ТОПа — сайт www.danielkarcher.com. Кроме того, что сам ресурс выполнен в весьма интересном стиле, да еще и 404-я страница с действительно интересной идеей. С ее помощью пользователь сможет провести короткое путешествие по метрополитену и понаблюдать за действиями девушки фотографа. Сама страница написана с помощью технологии Flash.

404-я страница инструмента для прототипирования Figma имеет интересную реализацию и идею. С помощью точек, изображенных на скриншоте выше, можно менять очертания надписи 404. Этот стиль хорошо отражает назначение сервиса.

А вот дизайн для своей 404-й страницы выбрала команда с RepairPal. Красивая картинка и удобный интерфейс для формы обратной связи — это хороший способ оформить страницу ошибки.

Еще один интересный пример оформления 404-й страницы на сайте портфолио веб разработчика. Когда пользователь попадает на страницу ошибки, он может сыграть в аналог знаменитой игры Lemmings. Хороший пример как можно продемонстрировать свой талант разработчика и порадовать посетителей.

Хороший пример тематического оформления 404-й ошибки от сайта Batman 3D. Не смогли найти нужную страницу? Видимо ее похитил Джокер.

Студия по разработке игр Talltale широко известна благодаря своим продуктам. Если попасть на ее 404-ю страницу, можно увидеть следующее изображение. Это оформление хорошо вписывается в мультипликационный стиль продуктов компании.

IMDb — это крупнейший в мире портал и база знаний посвященная кинематографу. 404-я страница этого сайта выполнена просто идеально. Минимализм в сочетании с точностью. Каждый раз, когда пользователь попадает на страницу ошибки, он видит видоизмененную цитату из культовых фильмов. Для примера на скриншоте выше цитата из «Властелина колец», которая утверждает: «Запомни навсегда, Фродо, страница всегда пытается вернуться к своему повелителю. Она хочет быть найденной».

Хорошим примером оформления 404-й страницы в корпоративном стиле может служить работа компании Netpeak. Увидев сообщение об ошибке, можно воспользоваться удобной навигацией для продолжения работы с сайтом.

Креативное агентство Elativeagency разработало свою 404-ю страницу в юмористическом стиле. Шуточное и милое изображение поможет посетителю не волноваться из-за не найденых материалов.

Если вы когда-нибудь попадете на 404-ю страницу сайта телекомпании FOX, вас ждет интересное предложение. На ней изображены детективы, которые предлагают вам найти пропавшую страницу.

Последним участником нашего топа стала компания The Software House. Простое и стильное оформление в традициях корпоративного дизайна — это хорошая практика для компаний разработчиков.

Вывод

В рамках статьи Вы ознакомились с 50 примерами хорошего оформления 404-й страницы. Часть из участников ТОПа строго придерживались своего корпоративного стиля и делали классические страницы об ошибке. Другие, в свою очередь, не боялись рисковать, шутить и экспериментировать с дизайном.
Надеемся, что эта статья была вам полезна и интересна. Если Вы все еще не создали собственной 404-й страницы, тогда рекомендуем побыстрее этим заняться. В зависимости от типа сайта, аудитории и собственных желаний, можно выбрать различные варианты оформления. А при необходимости, вы всегда можете взять пример с участников нашего ТОПа. Оставайтесь с нами, впереди еще много интересного!

Лучшие страницы 404 — примеры дизайна

Сижу в интернете, ищу товар. Ура, нашел нужный в результатах поиска! Перехожу по ссылке — появляется окно с цифрами «404» и кучей технических подробностей.

Абра-кадабра!

Ребята, мне не нужны ваши инструкции и составлять заявку я не хочу. Я хочу купить то, что присмотрел… Прощайте!

Not found страницы нужны и важны как часть маркетинговой стратегии любого сайта коммерческой направленности. Если клиент может уйти из-за загрузки страницы на 0,0001 секунду дольше, чем он готов ждать, дурацкая страница 404 тем более способствует этому. Наоборот — правильно оформленная поможет понять, что случилось, где он находится в данный момент и что теперь делать.

В статье мы рассматриваем 18 примеров страниц 404, которые принадлежат сайтам с разной тематикой. Мы ставили цель показать многообразие их оформления — и удачное, и не очень удачное. И очень неудачное.

Давайте посмотрим, что получилось!

Присоединяйтесь к нашему Telegram-каналу!

  • Теперь Вы можете читать последние новости из мира интернет-маркетинга в мессенджере Telegram на своём мобильном телефоне.
  • Для этого вам необходимо подписаться на наш канал.

Разберем лучшие страницы 404-ошибки

Адамас. Магазин ювелирных украшений

Страница 404 «Адамас»

Особенности
  • Пользователю по-прежнему доступны главное меню сайта и каталог изделий;
  • есть сообщение, что что-то пошло не так;
  • сайт предлагает перейти в раздел со статьями и коллекциями;
  • кроме главного меню, пользователю доступны все ссылки из футера.
Личное мнение

От продавца ювелирных украшений ждешь золотые россыпи и украшения даже на странице Not Found. Интересно, что со страницы 404 здесь отправляют в коллекции (это абсолютно логично) и в статьи (!). Всем, кто занимается интернет-маркетингом, на заметку.

DNS. Интернет-магазин цифровой и бытовой техники

Страница 404 DNS

Особенности
  • Графическая составляющая страницы прямо показывает, что мы на сайте DNS;
  • есть кнопка с CTA «Перейти на главную«: это лучше просто ссылки;
  • страница подгружает адреса магазинов вашего города.
Личное мнение

Вместо списка магазинов я бы разместил здесь каталог товаров: зачем же еще мы заходим в подобные интернет-магазины! Да и по карте путешествий пользователя большинство сначала выбирает товар, а уже потом ищет, где его купить.

Garry Print. Магазин одежды с принтами

Страница 404 Garry Print

Особенности
  • Первое, на что обращаешь внимание, — информация о 50 % скидках;
  • предлагаются три пути выхода с этой страницы: на главную, в каталог и на страницу создания своей крутой одежды;
  • пользователям по-прежнему доступно главное меню, футер и поисковая строка для уточнения их запросов.
Личное мнение

Я, конечно, не удержался и перешел по ссылке. Сижу теперь и вместо статьи создаю мужскую футболку с индивидуальным дизайном.

Еще чуть-чуть, и я снова с вами!

Kokoc.com. Продвижение сайтов

Страница 404 Kokoc.com

Особенности
  • Трудно не заметить вертикальную «404» на странице;
  • пользователю доступно главное меню;
  • он может перейти на главную страницу, изучить услуги компании и ее кейсы;
  • форма захвата готова помочь пользователю… стать клиентом компании. Неожиданно (нет)!
Личное мнение

Только не говорите, что не увидели здесь аллюзию на фильм «Изгой» с Томом Хэнксом в главной роли. Мы никогда не забудем тебя, Уилсон!

Не время унывать. Нам с тобой еще сайты продвигать!

Infiniti. Автомобильный салон

Страница 404 Infiniti

Особенности
  • Один из тех случаев, когда заветные «404» не указаны в тексте соответствующей страницы;
  • пользователю доступны главное меню и футер сайта;
  • кроме того, он может пользоваться быстрыми ссылками и найти дилера, посмотреть все модели Infiniti, написать представителям компании и почитать о бренде.
Личное мнение

Честно говоря, здесь хочется большего по размеру и смысловому наполнению изображения. Хотя едущая навстречу приключениям Infiniti Q50, конечно, внушает священный трепет.

Konsoleta. Интернет-магазин белья и купальников

Страница 404 Konsoleta

Особенности
  • Наконец-то кто-то открыто пишет, что появление 404 страницы — ВНЕЗАПНО, и делает это в такой милой форме;
  • пользователю доступны категории каталога, главное меню сайта и виджет обратной связи;
  • тут даже порекомендуют хорошие трусы.
Личное мнение

Несмотря на красивое графическое оформление страницы, все же стоит текстом написать, где оказался посетитель и что ему дальше делать. Быть может, он искал что-то особенное…

Zlatoust Watch. Интернет-магазин часов

Страница 404 Zlatoust Watch

Особенности
  • Пользователю доступны главное меню и футер сайта;
  • интересно, что оформление 404 страницы здесь абсолютно монохромное;
  • можно перейти по ссылке и почитать историю завода, раз уж вы попали сюда.
Личное мнение

«Нет такой страницы» — не самая корректная формулировка проблемы. Хорошо, что можно перейти в каталог часов.

Лабиринт. Интернет-магазин книг

Страница 404 «Лабиринт»

Особенности
  • Пользователю доступно главное меню сайта;
  • варианты для перехода с 404 страницы — это скидки и подарки, а также главные книги по мнению редакции;
  • маркетологи «Лабиринта» не зря едят свой хлеб. Даже 404 страница активно продает.
Личное мнение

Являюсь многолетним клиентом «Лабиринта» и не перестаю радоваться дружелюбию его сайта. А скидка в 40 % (см. под логотипом) всегда подпитывает любовь читателей к интернет-магазину.

Мебельный континент. Интернет-магазин мебели

Страница 404 «Мебельный континент»

Особенности
  • Пользователям остаются доступны главное меню и футер сайта;
  • на странице 404 есть графический элемент, указывающий на тематику сайта;
  • в сопроводительном тексте, увы, нет ни одной гиперссылки.
Личное мнение

Эту страницу можно в полной мере назвать элегантной. Вот только смущает предложение «Похоже, данный товар снят с публикации», потому что:

  • пользователь в этот момент мог искать не товар;
  • «снят с публикации» — странная формулировка. Товара вообще нет или он отсутствует только на сайте?

Читайте также:

Как увеличить конверсию сайта: 30 рабочих способов

MED-магазин. Товары для красоты, здоровья и спорта

Страница 404 «MED-магазин»

Особенности
  • Пользователям по-прежнему доступны главное меню и каталог товаров;
  • 404 страница продает, потому что обещает 5 % скидки на товары по промокоду 404;
  • в тексте также интересуются, что пользователь не смог найти на сайте — вот это забота о покупателе!
Личное мнение

Приятное графическое оформление в виде объявления с отрывными скидками. На этой странице не забыли о маркетинге и объяснениях пользователю, что случилось и почему он здесь.

Мир охоты. Сеть магазинов

Страница 404 «Мир охоты»

Особенности
  • Пользователю по-прежнему доступно главное меню сайта;
  • предлагаются варианты решения проблемы: переход на главную страницу или каталог товаров. При этом только на главную страницу поставлена гиперссылка;
  • главное меню дублируется пиктограммами. Так они воспринимаются намного лучше.
Личное мнение

Так и не понял, почему ноль в «404» оформлен как спасательный круг. Скажете, что есть рыбалка? Соглашусь, но ассоциация все равно слабовата. Я бы стилизовал «ноль» под прицел винтовки.

Много сна. Товары для ночного отдыха

Страница 404 «Много сна»

Особенности
  • Пользователю не доступны навигационные элементы сайта — главное меню и футер
  • ;
  • вариант решения — переход на главную страницу — оформлен в качестве кнопки
  • ;
  • есть товарные рекомендации.
Личное мнение

То, что есть указание скидок на товарах в рекомендациях и количество отзывов на каждый — бесспорно, хорошо. Но на каком основании они формируются? Правильно: на рандомном!

Музмарт. Интернет-магазин музыкальных инструментов

Страница 404 «Музмарт»

Особенности
  • Вид сломанной гитары — это почти та же боль, как и попадание на страницу 404. Шутка — эти боли не сравнятся;
  • пользователю доступны ссылки каталога и популярных категорий;
  • доступна информация из футера.
Личное мнение

Если запрошенная страница не найдена, предложите пути решения, а не просто ссылки. И, пожалуйста, не ломайте музыкальные инструменты. К слову, все неверно введенные адреса сайта преобразует в вид https://muzmart.com/404.

PETSHOPRU. Товары для животных

Страница 404 PETSHOPRU

Особенности
  • Пользователю по-прежнему доступно главное меню сайта;
  • причем доступно дважды — предлагают еще раз обратить внимание на ссылки по аксессуарам для животных;
  • в решении проблемы предлагается перейти в каталог.
Личное мнение

Котик играет с клубком на сайте товаров для животных (посмотрите по ссылке — это не просто картинка, а анимация). Если это не милота, то что милота?!

Читайте также:

Как правильно работать с негативными отзывами в интернете

Спортмастер. Интернет-магазин спортивных товаров

Страница 404 «Спортмастер»

Особенности
  • Пользователи по-прежнему видят главное меню сайта;
  • со страницы 404 можно посмотреть каталог товаров и воспользоваться поисковой строкой;
  • система предлагает перейти со страницы 404 на главную.
  • графическая составляющая соответствует тематике сайта по внешнему виду и странице 404 по эмоциональной составляющей;
  • графическое оформление категорий товаров фокусирует на себя внимание пользователей.
Личное мнение

Мне очень понравилась формулировка «возможно, ее никогда не было». Это прямо-таки готовый ответ на ввод адреса с несуществующим значением — посмотрите на ссылку, после того как перейдете по ней из раздела.

Wildberries. Маркетплейс разнообразных товаров

Страница 404 Wildberries

Особенности
  • Маркетплейс оставляет пользователю главное меню с информацией о доставках его товаров и том, что лежит в корзине;
  • также доступна поисковая строка;
  • переход на главную оформлен кнопкой фирменного цвета WB;
  • пользователям, попавшим на страницу 404, показываются хиты продаж: тут и фитнес-браслет, и трусики-подгузники, и пошлифовать можно. В маске, естественно.
Личное мнение

Формулировка «По вашему запросу ничего не найдено» здесь смотрится как нечто чужеродное. Такое сообщение вполне годится после того, как ввел название определенного товара в поисковую строку сайта и там ничего не нашлось. Мы же получаем такой текст на странице при вводе URL сайт в адресную строку браузера.

Все инструменты.ру. Инструменты для строительства и ремонта

Страница 404 «Все инструменты.ру»

Особенности
  • Пользователю по-прежнему доступно главное меню и каталог товаров;
  • в тексте страницы предлагается воспользоваться каталогом;
  • переход на главную страницу оформлен как заметная кнопка;
  • пользователь может также ознакомиться с популярными категориями товаров.

Личное мнение

Вы тоже заметили кнопки «Сказать спасибо» и «Пожаловаться» с правой стороны. Мне почему-то хочется сказать спасибо за такое оформление 404-й. Увидев то, что будет дальше, вы поймете, почему.

Copyblogger. Зарубежный блог по контент-маркетингу

Страница 404 Copyblogger

Особенности
  • Пользователю по-прежнему доступно главное меню и футер сайта (они не влезли в скриншот, потому что мы хотели показать вам главное)
  • страница оформлена как стандартная статья блога;
  • такого количество текста именно для 404 страницы еще нужно поискать;
  • можно подписаться на рассылку по контент-маркетингу и тренинг по маркетингу (полная версия 404 страницы по ссылке вверху).
Личное мнение

Как пишущий человек я оценил эту страницу 404, потому что ее текст — по сути реклама сайта Copyblogger. Цитирую начало:

Что-то пошло не так, потому что это страница с ошибкой. Эй, легко заблудиться! Copyblogger опубликовал более 3000 статей по коммерческому писательству, контенту и маркетингу на своем веб-сайте.

Как не надо делать страницы 404

Какая статья без антипримеров, благо в нашем случае их хватает.%&&$$&**#&&$$$ on this server

Но есть 404 страница еще страшнее…

В теории решения изобретательских задач идеальной считается сущность, которой нет, но ее функция выполняется. Так вот: в разработке сайтов нет хуже страницы 404, которой нет.

Зайдите на сайт маститого маркетолога Сета Година и попробуйте ввести такой адрес страницы, который вызвал бы 404 страницу. Вы будете все время попадать на главную.

Ну нет у меня на сайте такой страницы. И что теперь?

В общем-то ничего, маэстро. Вам мы можем просить многое за «Фиолетовую корову» и ваши многочисленные материалы по маркетингу. Всем остальным лучше вкладываться в разработку сайтов по полной программе.

примеры оригинальных страниц Not found

Когда мы вводим на сайте неверный адрес или щелкаем по «мертвой» ссылке, он должен выдать стандартный код ответа HTTP – Not Found или «Ошибка 404». Отсюда хочется побыстрее уйти – и хорошо, если на главную сайта, а не обратно в поиск.

Хорошо оформленная с точки зрения дизайна и юзабилити страница 404 поможет пользователю понять, что делать дальше. Посмотрите, как эту задачу решили самые креативные компании.

eBay

«Человечная» надпись и такая же картина делают так, что не хочется убегать обратно в поиск

Разрабатываем и продвигаем сайты

Быстро и эффективно

Подробнее

Aviasales

Aviasales, по традиции, чуть поиграли словами – страницы нет, билеты есть

Blizzard

404-я у Blizzard анимированная: посмотрите, как симпатично выглядит

Coca-Cola

Coca-Cola тоже сыграла словами: «Здесь больше нет Coca-Cola» уместно смотрится рядом с пустыми бутылочками

Convert Monster

Content Monster меняет призыв и картинку каждый раз при обновлении страницы

Amazon

А у Amazon кликабельная собака – она отправляет нас на страницу «Собаки Amazon»

«Тупичок Гоблина»

Дизайн на сайте Дмитрия Юрьевича не обновляется годами (и смотрится по-своему стильно). Графическое оформление 404-й в стиле игр конца 90-х смотрится тут органично

«Лабиринт»

Еще одна ожидаемая игра слов: страница «Лабиринта» потерялась в лабиринте

OZON

OZON вернулся к минимализму

Что интересно – старая страница была немного креативнее (и как будто заимствовала идею eBay):

А это старая 404 страница на сайте OZON

Сотмаркет

Тот же тренд на минимализм – у «Сотмаркета»: только навигация, только хардкор

А вот как выглядела эта страница раньше:

Интереснее по задумке, но уже не так трендово (да, 404 тоже стоит обновлять в духе времени)

Студия Артемия Лебедева

Кстати, тайтл у страницы иронично спрашивает: «Потерялись?»

Банк «Тинькофф»

«Тинькофф» перешел от минимализма к ультраминимализму – смотрите следующее фото: это старая страница 404

Когда страницу освежали в плане дизайна, отсюда в числе прочих изменений ушел смайлик

«Яндекс»

Коротко и понятно – и тоже с навигацией

Университет «Синергия»

У «Синергии» как будто отсылка к фильму «Гравитация»

Студия Дениса Каплунова

Стильно и минималистично

LEGO

Выражение лица человечка демонстрирует панику. А вот надпись говорит, что все прекрасно

«Кинопоиск»

На «Кинопоиске» тоже есть элемент анимации

PlayboyRussia

404 страница PlayboyRussia

«Единый визовый центр»

Нетривиальный ход – для дочитавших подарок

Pikabu

Заморочились и отрисовали – узнаваемо и на века

Pixar

Более удачный образ, чем Печаль из мультика «Головоломка» для страницы 404 трудно представить

Какой не должна быть страница 404

  1. Мгновенный переход на главную страницу: в этом случае человек не поймет, что он ввел неверный адрес или перешел по неработающей ссылке, и может повторить неверный ввод.
  2. Внешний вид страницы
  • с нечитаемыми символами:
  • со стандартной и малоинформативной надписью:
  • дзен-вариант страницы 404 (такой, например, у Школы-студии МХАТ):

Если вы решили сделать сайт, пусть у него будет первоклассной и страница с кодом ответа 404. Пользователи и поисковые системы будут вам благодарны.

Почему ваша страница 404 важна для SEO

  1. WooRank
  2. SEO-руководства
  3. Почему страницы 404 важны для SEO

Страшная страница 404. Проклятие веб-мастеров во всем мире.

Или они?

В этой статье мы расскажем все, что вам нужно знать о страницах ошибок 404 и о том, как они влияют на ваши усилия по SEO:

Что такое страница 404?

Страница 404 или страница ошибки — это содержимое, которое пользователь видит, когда пытается перейти на несуществующую страницу нашего веб-сайта. Это страница, которую ваш сервер отображает, когда не может найти URL-адрес, запрошенный пользователем.

Чтобы узнать больше об ошибках 404 и о том, как они влияют на SEO, ознакомьтесь с нашим руководством по ошибкам сканирования.

Несмотря на то, что существует много размышлений и дискуссий о том, как обрабатывать ошибки 404 и их влияние на SEO, факт остается фактом: ошибки 404 практически неизбежны. Хотя заманчиво просто перенаправить все ошибки 404 на домашнюю страницу, на самом деле это противоположно тому, что вы должны делать.

Перенаправление на домашнюю страницу приводит к плохому взаимодействию с пользователем по нескольким причинам:

  • Пользователи будут сбиты с толку тем, как они попали на домашнюю страницу, когда щелкнули ссылку на другую страницу.

  • Пользователи не будут иметь доступа к информации, которую им обещали, и не будут знать, почему.

  • Ваши пользователи попадают на страницу, которая может быть совершенно нерелевантной ссылке, по которой они щелкнули.

Использование переадресации 301 или 302 на вашу домашнюю страницу также является очень плохой практикой SEO. Некоторые владельцы веб-сайтов и SEO-специалисты делают это, пытаясь сохранить любой ссылочный вес, полученный удаленным/несуществующим контентом.

Отправка Google на вашу домашнюю страницу вместо страницы, которая возвращает статус 404, может привести к тому, что Google сочтет вашу домашнюю страницу программной ошибкой 404.Вот объяснение от аналитика Google Webmaster Trends Джона Мюллера:

.

Вот еще одно объяснение от Мюллера два года спустя:

Таким образом, перенаправление ошибок 404 на вашу домашнюю страницу приведет к выполнению , полной противоположности того, что было задумано.

Несмотря на это, исследование WooRank показало, что 11,4% перенаправленных обратных ссылок ведут на главную страницу сайта.

Вы можете перенаправить некоторые ошибки 404 на релевантные страницы, если у вас есть способ определить, какие страницы релевантны, например, похожая страница продукта/категории или контент с той же информацией.

Но это еще вопрос , когда вам понадобится хорошая 404 страница.

Использование страницы 404 навсегда

Ошибки 404 могут разочаровывать пользователей, поэтому основная цель страницы 404 — превратить потенциальный негативный пользовательский опыт от ошибки в положительный.

Ключом к этому являются ссылки.

Ссылки на страницах 404 очень важны, потому что они дают пользователям выход со страницы ошибки. Вместо того, чтобы закрывать окно или уходить с вашего сайта, пользователь может найти полезные и потенциально релевантные ресурсы на другой странице.

Некоторые ссылки для добавления на ваши страницы 404 должны включать:

  • Ваша домашняя страница, очевидно
  • Некоторые из ваших самых популярных страниц блога
  • Самые популярные или ценные страницы товаров или категорий
  • Способ для пользователей сообщить о неработающей ссылке или контактной странице/форме
  • HTML-карта сайта

Вы также можете помочь своим пользователям, добавив панель поиска по сайту на свою страницу 404, чтобы они могли найти то, что ищут, прямо с этой страницы.

И как дополнительный бонус?

Те, кто ищет сайт, чаще конвертируются, чем другие пользователи. В некоторых случаях до 50%!

Добавление ссылок и функции поиска может помочь увеличить конверсию сайта до 50% в некоторых случаях.

Что будет делать ваша пользовательская страница 404

Ошибки

404 и страница 404 вашего сервера по умолчанию, как правило, уродливы, не имеют торговой марки и не предоставляют никакой информации, кроме общего сообщения «произошла ошибка». Таким образом, они могут снизить общую маркетинговую эффективность вашего сайта.

Создание пользовательской страницы 404 с полезными ссылками и, возможно, панелью поиска

  • Уменьшите показатель отказов и удерживайте пользователей на своем сайте

  • Поддерживайте интерес людей к вашему сайту и продвигайте процесс продаж

  • Оставьте их с хорошим настроением после положительного решения их проблемы 404

  • Поддерживайте единый брендинг на вашем сайте

  • Привлекайте к своему бренду внимание со стороны, если вы достаточно хорошо выполняете свою работу

Еще немного о последнем пункте:

Людям нравится обсуждать и делиться умными страницами 404, с которыми они сталкиваются в Интернете.Таким образом, действительно хорошая страница может дать вам отличные обратные ссылки, как в этом сообщении в блоге HubSpot.

Пользовательские страницы 404 с креативным брендом помогут пользователям, а также привлекут положительное внимание к вашему бизнесу.

Что НЕ будет делать ваша страница 404

Пользовательские страницы 404 действительно помогут вашим пользователям-людям, которые в конечном итоге посещают несуществующую страницу. Они также могут помочь Google перейти на другие страницы вашего сайта по вашим ссылкам. Однако есть одна вещь, которую ваша страница 404 НЕ сделает:

.

Сок передачи ссылок.

Да, обычно ваши целевые страницы могут передавать полученный ссылочный вес на вашу домашнюю страницу или другие внутренние страницы посредством ссылок. Но это потому, что Google индексирует ваши целевые страницы.

Однако Google не индексирует страницы, которые возвращают статус 404 (что должно делать вашу страницу 404). Это означает, что они не присваивают никакого значения, передаваемого ссылками, которые указывают на страницы со статусами 404.

Но не паникуйте!

Если у вас есть страница с большим количеством высококачественных ссылок, которая приводит к ошибке 404, вы все равно можете перенаправить этот отдельный URL-адрес на соответствующую страницу.

Google не индексирует URL-адреса со статусом 404, поэтому ваша страница с ошибкой не передает ссылочный вес.

Когда не следует использовать страницу 404

Бывают случаи, когда вы не хотите показывать страницу 404 пользователю, который запрашивает страницу, которой нет (или больше нет).

Какие страницы вы хотите перенаправить?

страниц, которые…

  • Имеют очень важные внешние ссылки или много ссылок

  • Получите большой трафик или значительную долю общего трафика вашего веб-сайта

  • Наличие очевидного URL-адреса, который пытается получить пользователь/компоновщик

Замените страницы, которые получают много ссылок, посетителей или конверсий, чтобы сохранить ценность SEO вместо того, чтобы полагаться на перенаправления.

В таких ситуациях имеет смысл добавить переадресацию 301, чтобы направлять пользователей и ссылочный вес на более релевантную и полезную страницу.

Помните, однако, что целевые страницы, которые вы используете для перенаправления, должны быть законным замещающим контентом. Если у вас есть ошибки 404 для этих типов URL-адресов, в идеале у вас все равно будет замена контента для этих страниц, поскольку они, вероятно, являются наиболее важными страницами вашего сайта.

Создание страницы 404

То, как вы создаете страницу 404, полностью зависит от того, как вы управляете своим сайтом.

Для тех, кто использует WordPress, 404page — это очень рекомендуемый плагин, который позволяет настроить страницу 404. Для этого даже не требуется каких-либо навыков разработки.

Вы также можете проверить эти другие плагины 404 страниц, доступные для WordPress.

Для тех, кто не использует WordPress в качестве CMS, действительно стоит заплатить разработчику и/или дизайнеру, который создаст и внедрит ее для вас.

При разработке и написании страницы 404 следуйте рекомендациям и советам самых популярных страниц 404 в Интернете.

примеров Genius из 404 страниц

Дизайн страниц 404 может не быть вашим главным приоритетом при создании нового веб-сайта, и, если повезет, ваши пользователи не будут часто сталкиваться с ними при просмотре. Но звездная страница 404 может быть эффективным инструментом для передачи индивидуальности вашего бренда, развлечения посетителей и удержания их на вашем сайте, а не для раздражения. Конечно, на самом деле вы не хотите, чтобы посетители вообще оказывались там, но добавление индивидуальности и умного дизайна может добавить серебряную подкладку к ошибке.

Эти удивительные страницы 404 используют инновационный UX, юмор, потрясающий дизайн или даже игры, чтобы свести на нет любое раздражение пользователя и сделать их запоминающимися и общедоступными. Вы можете добавить анимацию CSS или крутую параллаксную прокрутку, но иногда все, что вам нужно, это какой-нибудь развлекательный текст. Мы выбрали наши любимые примеры ниже, чтобы вдохновить вас, чтобы помочь вам мыслить нестандартно со своими собственными проектами.

Лучшие 404 страницы

01. Netflix

(Изображение предоставлено Netflix)

У Netflix есть целый ряд контента на выбор для страницы 404 (открывается в новой вкладке), и он соответствующим образом включил полную страницу кадр из фильма Затерянные в космосе.Сайт спрашивает: «Заблудился?» и предоставляет четкую кнопку, чтобы вернуть вас на домашнюю страницу. Единственное улучшение, которое мы могли бы себе представить, — это предоставить ряд фильмов, как это делает IMDB (см. далее в списке), чтобы вы никогда не знали, какой из них вы собираетесь получить.

02. M&Ms

(Изображение предоставлено: m&ms)

Кондитерская компания использует своих персонажей для своей страницы 404 (открывается в новой вкладке). Когда вы натыкаетесь на страницу 404, вас встречает встревоженный m&m, который вместе с вами сталкивается с проблемой.Это простое изображение усиливает фирменный стиль m&m и вызывает улыбку, прежде чем вы отправитесь обратно в безопасное место.

03. KonMari

(Изображение предоставлено KonMari)

Хорошая страница 404 должна отражать индивидуальность бренда. Мари Кондо стала чрезвычайно популярной благодаря своим советам и продуктам по уборке и организации, а копия на странице 404 ее сайта (открывается в новой вкладке) с юмором поддерживает ту же философию уборки беспорядка. Это небольшая лаконичная деталь, которую фанаты сразу узнают.

04. Marvel

(Изображение предоставлено Marvel)

У Marvel есть несколько версий своих 404 страниц, которые (конечно) посвящены MCU. Мы заметили упоминания о Гидре (одна из них выше) и оке Утау, и это лишь некоторые из них. Посетите страницу Marvel 404 (откроется в новой вкладке), чтобы узнать, какой из них вы получите.

05. LEGO

(Изображение предоставлено LEGO)

Страница Lego 404 (открывается в новой вкладке) довольно проста, но излучает индивидуальность. Испуганное выражение лица человечка Lego, а также слоган бренда («все по-прежнему круто») создают впечатление страницы с ошибкой, на которую вы не жалеете, что наткнулись.

06. Omlet

(Изображение предоставлено: Omlet)

Игра слов уведет вас далеко, поэтому мы ценим подход Omlet (opens in new tab) к странице 404. На странице креативной компании написано: «Эта страница — это яйца», когда на экране появляется анимированная трещина в яйце. Ярко-красный цвет показывает, что это «предупреждение», а тема яйца соответствует имени Омлета. Что не нравится?

07. Mantra Labs

(Изображение предоставлено Mantra Labs)

Эта страница 404 от Mantra Labs (открывается в новой вкладке) проста, но эффективна.Иллюстрация космического человека, плавающего в «404», сопровождается текстом «Ой! У тебя кончился кислород». Также есть таймер обратного отсчета до того, как вы вернетесь на домашнюю страницу. Если вы моргнули, вы могли бы даже пропустить эту страницу 404, хотя стоит специально ошибиться, чтобы посетить ее.

08. Готов к выживанию

(Изображение предоставлено: Готов к выживанию)

Мы все любим хорошие отсылки к фильмам на странице 404 (и несколько из них включены в наш список).Этот сайт выживания ссылается на Матрицу на своей странице 404 (открывается в новой вкладке) и предлагает вам два варианта: щелкнуть красную или синюю таблетку. Естественно, оба удерживают вас на сайте.

09. Carwow

(Изображение предоставлено carwow)

Этот сайт сравнения покупок автомобилей поможет вам найти идеальный автомобиль, но когда вы отклоняетесь от курса, его страница 404 предлагает умный способ удержать вас на сайте. Посетителям предлагается 8-битный игровой экран. Все, что вам нужно сделать, это нажать на кнопку «Пуск», чтобы насладиться простой игрой с горизонтальной прокруткой, где все, что вам нужно сделать, это избегать препятствий и других автомобилей.Попробуйте страницу 404 Carwow (откроется в новой вкладке).

10. Ueno

Ueno — это агентство полного цикла с выдающейся страницей 404. То, что вы видите выше, не отражает всех усилий, затраченных на это: хот-дог анимирован, поэтому он движется по бесконечному циклу через сюрреалистический пейзаж, и есть несколько веселых поясняющих сообщений для изучения. Это безумие и совершенно уникально — посетите страницу ошибки Ueno здесь. (открывается в новой вкладке)

11. Gymbox

Gym Box — это компания, занимающаяся тренажерным залом, которая стремится предлагать «самые уникальные и разнообразные занятия в Лондоне».Ограничениями этого утверждения может быть великолепное зрелище фитнеса 80-х, которое появляется на его странице 404 (открывается в новой вкладке). Короткие шорты, укороченные топы и выпячивание таза — чего еще желать от страницы с ошибкой?

12. Slack

Будет лишь небольшим преувеличением сказать, что обновление логотипа Slack в 2019 году было встречено всеобщим ужасом, а его супер-сахаристая страница 404 наверняка найдет немало ненавистников. Если вы ошибетесь в Slack, вы попадете в волшебный пейзаж с пышной листвой, горами и радугами, где свободно бродят бабочки, цыплята и крошечные поросята.Сцена также прокручивается по горизонтали движением мыши (попробуйте страницу 404 Slack здесь (откроется в новой вкладке)).

13. Purée Maison

Purée Maison — креативное агентство, специализирующееся на коммуникационной стратегии, и его характерный веб-сайт полон восхитительных анимаций (рекомендуем осмотреться (откроется в новой вкладке)). Мы особенно любим эту сюрреалистическую страницу 404, которая каким-то образом идеально передает боль от столкновения с цифровой стеной.

14. Pixar

Некоторые люди могут принимать вещи слишком близко к сердцу.Страница Pixar 404 (открывается в новой вкладке), на которой изображена Грусть из чрезвычайно популярного фильма «Головоломка» 2015 года, проста, понятна и выполняет свою работу. Однако, если это отражает вашу реакцию на получение ошибки 404, возможно, вам нужно немного пересмотреть свою жизнь.

15. Студия 20th Century Studios

Не можете найти нужный фильм? Студия 20th Century Studios (ранее 20th Century Fox) после ребрендинга предлагает отличный способ вдохновить вас, когда вы ошибаетесь в URL-адресе; на странице 404 появляется кадр из культового фильма с содержательным заголовком и подборкой других фильмов, которые вы, возможно, захотите посмотреть.Мы заметили отрывки из фильмов «Эдвард руки-ножницы», «Месть ботаников» и «Наполеон Динамит» и других (посмотрите на страницу 404 (откроется в новой вкладке), чтобы узнать, какой из них вы получите).

16. Cloud Sigma

Cloud Sigma — это облачный сервер и служба облачного хостинга, работающая в США, Европе и Азиатско-Тихоокеанском регионе. Хотя гибкие облачные серверы полезны, они не совсем забавны, и мы предполагаем, что компания приложила дополнительные усилия, чтобы добавить немного юмора на свою насмешливую страницу с ошибкой 404 (откроется в новой вкладке).Мы задаемся вопросом, сколько времени пройдет, прежде чем этот услужливый младший разработчик будет переманен конкурентами.

17. BluePath

Еще один веб-сайт, использующий юмор на своей странице с ошибкой 404, — это базирующаяся в Атланте консалтинговая фирма по стратегии данных BluePath. На странице 404 (открывается в новой вкладке) показана карта Атланты с точкой на другой стороне страницы, указывающей на то, что посетитель «уходит далеко от карты». В чрезвычайно слабой связи карта также включает основанную на данных информацию, показывающую зарегистрированные преступления в этом районе.«Почему? Потому что это преступление, для которого вы нас еще не наняли!» Ох уж эти чокнутые аналитики данных.

18. Kualo

(opens in new tab)

Веб-хостинговая компания Kualo работает уже более 15 лет — вечность по времени в Интернете — и ее страница 404 возвращает нас в прошлое, предлагая посетителям игру Kualo тематические космические захватчики. Это не идеально. Ключевая стратегия, состоящая в том, чтобы отстреливать внешние края флота, чтобы замедлить спуск захватчиков, поначалу не работает. Но это весело, и вы можете получить скидку на хостинг, если вам удастся набрать более 1000 баллов.Сыграйте в игру Куало здесь (откроется в новой вкладке).

Его включение в эту статью также вдохновило американскую компанию по борьбе с вредителями Pointe Pest Control включить свою собственную игру Pest Invaders на страницу с ошибкой 404 (открывается в новой вкладке), в которой есть различные летающие и ползающие жуки для распыления.

Как говорит Хлоя Золлингер из Pointe: «Попадание на страницу с ошибкой 404 чаще всего разочаровывает пользователя сайта. Мы понимаем, насколько важен пользовательский опыт на веб-странице. Чтобы улучшить впечатление наших посетителей, наша команда посвятила себя созданию интерактивного игра на нашей странице 404.

19. Стив Ламберт

(opens in new tab)

Нью-йоркский художник Стив Ламберт описывает это как «самую неудобную страницу 404, не найденную в Интернете», и вы знаете, он вполне может быть прав. В нем есть мучительная часть для камеры (открывается в новой вкладке), которая просто продолжается и продолжается. Мы бросаем вызов вам, чтобы дойти до конца его видео, не сжав ни одной части тела.

Следующая страница: Более вдохновляющие 404 страницы до исследовать

37 примеров, которые вам нужно увидеть

Эпическая страница 404, скорее всего, не принесет вашему бизнесу никаких наград.Я понимаю.

Но это показывает, что вы заботитесь о своих клиентах.

Отличная страница 404 может быть отличным способом продемонстрировать индивидуальность вашего бренда.

Но стоит ли вкладывать деньги в модную страницу 404?

Может быть.

Потому что, когда пользователи попадают на вашу страницу 404, они не находят того, что им нужно.

Использование ссылок, умной графики и остроумного текста может заставить их забыть, что вы (возможно) напортачили, и вернуть их в нужное русло.

В свете важности страниц 404 ниже приводится список из 37 лучших примеров страниц 404, которые вы можете найти в Интернете.

Прежде чем углубляться в примеры, давайте рассмотрим основы страницы 404.

Что такое страница 404?

Страница 404 — это целевая страница, которая сообщает посетителям вашего сайта, что запрошенная страница недоступна или, в некоторых случаях, не существует.

Ошибка 404 сообщает пользователям, что страница недоступна, и это может быть серьезной проблемой.

Когда пользователи не могут получить доступ к странице, они не могут найти нужную им информацию.

Это также сообщает Google, что ваш сайт предлагает плохой опыт работы с клиентами, что может привести к снижению трафика и снижению рейтинга.

В идеале посетители сайта никогда не попадут на страницу 404, но реальность такова, что время от времени они случаются — даже с хорошо обслуживаемых сайтов.

Почему посетитель может попасть на страницу 404?

Почему пользователь может получить ошибку 404?

Причин несколько, в том числе:

  • Сервер не работает.
  • Страница перемещена без перенаправления.
  • Страница никогда не существовала.
  • Пользователь неправильно ввел URL.
  • URL-адрес не работает.

По сути, если пользователь пытается посетить страницу, которую не может найти, он будет отправлен на вашу страницу 404.

Какой смысл делать страницу 404 выделяющейся?

Визуально привлекательная и удобная страница ошибки 404 показывает клиентам, что вы заботитесь об их опыте и заинтересованы в том, чтобы они остались на вашем веб-сайте.

Когда все сделано правильно, хорошая страница 404 помогает пользователям простить вас за ошибку (даже если это была их собственная ошибка из-за неправильного ввода URL-адреса) и удерживает их на вашем сайте.

Отличная страница 404 может заставить пользователей улыбнуться и, самое главное, помочь им найти то, что они ищут.

Мы просмотрели десятки страниц с ошибкой 404, чтобы найти лучшие из них, демонстрирующие креативность и индивидуальность брендов.

Вот 37 лучших примеров хорошо выполненных 404 страниц.

1. Дисней

Дисней выбивает его из парка своей страницей 404, выделив одного из самых популярных персонажей, известных своей разрушительной силой — Ральфа Рэкк-ита.

В них также есть KnowsMore, второстепенный персонаж в Ralph Breaks The Internet.

Оба символа подходят для страницы 404, но обратите внимание на то, что находится рядом с KnowsMore: небольшая панель поиска.

В верхней части страницы есть еще один, но он мертв в центре, где его увидят пользователи. Эта панель поиска удерживает пользователей на странице, помогая им найти то, что они ищут.

2. Дрейф

Drift — это инструмент конверсионного маркетинга и платформа продаж, которая предлагает инструменты для живого чата, целевых страниц и многого другого.

Копия на их странице 404 остается фирменной, упоминая «разговоры», но также помогает удерживать людей на веб-сайте Drift, предлагая ссылки на их домашнюю страницу, их блог и ссылки на некоторые из их самых популярных частей контента.

В правом верхнем углу они также предлагают путь к конверсии, предоставляя кнопку Get Drift Free.

3. Помогите разведчику

Help Scout предоставляет компаниям инструменты для программного обеспечения службы поддержки, поддержки клиентов по электронной почте и онлайн-баз знаний.

Как и Drift, их страница 404 предлагает ссылки на их блог и другие сообщения, но они используют симпатичную графику милых собак, чтобы люди улыбались.

4. Квартирная терапия

Apartment Therapy, сайт домашнего декора, шутит, что лента васи (популярная бумажная лента, используемая в декорировании и скрапбукинге) не может исправить сломанную ссылку.

Чуть ниже сгиба они ссылаются на несколько популярных постов, чтобы заинтересовать посетителей сайта.

Они также включали панель поиска и основную панель навигации, чтобы пользователи могли продолжить изучение сайта.

5. Совместное расписание

CoSchedule, инструмент планирования маркетинга, делает его простым с милой собакой GIF и ссылками на их домашнюю страницу и блог.

Этот пример просто показывает, что вам не нужно тратить большие деньги, чтобы создать привлекательную страницу 404.

Это просто, но работает.

6. Росток социальный

Sprout Social, инструмент маркетинга в социальных сетях, действительно хочет удерживать своих клиентов на странице.

Они начинают с насмешливой реакции на попадание на неправильную страницу, но они также продвигают бесплатную демоверсию, в то время как ссылка на главную страницу отходит на второй план.

Затем появляется их чат-бот, чтобы узнать, что вам нужно.

Внизу они продвигают свой информационный бюллетень.

По сути, они превратили свою страницу 404 в целевую страницу.

7. ConvertKit

Кто не любит собак?

ConvertKit упрощает задачу, предлагая фотографию собаки члена команды и ссылку на его домашнюю страницу.

Но они также сохраняют профессионализм, предоставляя свой онлайн-чат и CTA для бесплатной регистрации.

8. Кричащая лягушка

Screaming Frog — это инструмент, разработанный, чтобы помочь владельцам сайтов находить и исправлять неработающие ссылки, и они признают иронию наличия страницы 404, немного подшучивая над собой, а затем предлагая ссылки на свой блог, страницу контактов и услуги.

В отличие от других 404 страниц в списке, эта не статична.

Мухи летают по странице, рыбки плавают, кувшинки крутятся.

Это небольшое изменение, но оно делает страницу более продуманной.

9. Моц

Moz упрощает задачу благодаря камео от Роджера Мозбата, талисмана бренда.

Его присутствие на бренде и простой способ заставить большинство людей улыбнуться.

Moz также предоставляет вам панель поиска по сайту, чтобы вы могли найти то, что ищете.

10. БигКоммерс

Страница 404

BigCommerce предлагает многие из тех функций, которые мы видели раньше — CTA для связи, запрос демоверсии и простой способ изучения сайта.

Но что выделяется, так это хорошо продуманное изображение космоса, благодаря которому страница кажется продуманной и спланированной.

Есть большая вероятность, что пользователи, которые попадут на вашу страницу 404, будут раздражены — креативная графика помогает создать впечатление, что вы собрали все воедино, и это была всего лишь небольшая оплошность.

11. Кинста

Kinsta, облачная хостинговая компания WordPress, использует аналогичный подход к BigCommerce, предлагая хорошо продуманное изображение на своей странице 404.

Они сохраняют свою верхнюю панель навигации и поиска, чтобы пользователи могли легко находить другую информацию.

Они также используют всплывающие окна, чтобы предложить закрытый контент, что, вероятно, помогает привлечь подписчиков электронной почты.

12. Лего

Lego делает его легким, используя большое изображение человечка Lego вместе с шуткой «Извините, мы не можем найти эту страницу! Не волнуйтесь, хотя все ПО-ПРЕЖНЕМУ УДИВИТЕЛЬНО!» это отсылка к песне из фильма «Лего».

Они также предлагают ссылку на свой магазин, чтобы пользователи оставались на сайте.

13. Провисание

Страница 404 Slack невероятна.

Изображение выше фактически прокручивается, чтобы показать вам лес с летающими бабочками, свиньями, цветами и цыплятами.

Он также становится черно-белым, если вы переходите на другую вкладку, что, к сожалению, затрудняет получение снимка экрана.

Зайдите на их сайт, чтобы получить полный опыт.

14. Мейлчимп

Инструмент электронной почты Mailchimp делает его простым, но умным, с их анимированной страницей 404, на которой животное ищет в норе, предположительно, потерянную страницу.

Это умно и показывает, что их страница 404 не является второстепенной.

15. Окта

Okta — облачная компания по управлению доступом, базирующаяся в Сан-Франциско.

Их страница 404 довольно проста, но мне очень нравится, что они предлагают причины, по которым ссылка может быть неработающей, что помогает пользователям понять, что могло пойти не так.

16. Швейцарский

Swiss Airlines не предлагает никакой дополнительной информации, кроме ссылки на их домашнюю страницу и панель навигации, но изображение на их странице 404 действительно красивое.

Облака движутся, когда вы проводите курсором по странице, окутывая вас облаками.

Это интересная функция, которая продержала меня на их странице 404 дольше, чем мне хотелось бы признать.

17. Волшебный мир

Как знают многие поклонники Гарри Поттера, Гарри теряется, когда впервые пытается использовать летучий порошок, блестящее вещество, которое позволяет волшебникам путешествовать, перенося их почти в любой другой дом или здание с камином.

На изображении выше показана сцена, где Гарри выходит из камина, куда он случайно перенесся весь в копоти, что делает его идеальным изображением для страницы 404.

18. Юго-запад

Вот еще одна страница 404, которая заставила меня улыбнуться — во-первых, они используют отсылку к «Звездным войнам», что делает ее легкой.

На странице также есть движущаяся жезл, которым пользуются авиадиспетчеры, направляющие самолеты на взлетно-посадочную полосу.

Рядом с изображением Southwest предлагает быстрые ссылки, чтобы помочь пользователям найти то, что им нужно.

Он функционален, но все же выделяется.

19. 9GAG

9GAG, онлайн-платформа для мемов и видео, использует полностью фирменный GIF для своей страницы 404 и предлагает единую ссылку, которая направляет пользователей в их приложение.

Это просто, но сохранение бренда гарантирует, что посетители сайта будут знать, что они на правильном сайте, несмотря на то, что они не находят страницу, которую искали.

20. Маховик

Flywheel, управляемая хостинговая компания WordPress, предлагает эту причудливую страницу 404, чтобы люди знали, что они попали не на ту страницу.

Обычный язык отражает общее ощущение бренда, а ссылка на домашнюю страницу помогает пользователям ориентироваться.

Как и некоторые другие бренды, они также предлагают функцию чата, чтобы помочь пользователям, которые заблудились.

21. Дэн Вуджер

Дэн Вуджер, художник и иллюстратор, представляет свои работы на странице 404. Его яркий и веселый гамбургер как дома.

Обратите внимание, что он не упоминает, что это страница 404, и не дает никакой другой информации, кроме ссылки на свою работу.

Этот пример показывает, что отличная страница не обязательно должна быть сложной.

22. Дистиллированная

Многие бренды звонят на страницу 404. Они считают, что не многие люди увидят страницу, так что какое это имеет значение.

Но демонстрация стиля вашего бренда на (кажущейся) незначительной странице имеет большое значение.

Если вы заботитесь о своей странице 404, есть большая вероятность, что вы заботитесь и о своих клиентах и ​​покупателях.

Distilled использует изображение, похожее на инфографику, чтобы объяснить, что это за страница и что могло пойти не так.

23. Тако Белл

Taco Bell известен своей непочтительностью. Их страница 404 не исключение.

На странице изображен танцующий тако, который соскальзывает и расплескивает начинку, а затем зачерпывает ее обратно в скорлупу.

Это забавное напоминание о том, что они знают, что что-то пошло не так.

Страница также содержит ссылку на главную страницу сайта, меню, места и места, где можно купить подарочные карты и товары.

24. Магнит

Magnt предлагает простой в использовании конструктор и инструменты для создания сайтов, и они гордятся тем, что они лучше, чем ваш стандартный конструктор веб-сайтов на основе шаблонов.

Их страница 404 подчеркивает креативность бренда с помощью умной диаграммы Венна, которая исследует причины, по которым вы могли оказаться на странице — «Мы что-то сломали» или «Вы не можете печатать.

25. Дриблинг

Dribble, креативная торговая площадка для профессионалов дизайна, предлагает полнофункциональную страницу 404.

Пользователи могут перетаскивать точку под шрифтом 404, чтобы изучить дизайнеров в определенном цветовом диапазоне.

Нажав на блоки, из которых состоят числа 404, вы перейдете к этим конкретным дизайнерам.

Они также предлагают панель поиска для пользователей, которые предпочитают искать сайт таким образом.

26. Перелив

Личность

Overflow размещена в центре страницы 404.

Их разговорный тон и юмор приветливы и гостеприимны, что вызывает у меня желание вернуться на их домашнюю страницу.

И тот же голос и тон передаются на главной странице.

27. Венди

К настоящему моменту вы, наверное, уже смеялись над одним или двумя твитами от Wendy’s.

Но, как и в случае с Overflow, Wendy’s продолжает вести тот же голос и тон на своем веб-сайте, даже на своей странице 404.

Они создали интерактивную видеоигру для пользователей, похожую на Pac-Man, на своей странице 404.

Посмотрим, сможешь ли ты довести Венди до конца!

28. Ред Булл

Страница 404 Red Bull — мечта любого специалиста по SEO или маркетингу.

Он битком набит ссылками на статьи и список воспроизведения видео.

Red Bull даже меняет список воспроизведения видео для своего последнего события.

На изображении выше видно, что компания Red Bull использовала мероприятие Red Bull Big Wave 2020 по серфингу в качестве источника вдохновения.

29. Метель

Blizzard Entertainment, создатели World of Warcraft, также известного как WOW, если вы такой же гик, как я.🤓

Blizzard представляет одного из своих самых известных персонажей, мурлока, который поможет вам спасти вас со страницы 404.

30. Марвел

Marvel использует различных персонажей комиксов, таких как Капитан Америка, Дэдпул и т. д., на вращающейся странице 404.

Небольшой совет: продолжайте нажимать кнопку «Обновить». Каждое третье обновление Marvel будет показывать новый визуальный ряд.

31. Патагония

Patagonia занимает десятое место на странице 404, подчеркивая непринужденную тропическую атмосферу.

Сначала они вовлекают зрителя в цикл видео, а затем направляют пользователя дальше вниз по странице к ссылкам на популярные категории покупок.

32. Бэккантри

Backcountry, популярный веб-сайт снаряжения для активного отдыха, на котором я часто провожу слишком много времени, покупая вещи, которые никогда не куплю, демонстрирует свою забавную сторону, общаясь со своей аудиторией.

33. Нинтендо

Nintendo не хватает некоторых визуально привлекательных элементов, что меня удивило, знаете ли, тем, что это Nintendo и все такое.

Но важно то, что Nintendo добавляет ссылки на ресурсы для пользователя.

Это заставляет пользователей оставаться на веб-сайте и не возвращаться к поисковой выдаче.

34. Зиллоу

Zillow предлагает пользователям, ищущим дома, интерактивные GIF-файлы.

Zillow использует данные о клиентах, чтобы узнать, являются ли их пользователи любителями домашних животных.

И, чтобы развлечь любителей домашних животных, они создали этого интерактивного кота, который немного посмеивается в конце, когда ломает что-то в гостиной.

Как любитель животных, я могу это понять!

35. Блок H&R

H&R Block — это еще один взгляд на не очень привлекательную страницу 404, но он предлагает пользователям больше информации, чтобы они продолжали кликать и оставаться на своем веб-сайте.

36. Мир Варкрафта

Команда World of Warcraft отдает дань уважения навыкам своей аудитории, шутя о CDN и выше сгиба.

37. Игровая приставка

Playstation славно отзывается об одной из своих новых игр на странице 404.

Кроме того, они предоставляют возможность вернуться на домашнюю страницу или получить совет в справочном центре.

Резюме

В идеальном мире никто никогда не увидит ваши 404 страницы.

Они останутся спрятанными далеко, как сумка с вещами Риза, которую я прячу в своем шкафу. Вы знаете, в трудные времена.

Но в реальном мире всякое случается.

Ссылки обрываются, толстые пальцы проскальзывают, а иногда просто забываешь перенаправить страницу. Начните с использования такого инструмента, как Screaming Frog, чтобы найти неработающие ссылки.

Помните, что требуется время, чтобы создать креативные страницы 404, которые привлекают пользователей, а не отталкивают их.

Дополнительные ресурсы:


Авторы изображений

Избранное изображение: Создано автором, август 2020 г.
Все скриншоты сделаны автором, август 2020 г.

404 Не найдено | Документация Grav

Существует несколько причин, по которым вы можете получить сообщение об ошибке Not Found , и каждая из них вызвана разными факторами.

Приведенные ниже примеры относятся к веб-серверу Apache, который является наиболее распространенным серверным программным обеспечением.

IIS использует файл .htaccess

После добавления URL Rewrite на сервер IIS с помощью установщика веб-платформы перезапустите сервер IIS. Перейдите в интерфейс управления, IIS, дважды щелкните URL-адрес Rewrite, в разделе «Правила для входящих подключений» нажмите «Правила импорта», в разделе «Правила для импорта» перейдите к файлу конфигурации, выбрав файл .htaccess в корне, а затем нажмите «Импорт».Перезапустите сервер IIS. Получите доступ к Grav прямо сейчас.

Отсутствует файл .htaccess

Первое, что нужно проверить, это наличие предоставленного файла .htaccess в корне вашей установки Grav. Поскольку это скрытый файл , вы обычно не увидите его в окнах проводника или поиска. Если вы извлекли Grav, а затем выбрали и переместили или скопировали файлы, вы вполне могли оставить этот очень важный файл позади.

Настоятельно рекомендуется разархивировать Grav и переместить всю папку на место, затем просто переименовать папку.Это гарантирует, что все файлы сохранят свое правильное положение.

Разрешить переопределение всех

Чтобы предоставленный Grav .htaccess мог установить правила перезаписи, необходимые для правильной работы маршрутизации, Apache необходимо сначала прочитать файл. Когда ваша директива или настроена с AllowOverride None , файл .htaccess полностью игнорируется. Самое простое решение — изменить это на AllowOverride All . где используется RewriteRule, в директиве Options необходимо установить FollowSymLinks или SymLinksIfOwnerMatch .Просто добавьте в ту же строку «+FollowSymlinks» после «Параметры»

.

Дополнительные сведения о AllowOverride и всех возможных параметрах конфигурации можно найти в документации Apache.

RewriteBase Проблема

Если домашняя страница вашего сайта Grav загружается, но любая другая страница отображает эту очень грубую ошибку в стиле Apache , то наиболее вероятной причиной является проблема с вашим файлом .htaccess .

По умолчанию .htaccess , поставляемый в комплекте с Grav, в большинстве случаев отлично работает. Однако существуют определенные настройки, связанные с виртуальными хостами, где файловая система не соответствует настройке виртуального хостинга напрямую. В этих случаях вы должны настроить параметр RewriteBase в .htaccess , чтобы указать правильный путь.

В самом файле .htaccess есть краткое пояснение:

  ##
# Если вы получаете ошибку 404 на подстраницах, возможно, вам придется раскомментировать запись RewriteBase.
# Вы должны изменить '/' на соответствующую подпапку.Например, если у вас есть
# ваша установка Grav в корне вашего сайта '/' должна работать, иначе это может быть что-то
# по строкам: RewriteBase /
##

# RewriteBase /  

Просто удалите # перед директивой RewriteBase/, чтобы раскомментировать ее, и настройте путь в соответствии с вашей серверной средой.

Мы включили дополнительную информацию, которая поможет вам найти файл .htaccess и устранить неполадки в нашем руководстве по htaccess.

Отсутствуют модули перезаписи

Некоторые пакеты веб-серверов (я смотрю на ваши EasyPHP и WAMP!) не поставляются с включенным по умолчанию модулем Apache rewrite . Обычно их можно включить в настройках конфигурации для Apache, или вы можете сделать это вручную через httpd.conf , раскомментировав эту строку (или что-то подобное), чтобы они загружались Apache:

  #LoadModule модули rewrite_module/mod_rewrite.so  

Затем перезапустите сервер Apache.

Тестовый скрипт .htaccess

Чтобы помочь изолировать .htaccess и переписать проблемы , вы можете загрузить этот файл htaccess_tester.php и поместить его в корневой каталог Grav.

Затем укажите в браузере http://yoursite.com/htaccess_tester.php . Вы должны получить успешное сообщение и отобразить копию файла Grav .htaccess .

Затем вы можете проверить, работает ли перезапись, сделав резервную копию существующего файла ..*$ htaccess_tester.php

Тогда попробуйте этот URL: http://yoursite.com/test . На самом деле любой путь, который вы используете, должен отображать сообщение об успешном завершении, говорящее вам, что mod_rewrite работает.

После завершения тестирования необходимо удалить тестовый файл и восстановить файл .htaccess :

  РМ htaccess_tester.php
mv .htaccess-backup .htaccess  

Grav Ошибка 404 Страница

Если вы получаете ошибку в стиле Grav с надписью Error 404 , тогда ваш .htaccess работает правильно, но вы пытаетесь открыть страницу, которую не может найти Grav.

Наиболее распространенной причиной этого является то, что страница была перемещена или переименована. Еще одна вещь, которую нужно проверить, это наличие на странице слага , установленного в заголовках страницы YAML. Это переопределяет явное имя папки, которое используется по умолчанию для создания URL-адреса.

Другая причина может заключаться в том, что ваша страница не маршрутизируется . Параметр маршрутизации для страницы может быть установлен в заголовках страниц.

404 Страница не найдена на Nginx

Если ваш сайт находится в подпапке, убедитесь, что ваш файл nginx.conf указывает на эту подпапку. Образец Grav nginx.conf имеет комментарий в коде, объясняющий, как это сделать.

Если ваша домашняя страница работает, но другие страницы не найдены, убедитесь, что ваш nginx.conf настроен в соответствии с образцом nginx.conf.

44 невероятные страницы с ошибкой 404

Никто не хочет, чтобы его посетители терялись. Но это случается. Когда это происходит, отличная страница с ошибкой 404 может превратить плохой опыт в восхитительный.

Мы всегда высоко оцениваем преимущества хороших стратегий во время простоя. Другим аспектом этого является забота о посетителях, если они попадут на старую страницу или неработающую ссылку. Вот почему мы рекомендуем немного подумать над страницами ошибок с уровнями 400 и 500.

Продуманная или привлекательная страница с ошибкой усиливает сообщение вашего бренда и увеличивает шансы посетителей остаться на вашем сайте, а не вообще перейти по ссылке.

Что такое страница ошибки 404?

Страница ошибки 404 — это веб-страница, предназначенная для отображения, когда запрос вызывает код ответа HTTP 404.Этот код означает, что клиент (или «посетитель») смог найти сервер, но не конкретный пункт назначения. Другими словами, они нашли ваш сайт, но не конкретную страницу вашего сайта. Таким образом, сервер отправляет вашему браузеру код ответа 404, сообщая им, что произошло. Если дизайнер сайта указал его, загружается страница ошибки 404.

Вот пример:

Посетите страницу состояния, и ваш браузер загрузит нашу главную домашнюю страницу. Вы нашли наш сервер. Добавьте правильное место назначения в конец этого URL-адреса, например, /pricing или /login, и ваш браузер загрузит это конкретное место назначения.Но попробуйте несуществующий пункт назначения, например /gibberish, и вы получите страницу 404. По сути, наш сервер говорит следующее: вы нашли меня, я вижу там свой URL-адрес, но конкретное место назначения, которое вы ищете после косой черты, — это страница, для которой у меня нет соответствия. Итак, вот эта страница с ошибкой, чтобы вы знали, что я не вижу в своем каталоге страницы, которая соответствует тому, что вы просите.

Самое замечательное в странице с ошибкой 404 то, что одна и та же страница загружается независимо от того, какая ошибка привела вас туда.Таким образом, любая из бесконечных комбинаций неверных расширений URL будет генерировать эту страницу при условии, что домен верхнего уровня, часть site-dot-com, не поврежден.

Существует две распространенные причины, по которым посетитель может попасть на страницу с ошибкой:

  1. Они нажимают на ссылку, которая указывает на URL-адрес страницы, которой больше не существует
  2. Они нажимают или вводят ссылку с ошибкой

Эффект «гниения ссылок» является побочным продуктом первой причины, старых ссылок. Веб-сайты регулярно обновляются, перемещаются или удаляются.Но ни один человек не может полностью контролировать или знать сеть внешних свойств, ссылающихся на его страницу. Это означает, что хотя ссылки продолжают существовать, они указывают на страницу, которой больше не существует. Таким образом, ссылка гниет. По одной из оценок, это настолько распространено, что половина ссылок, цитируемых в решениях Верховного суда, больше не содержат исходный контент.

Поскольку мы не можем контролировать, кто может отправлять посетителей по неработающим ссылкам в нашем домене, самое лучшее, что мы можем сделать, это настроить отличную страницу ошибки 404.Несмотря на то, что отправка посетителей на страницу с ошибкой не является идеальным опытом, вы все равно можете им владеть.

Как насчет других страниц ошибок?

Хотя 404 является наиболее распространенным кодом ошибки, который видит большинство людей, это лишь одна из нескольких ошибок, которые можно обслуживать.

Любой трехзначный код ошибки, который начинается с 4, например 404, называется ошибкой уровня 400 и означает, что что-то пошло не так на стороне клиента. Клиент в этих отношениях — ваш веб-посетитель.Точнее, это их браузер. Поэтому имеет смысл, что неправильно написанный URL-адрес считается ошибкой клиента. Сервер (компьютер, на котором размещен сайт) работает нормально.

Другие распространенные ошибки уровня 400 включают:

  • 400 Неверный запрос: запрос, отправленный на сервер, был неправильно сформирован или каким-то образом не соответствовал правилам синтаксиса.
  • 404 Запрещено: Звучит зловеще. Но на самом деле все это означает, что запрошенный URL-адрес действителен, но у клиента нет необходимых разрешений для доступа к сайту.Это может произойти, когда вы пытаетесь перейти по URL-адресу сайта, для посещения которого необходимо войти в систему.

Другим распространенным набором кодов ошибок являются 500-уровневые коды. Там, где коды уровня 400 указывают на проблему с чем-то, что делает клиент, коды уровня 500 указывают на что-то неожиданное, происходящее на стороне сервера.

Некоторые из распространенных 500-уровневых кодов:

  • 503 Служба недоступна: это стандартная ошибка «сервер недоступен». Обычно сервер не может ответить, потому что он перегружен или отключен для обслуживания.
  • 504 Время ожидания шлюза: сервер действовал как шлюз для вышестоящего сервера, но вовремя не получил ответ от вышестоящего сервера.

Совет от профессионала: Даже если на сайте нет страницы с ошибкой, вы можете сами увидеть коды ошибок в своем браузере. Например, в Chrome щелкните правой кнопкой мыши страницу и нажмите «Проверить». Вы увидите набор панелей инструментов разработчика. На вкладке «Консоль» вы увидите список любых кодов ответов HTTP, которые могут быть сгенерированы, а также кучу другой «внутренней» информации, которую сервер сообщает вашему браузеру.

Забавный факт: Существует и иногда используется малоизвестный код ошибки 451. Код предназначен для использования, когда доступ запрещен из-за юридического запроса, и является отсылкой к роману-антиутопии «451 градус по Фаренгейту».

44 невероятных примера страниц с ошибкой 404

1. 20 век Фокс

У такой компании, как 20th Century Fox, есть огромная библиотека запоминающихся материалов, из которых можно черпать вдохновение. Они взяли несколько клипов из своей любимой фильмотеки, таких как «Офисное пространство», «Месть ботаников» и «Эдвард Руки-ножницы».Нажмите на текст, и вы попадете на страницу, где сможете купить собственную копию.

2. Амазонка

Amazon умеет делать много дел одновременно. Их страница с ошибкой ничем не отличается, отчасти это устройство для сближения с брендом, отчасти инструмент для рекрутинга, их страница с ошибкой загружает изображения и копирует множество разных собак, которые часто посещают офисы компании. Оттуда вы можете щелкнуть биографии разных собак и перейти к реальным историям реальных сотрудников о работе в Amazon.Похоже, они знали, что талантливые люди, занимающиеся веб-разработкой, будут искать забавные примеры страниц с ошибками.

3. Астутео

Фирма Astuteo, занимающаяся веб-дизайном и цифровым маркетингом, привлекла большое внимание своей страницей ошибок на тему «Касабланки». Приземлитесь на их страницу с ошибкой сейчас, и копия делает умную ссылку на всех, кто ищет забавную страницу с ошибкой. Все еще смешно.

4. Бэтмен 3D

Веб-сайт фан-арта немецкого художника Ахима Лубеса о Бэтмене — отличный пример использования дизайна и движения на странице с ошибкой.Перемещайте мышь, чтобы направить фонарик Бэтмена и показать сообщение об ошибке.

5. Бенджамин Рид

Британская компания веб-дизайнера Бенджамина Рейда Nouveller создала невероятную страницу ошибок, вдохновившись фильмом «Парк Юрского периода». Страница позволяет посетителям попробовать свои силы во взломе компьютерной системы парка, основываясь на сцене, где персонаж Сэмюэля Л. Джексона пытается обойти систему безопасности, установленную коварным программистом парка.

6. Кампания Берни Сандерса

Вскоре после объявления своей кандидатуры на пост президента в 2016 году Берни Сандерс создал, вероятно, самую запоминающуюся страницу ошибок среди всех кандидатов в президенты.На странице воспроизводится видео, в котором Сандерс объясняет, что пошло не так и как вернуться на домашнюю страницу. «Просто пролистните страницу вниз, и вы найдете дорогу домой, туда, где вы должны быть!»

7. Немного

Интерактивность и анимационное искусство не обязательно должны быть чрезмерными, чтобы произвести впечатление. Страница ошибок Bitly переносит посетителей на существо, плавающее в море. Используйте свой курсор, чтобы заставить волны подпрыгивать и катиться. Удивительно успокаивающий и удовлетворяющий, почти заставляет вас чувствовать себя хорошо, когда вы теряетесь, как море.

8. Blizzard Entertainment

Blizzard Entertainment использует дизайн разбитого стекла на своей странице с ошибкой с дерзким текстом о том, что пользователь «сломал» страницу. Умная концепция, особенно для миллионов поклонников Blizzard, стреляющих цифровыми боеприпасами на своих экранах.

9. Блумберг

Bloomberg известен двумя вещами. Отличная финансовая отчетность и отличные инструменты для профессионалов в области финансовых услуг. Вот почему это странно и памятно, что они поместили эту анимацию на свою страницу с ошибкой.На нем изображен мужчина в костюме, сбрасывающий свой компьютер со стола, а затем разваливающийся на пол. Возможно, это метафора того, что вы проводите слишком много поздних ночей у своего терминала Bloomberg?

10. Блюгг

У Blugg была довольно известная страница ошибки 404. Долгое время на странице размещалось вирусное видео со смеющейся козой. Звучит странно, но это соответствовало тону компании, было весело, людям нравилось. Настолько, что когда команда изменила дизайн своей страницы с ошибкой, им просто нужно было поговорить о козе.Они даже включили сводку статей, в которых упоминалась коза. Хорошо тебе, козёл.

11. Кодакадемия

Codecademy помогает людям научиться программировать. Что может быть лучше для призыва к действию на уроке о страницах ошибок, чем их собственная страница ошибок.

12. Даниэль Керхер

Вся сцена на этой странице с ошибкой завораживает и немного навязчива. Тонкие штрихи и визуальные эффекты, происходящие в сеттинге заброшенного метро, ​​создают настроение, создающее эффект неожиданного попадания в неизвестное место.

13. Дилберт

Комикс о Дилберте — отличный пример использования собственного контента в качестве материала для страницы 404.

14. Студия собак

Dogstudio использует потрясающую библиотеку изображений животных Giphy, чтобы заполнить свою страницу ошибок постоянно меняющимися изображениями собак.

15. Восточный рынок


Людям нравятся хлопающие игры, в которых вы нажимаете или щелкаете, чтобы летать объектом по небу и избегать препятствий. На Восточном рынке Детройта размещена страница ошибки 404 с игрой под названием «Flappy Spud.«Может быть, это такая же картошка, которую можно купить на рынке. Также приятно, что картофель взрывается в кучу картофеля фри, когда он ударяется о стену.

16. Электронный центр Великобритании
Страницы ошибок

— это хорошее место, чтобы продемонстрировать некоторые члены команды вашей компании и их творческий потенциал. Для Emailcenter UK это означало интерактивную шутку об увольнении члена команды разработчиков. Это умный способ повеселиться как бренд и показать команду за кулисами, которая обычно не получает много фанфар.

17 . Гугл

Компания Google всегда отлично справлялась с тем, чтобы их бренд оставался веселым и игривым, даже создавая одни из самых посещаемых инструментов в Интернете. С таким количеством разных посетителей и вариантов использования их продуктов пройти по этой линии непросто. Google отлично справляется с тем, чтобы поместить тонкие всплески индивидуальности в неожиданные места. Их страница с ошибкой — отличный пример.

Страница с ошибкой представляет собой довольно простую иллюстрацию сломанного робота и копии. Но пасхальное яйцо находится в заголовке страницы, который вы видите на вкладке браузера.Сначала это выглядит как опечатка, но «!!1» — это отсылка к интернет-шутке о том, как быстро энтузиазм (!!!) может стать неряшливым (!!1). Обратите внимание на эту клавишу Shift, дети.

18. ХейЗап

Люди любят винтажные видеоигры. Команда HeyZap уловила часть этой любви, закодировав версию классической аркады «Astroids» на своей странице ошибок. Выпустите несколько лазеров в летающие космические камни, и вы скоро простите того, кто отправил вас на мертвую связь.

19. Производство Hot Dot

Hot Dot Production создала удобную интерактивную страницу ошибки 404 с гигантской плавающей анимацией «404».Щелкайте по частям чисел, и точки взрываются в пространстве и возрождаются.

20 Хьюго Боначчи

Страница ошибки разработчика и дизайнера Хьюго Боначчи кажется стандартной страницей ошибки 404, когда вы попадаете на нее впервые. Затем фиолетовая вращающаяся черная дыра начинает засасывать все элементы страницы.

21. ИГН

IGN заимствует некоторую ностальгию у любителей видеоигр из-за их страницы ошибок, вдохновленной Марио. Копия ссылается на моменты из игр «Принцесса в другом замке».

22. IMDb
Страницы с ошибкой

не должны загружать один и тот же контент при каждом посещении. Их можно настроить так, чтобы они перемещались по библиотеке копий или иллюстраций, поэтому каждое посещение будет новым. Это то, что IMDb сделал со своей страницей ошибок, которая содержит слегка измененные цитаты из фильмов. Идите вперед и нажмите «Обновить» несколько раз, чтобы увидеть, какие еще цитаты появляются.

23. Иконфайндер

Эффект полета в космосе из «Звездных войн» завораживает зрителей с 1970-х годов.Это в полной мере влияет на страницу ошибки 404 Iconfinder. Еще один отличный пример тонкой анимации, производящей большое впечатление.

24. Изображение

Говоря о тонкостях, вы можете попасть на страницу с ошибкой Imgur десятки раз, прежде чем заметите, что происходит даже анимация. Двигайте мышью и попытайтесь найти его.

25. Дизайн зайца

Jackrabbit Design переносит посетителей в эту богатую анимацию, создавая слои, которые перемещаются и смещаются в зависимости от курсора пользователя.Это отличный способ заставить людей проводить немного больше времени с вашим произведением искусства.

26. Куало

Space Invaders — еще одна классическая аркадная игра. Британская команда, стоящая за Kualo, сделала забавный ход, назвав название своей компании Invaders. Захватчики, которых вы полюбите уничтожать космическим лазером.

27. Лего
Страница ошибки

Lego проста, но уже стала классикой. На иллюстрации изображены персонажи лего в беспорядке из-за выдернутой вилки из розетки.Отличная визуальная метафора и умный способ использовать знакомый бренд, чтобы рассказать историю.

28. Одинокая планета

Не каждая страница с ошибкой должна иметь какую-то умную связь с брендом или сложную метафору. Иногда забавной гифки с животным достаточно, чтобы перевернуть настроение пользователя. Lonely Planet отлично справляется с этой страницей с ошибкой.

29. Пышный

Эта страница с ошибкой косметического бренда Lush — отличный пример привязки вашей страницы к рекламной акции.К Пасхе 2014 бренд анонсировал «Охоту за пасхальными яйцами». Найдите пасхалку на их сайте и выиграйте бесплатный приз. Оказывается, пасхалка была спрятана на странице с ошибкой 404, а призом стала специальная версия «Ошибка 404» их популярного продукта с бомбой для ванны.

30. Магнит

Страница с ошибкой не нуждается в сложных анимациях или космических кораблях, стреляющих лазерами, чтобы привлечь внимание людей. Простая страница ошибок диаграммы Венна от Magnt за последние годы получила столько любви, что они добавили раздел, посвященный вырезкам из прессы, сгенерированным страницей.

31. MailChimp
Тонкая анимация

Mailchimp с изображением тумана, катящегося по джунглям, демонстрирует способность бренда рассказывать историю и привлекать внимание, используя небольшие творческие штрихи. Это приятный эффект, который вы почти не замечаете, если не обращаете внимания.

32. НПР

NPR имеет массу отличного контента, на который они могут указать посетителям. Они немного развлекаются с этим на своей странице с ошибкой 404, на которой представлены истории NPR о других людях и вещах, которые пошли не так.

33. Национальный музей истории похорон

Похороны — это смех? Если кто-то знает, это Национальный музей истории похорон. На их странице с ошибкой есть каламбур «серьезная ошибка» и упоминается, что страница «исчезла в загробной жизни».

34. Житель Нью-Йорка

The New Yorker известен своими превосходными мультфильмами. Так что, конечно, у них есть тот, который идеально подходит для страницы с ошибкой.

35. Правительство Новой Зеландии

У людей есть дурная привычка оставлять Новую Зеландию вне карты.Правительство страны немного позабавилось этим на своем собственном веб-сайте со ссылкой «чего-то не хватает» и картой мира без Новой Зеландии.

36. Нуванго

Ошибок не бывает, только счастливые случайности. Если цель страницы с ошибкой — превратить разочарование в другую эмоцию, например, в спокойствие, то нет человека, который бы справился с этой задачей лучше, чем Боб Росс.

37. Оранжевое пальто

Interactive не обязательно означает игры и виджеты Javascript.Страница ошибок Orange Coat дает посетителям блок-схему в стиле «выбери свое приключение».

38. Жаровня Ромен

Еще один отличный пример использования классических видеоигр, чтобы вызвать ностальгию и радость у посетителей страницы с ошибкой. Личный сайт Ромена Бразье дает вам умную цель спасти как можно больше из 404 леммингов, падающих с неба.

39. Спотифай

Копия является отсылкой к альбому Канье Уэста, а анимация представляет собой приятное движение виниловой пластинки.Так что расслабьтесь, вы просто хотите включить музыку и посмотреть, как вращаются пиксели.

40. Стив Ламберт

Названная «Самой неловкой страницей ошибок в Интернете», страница художника Стива Ламберта достойна внимания. Попробуйте дойти до конца. Как пишет Стив на странице: «Такая идея приходит к вам только в 12:30. И ты должен сделать это тогда, иначе ты никогда этого не сделаешь».

41. Сигик Трэвел

Sygic Travel пробуждает жажду путешествий своей анимированной страницей с ошибкой.Наблюдайте за восходом и заходом солнца, когда пустынный пейзаж движется и сменяет день и ночь.

42. Австралийский

Новостные организации, как правило, немного перебарщивают со своими брендами. Австралиец проделал хорошую работу, переворачивая это восприятие на своей странице с ошибкой. На странице представлены фальшивые, но почти правдоподобные цитаты австралийских политиков.

43. Музей творения

Музей Сотворения — это место с большой миссией. Многие люди расходятся во мнениях относительно этой миссии, но в любом случае это большая задача: убедить мир в том, что эволюции не было.Они делают шутливый удар по эволюции на своей странице с ошибкой.

44. Айриш Таймс

Вот еще один пример того, как новостная организация развлекается со своей страницей с ошибкой. На странице Irish Times 404 показан код, прорывающийся сквозь газетную бумагу.

Бонусный совет:

Соедините страницы ошибок со страницей состояния. Таким образом, когда ваши пользователи попадают на страницу, которая не работает, они могут щелкнуть вашу страницу состояния, чтобы получить подробную информацию о проблеме и статусе исправления.

Statuspage — это инструмент, который помогает вам легко сообщать сведения об инцидентах и ​​периодах обслуживания вашим клиентам.

Вот почему важно иметь страницу состояния в дополнение к странице ошибки:

  1. Уменьшение количества обращений в службу поддержки:  Когда пользователи знают, когда ожидать решения, им не нужно открывать обращение, чтобы запросить дополнительную информацию или, что еще хуже, пожаловаться в социальных сетях.
  2. Автоматическое уведомление пользователей:  Когда ваши пользователи подписываются на вашу страницу статуса, они автоматически получают уведомление по электронной почте, SMS или Slack, когда в вашем приложении возникает ошибка или период обслуживания.
  3. Улучшение качества обслуживания клиентов:  Объяснение пользователям периодов обслуживания и времени устранения неполадок укрепляет доверие клиентов и повышает качество обслуживания.

Попробуйте бесплатно.

21 потрясающая страница 404 для преобразования потерянных посетителей [2022]

Что, если бы мы сказали вам, что ваша страница с ошибкой 404 действительно может увеличить ваши конверсии и повысить доход?

Мы знаем, что это звучит слишком хорошо, чтобы быть правдой. Но, приложив некоторые усилия для создания правильного дизайна страницы 404 и надлежащей оптимизации, вы можете превратить потерянных посетителей в постоянных клиентов.

В этом посте мы рассмотрим 21 из лучших 404 страниц, которые мы видели. Кроме того, мы объясним , почему они работают .

Прежде чем мы углубимся в список, давайте разберемся, что такое страницы 404 и почему они так важны для вашей стратегии цифрового маркетинга.

Что такое страница 404 (и почему она важна)

Страницы 404 — это определенные страницы, на которые будут попадать ваши посетители, когда они введут или нажмут на неверный URL-адрес, связанный с доменом вашего сайта.

Так, например, если вы искали определенную страницу на OptinMonster, но неправильно написали URL, вы попали на эту страницу:

Пользователь сразу узнает, что он приземлился не в том месте, и вместо этого ему будут предложены варианты, куда идти.

В приведенном выше примере пользователь может либо перейти на страницу Home , страницу Contact Us , либо использовать навигационную панель поиска, чтобы перейти туда, где он ищет.

Страницы 404 имеют решающее значение для поддержания высокого уровня взаимодействия с пользователем (UX) на вашем сайте. По мере развития вашего веб-сайта ваши ссылки могут со временем меняться или ломаться.

Когда пользователи нажимают для навигации по вашему сайту, они могут перейти по одной из этих ошибочных ссылок. Если на вашем сайте нет страницы 404, вы, вероятно, можете навсегда распрощаться с этим потенциальным лидом.

Но С помощью профессиональной страницы 404 вы можете перенаправить пользователей туда, куда они хотят. Оттуда вы можете направить их по воронке продаж, чтобы создать более лояльных клиентов и увеличить продажи.

А для создания собственных страниц 404 мы рекомендуем использовать SeedProd:

SeedProd — это лучший конструктор страниц 404 и целевых страниц для WordPress. Это легко начать и вообще не требует никакого кода.

Это потому, что этот плагин поставляется с готовыми шаблонами страниц 404 и визуальным конструктором перетаскивания.Буквально каждый может создать профессиональные и высококонверсионные страницы 404, которые перенаправляют пользователей и улучшают UX.

Кроме того, вы можете добавить на свои страницы 404 множество мощных элементов, включая формы подписки, рекомендуемые продукты, кнопки CTA, разделы часто задаваемых вопросов для ответов на вопросы клиентов и многое другое.

Когда вы используете SeedProd, вам не нужно быть профессиональным дизайнером (или даже быть «технически подкованным, если уж на то пошло»). Вместо этого вы сможете создавать потрясающие страницы 404 за считанные минуты.

Хотите попробовать сами? Нажмите здесь, чтобы открыть свою учетную запись SeedProd со 100% безрисковым статусом уже сегодня!

И для дополнительного вдохновения мы рассмотрим 21 из лучших примеров страниц с ошибкой 404, которые мы можем найти.

Лучшие примеры 404 страниц

1. OptinMonster — пример страницы 404

Почему это работает:

Мы уже видели страницу 404 OptinMonster ранее в посте. Но поскольку это такой простой пример, мы начнем список здесь.

Опять же, главной изюминкой этой страницы является ее функциональность. У пользователей есть 3 варианта. Они могут пойти либо:

  • Вернуться на главную страницу
  • На страницу Свяжитесь с нами страница
  • Навигационная панель поиска

Но цель всегда одна и та же: удержать пользователей на сайте OptinMonster.

И по опыту мы можем сказать, что эта страница делает то, для чего она была создана.

2. WPForms

Почему это работает

Вот еще один пример урезанной страницы с ошибкой 404. Он использует игривый язык («возгласы») и предлагает пользователям перемещаться по сайту с помощью панели поиска.

Пользователям не предоставляется слишком много вариантов, так как это может быть ошеломляющим, и они по-прежнему могут перемещаться по сайту с помощью главного меню заголовка в верхней части страницы.

Одна вещь, которую мы могли бы улучшить, это добавление кнопки призыва к действию или ссылки, чтобы облегчить пользователям доступ к домашней странице.

В противном случае это гладкий и профессиональный пример страницы 404, который, как мы знаем, работает.

3. Пиксар

Почему это работает

Когда дело доходит до творчества, Pixar стоит далеко от остальных. Вот почему неудивительно, что у них есть забавный, креативный и привлекательный пример страницы 404.

Что здесь интересно, так это то, что у них нет навигационной панели поиска, чтобы пользователи могли найти то, что ищут.

В этом плане такие сайты, как OptinMonster или WPForms, имеют лучшие 404 страницы.

Но страница Pixar предназначена для того, чтобы заставить пользователя улыбаться, и они, безусловно, добиваются этого.

С одним из персонажей их фильма Inside Out они играют с тем, как неприятно может быть попадание не на ту страницу. Затем люди могут использовать главное меню в верхней части страницы, чтобы вернуться на сайт.

4. Дисней

Почему это работает

Точно так же, как мы видели в случае с Pixar, страница 404 Disney идеально соответствует бренду.

На самом деле, как видите, это анимация из их популярного фильма Ральф против Интернета .

Это отличный способ вернуть пользователей во вселенную Диснея. Кроме того, у них есть навигационная панель поиска (в отличие от Pixar), чтобы помочь своей аудитории найти то, что они ищут.

5. Нетфликс

Почему это работает

На Netflix есть забавная страница одного из фильмов, которые они предлагают, Затерянные в космосе . Это хорошо подходит, учитывая причину, по которой люди попали на страницу.

Главное, на что здесь следует обратить внимание, — это большая кнопка CTA посередине: Netflix Home.

Это перенаправляет пользователей обратно на домашнюю страницу, чтобы пользователи Netflix могли найти нужную страницу или фильм.

Опять же, такой простой вещи, как добавление кнопки обратно на домашнюю страницу, более чем достаточно, чтобы повысить UX со страницы с ошибкой 404.

6. Хулу

Почему это работает

Другой пример страницы 404 исходит от конкурента Netflix: Hulu.

Что интересно на этой странице, так это то, насколько она урезана. Там нет цветов, и есть только одна кнопка с надписью «ОК».

Хотя эта кнопка возвращает пользователей на домашнюю страницу, из текста неясно, куда именно направляется пользователь.

Но если такой мегабренд, как Hulu, что-то делает, скорее всего, потому, что это работает.

7. Нерф

Почему это работает

Nerf имеет подробную страницу 404 с забавной графикой и большой кнопкой CTA с надписью «Перейти к брендам.

Это также объясняет, почему пользователь попал на эту страницу («ссылка либо устарела, либо изменилась»). Это объяснение полезно для их целевой аудитории: детей старшего возраста.

Это важно, потому что эта возрастная группа, вероятно, менее знакома со страницей 404 и, вероятно, не будет знать, что это такое.

С дополнительным объяснением того, почему страница не работает, дети и взрослые могут перенаправить себя на линейку продуктов Nerf.

8. Трипадвизор

Почему это работает

На Tripadvisor есть забавный и анимированный пример страницы 404.

Копирайтер шутит, что потерял страницу, но не багаж. Это идеально подходит для туристического сайта и предлагает пользователю перейти к 4 основным разделам своего сайта:

.
  • Гостиницы
  • Рестораны
  • Чем заняться
  • Сезонная аренда

Это отличный способ повторно вовлечь пользователя и помочь ему спланировать свой следующий отпуск.

9. Постоянный контакт

Почему это работает

Constant Contact использует более неформальный язык, который находит отклик у их целевой аудитории (молодых стартапов и цифровых маркетологов).

Не слишком застегнутый язык быстро доносит это: «Все уже не так круто».

Затем они дают пользователям быстрый способ вернуться на домашнюю страницу.

Одна вещь, которую мы хотели бы исправить, — это язык вокруг CTA. В нем говорится: «Вы можете вернуться назад или попробовать одну из ссылок ниже». Но после этого пользователь может выбрать только одну ссылку.

Если переделать, было бы хорошо изменить текст вокруг CTA или предоставить пользователям больше ссылок.

10.Слабый

Почему это работает

Slack сделал анимированный фон для своей страницы с ошибкой 404.

Это отличный способ заинтересовать пользователя и позволить ему оставаться на вашем сайте немного дольше. У них также есть ссылка, которая возвращает пользователей в Справочный центр , но нет кнопки для возврата на главную страницу.

Но они предоставляют несколько ссылок в меню нижнего колонтитула, которые могут помочь пользователям вернуться на страницу, которую они ищут.

11. Лего

Почему это работает:

Страница 404 Lego не только на 100 % соответствует бренду, но и интересна и проста для понимания. Там нет технической формулировки и нет ссылки на «ошибку 404», которую некоторые люди могут не понять.

Все, что нужно знать вашему посетителю, это то, что он не получил страницу, которую хотел. Их действительно не волнует, почему; они просто хотят решения.

12. Центр электронной почты Великобритании

Почему это работает:

Email Center UK использует страницу 404, состоящую из двух частей, которая берет на себя всю вину с посетителя, предоставляя пользователям интересный способ справиться со своими разочарованиями 404.

Вы также заметите, что эта страница не обвиняет пользователя в проблеме. Вместо этого они  извиняющийся .

Они превращают страницу в игру, которая обвиняет разработчика в ошибке. Когда вы нажимаете на человека, которого хотите уволить, вы получаете следующую страницу, которая выглядит следующим образом:

Это способ превратить вашу страницу 404 в небольшую игру, которая повышает вовлеченность и удобство пользователей.

13. Список25

Почему это работает:

Эта страница с ошибкой 404 из списка 25 великолепна, и это вредит бренду.

Основная передовая практика дизайна взаимодействия с пользователем – объяснить, что пошло не так, при доставке сообщения об ошибке. List25 предлагает 25 объяснений — некоторые серьезные и некоторые в шутку.

У них есть панель поиска вверху, поэтому посетителям не нужно прокручивать весь список, но мы почти уверены, что большинство посетителей List25 все равно это сделают.

14. Бретт Терпстра

Почему это работает:

Одна из самых раздражающих особенностей страниц ошибок 404 заключается в том, что они могут сигнализировать о тупиковой ситуации.Если страница плохо спроектирована, вам может некуда идти дальше.

Страница 404 Бретта Терпстры содержит список сообщений, содержащих ключевые слова, связанные со ссылкой, по которой вы пытались получить доступ. Посты связаны ссылками, что упрощает и ускоряет навигацию по ним.

Страница не привлекательная, но чрезвычайно полезная.

15. Стив Мэдден

Почему это работает:

Страница 404 Стива Мэддена предлагает варианты для потерянных посетителей. Окно поиска является отличным дополнением к любой ошибке 404 и предлагает несколько различных способов получения помощи, позволяя посетителям понять, что они слушают.

Они также содержат ссылки на другие популярные продукты, чтобы отвлечь посетителей от того, что может быть очень неприятно. Подлый и эффектный.

Помогите своим потерянным посетителям с текстом и дизайном сообщения об ошибке 404. Включение некоторых из приведенных ниже идей может побудить посетителей продолжать просмотр и поиск , продлевая их время на вашем сайте.

Некоторые вещи, которые нужно включить в дизайн страницы 404:

  • Навигация по меню
  • Ссылка на домашнюю страницу
  • Ссылка на вашу карту сайта
  • Панель поиска
  • Ссылки на популярные посты

А с SeedProd вы можете легко отображать товары на странице с ошибкой 404.Просто перетащите один из пользовательских блоков WooCommerce SeedProd и поместите его на место.

Вы можете выбирать из таких блоков, как сетка продуктов, товары со скидкой, товары с самым высоким рейтингом и многое другое.

16. 9кляп

Почему это работает:

Страница 404 9gag имеет одну цель: заставить вас загрузить их приложение . Они даже не делают вид, что хотят чего-то еще.

Добавление целой страницы популярного gif-анимации Траволты из «Криминального чтива» на задний план — забавный штрих!

И здесь важна простота.

Да, мы только что говорили о том, чтобы предложить вашим посетителям возможность просмотра, но и не перегружайте их слишком большим количеством вариантов .

17. Путь

Почему это работает:

Страница 404

Path проста и понятна. Они не хотят иметь неработающие ссылки и отсутствующие страницы, поэтому они дают посетителям возможность связаться со службой поддержки Path, чтобы сообщить об этом.

Обратите внимание, что Path также включает нижний колонтитул навигации на тот случай, если посетитель не хочет сообщать о проблеме и предпочитает просматривать страницу.Это возвращает силу посетителю и помогает облегчить его разочарование.

Цель состоит в том, чтобы дать посетителям возможность сообщить о проблеме .

Вы можете сделать это несколькими способами. Вы можете сделать его простым, как Path, и включить возможность связаться со службой поддержки. Другой вариант — воспользоваться формой обратной связи.

18. ИМДБ

Почему это работает:

IMDB показывает посетителям цитату из фильма на их странице 404.

Брендинг здесь едва уловим.Здесь нет постеров к фильмам, нет трейлеров, конкурирующих за внимание посетителя. IMDB просто предлагает цитату из фильма, ссылку на домашнюю страницу сайта и ссылку на цитируемый фильм.

При разработке страницы с ошибкой 404 не забудьте сохранить знакомство с брендом .

Вместо того, чтобы дезориентировать ваших пользователей, им будет приятно познакомиться с той же маркой, которую они узнали и полюбили.

19. Эверипедия

Почему это работает:

Страница 404 Everipedia — это все, что ее посетители ожидают от онлайн-энциклопедии.Это напоминает посетителям, почему они любят сайт и продолжают возвращаться.

Спикер TED и маркетолог Ренни Глисон сказал о странице с ошибкой 404: « Простая ошибка может сказать мне, кем вы не являетесь. Или напомни мне, почему я люблю тебя.

Используйте страницу 404, чтобы напомнить посетителям, почему они вас любят . Каково ваше уникальное ценностное предложение? Что отличает вас от ваших конкурентов?

Если вы сможете быстро ответить на этот вопрос со своей страницы 404, вы сможете превратить потерянных посетителей в платных клиентов.

20. Гейзап

Почему это работает:

Кто не любит играть в игры?

Страница 404 Heyzap добавляет интерактивный элемент, который некоторое время будет развлекать и вовлекать посетителей на сайт. Может быть, даже достаточно долго, чтобы преодолеть свое разочарование из-за того, что они попали на страницу с ошибкой!

Нет, вам не нужно разрабатывать игру. Но рассмотрите добавление интерактивного элемента на вашу страницу .

Добавление интерактивного элемента дает посетителям вашего сайта что-то делать на странице с ошибкой 404.Это увеличивает время пребывания на странице и снижает показатель отказов, что важно для удержания вашего сайта в результатах поиска Google.

21. Амазонка

Почему это работает

Если такая компания, как Amazon, развлекается со своей страницей 404, это означает, что вам, вероятно, тоже следует.

Amazon начинает с извинений большими жирными буквами. Затем он перенаправляет пользователей на домашнюю страницу Amazon ИЛИ позволяет пользователям встретиться с «собаками Amazon».

Эта беззаботная переадресация — отличный способ удержать людей на своем сайте дольше.В конце концов, кто не любит собак?

На сегодня все! Это был 21 из лучших примеров страниц 404, которые вы можете использовать для создания своих собственных страниц 404 уже сегодня!

Надеемся, вам понравился этот пост. Если да, то вам определенно стоит ознакомиться со следующими ресурсами:

.

В этих статьях есть все, что вам нужно для создания лучших целевых страниц с более высокой конверсией для ваших веб-сайтов.

Опубликовано Натаном Томпсоном

Натан Томпсон — отец, писатель и любитель путешествий (именно в таком порядке).Когда он не борется со своими детьми, вы, вероятно, обнаружите, что Натан дает столь необходимый ему отдых от экранов с хорошей книгой или планирует семейную поездку со своей потрясающей женой.

40 Умные страницы ошибок 404 с реальных веб-сайтов

Запуск успешного веб-сайта означает постоянное внимание к таким ошибкам, как неработающие страницы или низкая производительность. Однако иногда возникают проблемы, которых просто не избежать, и ошибка 404 — одна из них.

Ошибка 404 возникает, когда пользователь запрашивает несуществующую страницу на вашем веб-сайте, что приводит к появлению страницы с ошибкой 404, предлагающей пользователям вернуться в нужное место.Независимо от того, сколько ресурсов вы вкладываете в обеспечение того, чтобы ваш веб-сайт никогда не вышел из строя … всегда есть шанс, что пользователи могут оказаться здесь.

Неудобно, но факт. И реакция посетителей, когда они попадают на несуществующую страницу, может варьироваться от «не воспринимать это спокойно» до «полностью сойти с ума».

Хотя с последним вы ничего не можете поделать, вы можете немного облегчить ситуацию, получив сообщение об творческой ошибке 404. Это может творить чудеса, заставляя посетителей вашего веб-сайта улыбнуться в неприятной ситуации.

Чтобы сделать дизайн вашего веб-сайта более эффективным, в этом посте будут показаны некоторые из наших любимых страниц с ошибками веб-сайтов. Надеюсь, вы сможете почерпнуть несколько идей, чтобы придумать собственное сообщение 404.

Что такое ошибка 404?

Ошибка 404 — это стандартный код сообщения об ошибке HTTP, означающий, что веб-сайт, который вы пытались открыть, не найден на сервере. Это ошибка на стороне клиента, означающая, что либо веб-страница была удалена или перемещена, а URL-адрес не был соответствующим образом изменен, либо человек просто неправильно ввел URL-адрес.

В большинстве случаев вы можете настроить свой сервер для создания пользовательской страницы ошибки 404. (Если вы являетесь клиентом HubSpot, нажмите здесь, чтобы узнать, как настроить страницу 404 в HubSpot.)

Некоторые настраиваемые страницы с ошибкой 404 включают главное изображение, остроумное описание, карту сайта, форму поиска или основную контактную информацию.

Лучшие примеры веб-страниц 404

На протяжении многих лет веб-сайты находили разные способы информировать посетителей об ошибке 404 и направлять их обратно в нужное место, некоторые просто, некоторые творчески, а некоторые весело.Давайте начнем с просмотра некоторых креативных страниц 404, а затем рассмотрим несколько забавных примеров, которые наверняка порадуют любого, кто на них наткнется.

Страница не найдена: творческие страницы с ошибкой 404

1. Пипкорн

В то время как страница 404 может легко выделяться на веб-сайте, страница ошибки Pipcorn идеально сочетается с остальным брендингом сайта. Есть приятный анимированный фон, дружественная текстовая подсказка, направляющая посетителей на поиск на веб-сайте (в комплекте с умным каламбуром), и кусочек попкорна, используемый как «0» в «404.

2. Спотифай

Гигант потокового вещания музыки Spotify прикрыл свои базы умной страницей 404. Используя остроумный каламбур из альбома Канье Уэста «808s and Heartbreak» и анимацию записи, веб-сайт ненадолго развлекает посетителей, а затем отправляет их обратно на страницу, с которой они пришли.

3. Гениально

Один из простых способов снять напряжение на странице 404 — добавить быстрое «Ой!» сообщение — это помогает вашему сайту выглядеть более представительным, поскольку вы возвращаете пользователей в нужное место.В случае с сайтом Genially на странице также есть отличная иллюстрация в сочетании с игривым текстом.

4. Adobe

Как и следовало ожидать, страница ошибки Adobe 404 полезна и визуально приятна. В нем перечислены популярные ссылки, которые могут понадобиться посетителям, а также некоторые интересные цифровые изображения, служащие визуальной метафорой для сломанной или потерянной страницы. Честно говоря, веб-сайты должны чаще использовать визуальные метафоры.

5. Клорокс

Страница 404 чистящих средств Clorox чередуется между тремя беззаботными фотографиями, чтобы показать посетителям, что они допустили ошибку.Это разумное использование брендинга, чтобы добавить краткий момент удовольствия, помогая потерянным пользователям.

6. Думский коллектив

В других случаях вам может не понадобиться остроумная реклама — просто скажите посетителям, что по адресу нет страницы, и пусть они идут дальше. Консультационное агентство по развлечениям Duma Collective делает именно это со своей страницей с ошибкой, хотя она дополнена фоновым изображением для небольшого чутья.

7. Холодильная камера

Говоря об элегантности, бренд товаров для ухода за собой Chillhouse проделал дополнительную работу, чтобы стильно перенаправить своих посетителей.Страница 404 оформлена соответствующим образом и даже отправляет посетителей в небольшое путешествие по нескольким кадрам изображений, прежде чем они вернутся на домашнюю страницу.

8. Битли

Если вы введете неправильную ссылку Bitly, вы попадете на страницу Bitly 404. Мы предполагаем, что это происходит довольно часто, поэтому страница 404 сразу переходит к делу. Он объясняет, что могло пойти не так, и предлагает пользователям посетить домашнюю страницу Bitly, если это то, что им нужно.

9.Икеа

Страница 404 Ikea также минималистична, но все же умудряется пронести туда умный брендинг. Этот пример показывает, что ваши страницы ошибок не должны быть сложными, чтобы донести суть, но нет ничего плохого и в том, чтобы добавить немного веселья.

10. Компания Мокси Дизайн

Конечно, фраза «взорвал Интернет» может быть несколько преувеличенной, но она говорит посетителям, что Moxie Design Co. не воспринимает себя слишком серьезно с такими небольшими оплошностями, как этот. Кроме того, панель поиска удобно расположена внизу, чтобы отправить вас в путь.

11. МакКиссак и МакКиссак

А, классический трюк «мы потеряли страницу». Опять же, простой способ представить 404, не отталкивая вашу аудиторию. Если вы представляете такое агентство, как McKissack & McKissack, которое управляет многими взаимодействиями с клиентами, четкий и краткий текст необходим для всех страниц вашего сайта, включая страницы ошибок.

12. CSS-трюки

Вы когда-нибудь отрывали оболочку веб-сайта, чтобы посмотреть, что находится под ней? Это концепция, к которой CSS Tricks стремились на своей странице с ошибкой 404.Это и остроумно, и напоминает о том, что такое веб-сайт: разумное использование стилей страницы.

13. Старые добрые игры

Для других веб-сайтов вы разворачиваете переднюю часть и видите… просто огромную пустоту. Эта страница является отсылкой к GOG Galaxy, собственному клиенту для видеоигр от Good Old Games. К счастью, здесь есть маленький персонаж из видеоигры, чтобы посетители могли сообщить об ошибке, если захотят.

14. Канва

Чтобы узнать что-то немного другое, посетите страницу 404 Canva.Он включает в себя не только сообщение об ошибке, но и изящную головоломку, в которую посетители могут поиграть, чтобы немного развлечься. Нет ничего плохого в том, чтобы позволить вашим посетителям расслабиться на пару минут, верно?

15. Иннотех

Подобно подходу Canva, Innotech размещает игру в стиле Pong на своей странице 404, чтобы немного развлечься. Скорее всего, вы помните такой веб-сайт. Кроме того, забавный обходной путь дополняет действительно впечатляющий веб-сайт — серьезно, когда вы закончите играть, перейдите на домашнюю страницу и ознакомьтесь со всем этим.

16. Мириады

Видеоагентство Myriad выбрало причудливый фирменный дизайн страницы 404, который имитирует классические цветные полосы SMPTE, которые появляются на старых лентах и ​​телевизорах. Это забавный возврат к старым технологиям, представляющий более современную проблему несуществующей веб-страницы.

17. КонМари

Известная своими популярными методами уборки и организации и брендом, Мари Кондо привнесла похожее ощущение на страницу 404 своего веб-сайта.Копия кратко и с юмором восходит к ее философии уборки — небольшая, но хорошо узнаваемая деталь, которую фанаты узнают.

18. БрендCrowd

Мало того, что иллюстрация на этой странице с ошибкой подробная и привлекательная, текст еще и умный. Нам нравится отсылка к песне Semisonic «Closing Time»: «Вы можете щелкнуть где угодно, но не здесь».

19. Хот Дот Продакшнс
Страница ошибки

Hot Dot остается верной своему слогану: «пересечение новых технологий и дизайна.Страница анимируется сотнями крошечных точек, которые меняют направление в зависимости от того, куда вы перемещаете курсор. Это завораживает и является отличной демонстрацией дизайнерских возможностей агентства.

20. Оранжевое покрытие

Если вы собираетесь выдать сообщение об ошибке, почему бы не развлечь пользователя на несколько секунд, пока вы ему помогаете? После дружеского приветствия OrangeCoat предлагает блок-схему, которая действительно помогает пользователям понять, почему они вообще попали на страницу с ошибкой.

21. Эрвин и Смит

Эта страница 404 не просто перенаправляет пользователей обратно на активные страницы. Вместо этого страница 404 Ervin & Smith приглашает вас прокрутить вниз и узнать, почему вам нужно агентство цифрового маркетинга и почему именно Ervin & Smith выбрать именно Ervin & Smith, а также контактную форму. Верное своей миссии, это агентство показывает, что любая страница может быть возможностью конверсии.

22. Студии DayCloud

… или ваш 404 может быть просто местом, где можно потратить минутку, как можно увидеть на веб-сайте DayCloud Studios.Перемещение курсора по экрану показывает сообщение 404, освещенное лазерами, стреляющими из кошачьих глаз. Почему бы и нет?

23. Свободное пространство

Еще один пример веб-сайта, умело включающего сообщения своего бренда на страницу 404 — приложение для управляемой медитации Headspace пытается успокоить пользователей, побуждая нас сделать глубокий вдох, а затем вернуться на основной сайт.

24. Пекарня Wildwood

Некоторые веб-сайты до сих пор интегрировали на свои страницы умные фирменные тексты, в то время как другие размещали на своих страницах полноценные онлайн-игры.Но нет ничего плохого в коротком толчке в правильном направлении. Изысканный сайт Wildwood Bakery делает вещи короткими и приятными (буквально).

 

Страница не найдена: забавные страницы с ошибкой 404

25. Астутео
Страница 404 дизайнерского агентства Astuteo

— это идеальный баланс элегантных визуальных эффектов, юмора и полезности. Минималистичный макет дает пользователям необходимую им информацию наряду с другой забавной визуальной метафорой, тонущим грузовым кораблем и убегающей фигурой.

26. ЛЕГО

На странице ошибки 404 LEGO нужно несколько слов — по выражению лица персонажа все становится ясно. Кроме того, поклонникам кинофраншизы LEGO понравится забавная отсылка в копии.

27. Магнит

В этом забавном сообщении об ошибке Magnt высмеивает тот факт, что да, они могли что-то сломать — или вы просто не можете печатать. Визуальное служит быстрым способом быстро проиллюстрировать свою точку зрения.

28.IconFinder

Страница ошибки IconFinder проста, но восхитительна. Талисман компании, одетый в мантию и выглядящий утомленным, — это намек на потерянных посетителей. Не беспокойтесь, так как сайт перечисляет некоторые из своих ссылок для посещения ниже.

29. Сладких снов

Судя по странице 404 на веб-сайте, команда компании по производству средств для сна Sweet Dreams взяла слишком много своих продуктов. Мало того, что эта страница юмористическая, она также хорошо сочетается с остальной эстетикой и сообщениями интерфейса сайта, создавая ощущение сплоченности.

30. Гитхаб

Фраза «Это не те дроиды, которых вы ищете» относится к джедайскому трюку Оби-Вана Кеноби со штурмовиками в «Звездных войнах. придерживаясь неправильного образа действий. GitHub воспроизводит эту известную строку в своем сообщении об ошибке 404.

31. Патагония
Пользовательская страница 404

Patagonia прекрасно передает атмосферу бренда, дополненная видео-бумерангом вращателя фрисби, умным каламбуром, сочетающим «404» и «алоха», и ссылками на страницы его продуктов.Это дружелюбный и забавный способ приветствовать посетителей, которые оказались не в том месте.

32. Облачная сигма

Смотри: Cloud Sigma рассказывает нам о некоторых закулисных действиях. Их страница с ошибкой 404 претендует на роль «домашней страницы младшего разработчика» — этот младший разработчик, ну, в общем, кот.

33. Театры AMC

Возможно, вы уже были в кинотеатре AMC раньше, но, надеюсь, вы никогда не видели страницу 404 на их веб-сайте. Веб-сайт использует быстрый, забавный и актуальный однострочник, прежде чем отправить вас обратно в нужное место.

34. Бруно

Неслучайно креативные агентства умеют придумывать крутые страницы 404. Вот еще один от креативщиков Bruno, который обыгрывает культовую классическую комедию 2000 года Чувак, где моя тачка? Нет, это не имеет никакого отношения к компании или веб-сайту, но наверняка вызовет смех.

35. НПР

На первый взгляд страница ошибки NPR не кажется чем-то особенным. Но продолжайте читать, и вы увидите, как они умело связывают некоторые из своих замечательных историй о потерянных людях, местах и ​​вещах, например, статью об Амелии Эрхарт и одну статью о Уолдо.Это может просто заставить потерянных пользователей чувствовать себя немного менее одинокими.

36. Средний

Medium использует тот же подход, что и страница 404 NPR, рекомендуя статьи о том, как заблудиться и потерять вещи. Прочтите эти статьи, если у вас есть время — они неплохо читаются.

37. HomeStarRunner

На сайте HomeStarRunner.com, на котором размещен анимационный Flash-мультсериал, на протяжении многих лет была серия забавных страниц с ошибкой 404. Самые последние персонажи из мультсериала представлены в сцене, которая могла появиться прямо из одного из их эпизодов.Если вы включите звук при загрузке страницы, вы услышите, как их персонаж Strong Bad, известный тем, что громко выкрикивает фразы, говорит: «404’d!»

38. Blizzard Entertainment

Вот простая идея, которая в конечном итоге выглядит привлекательно: на странице 404 от Blizzard Entertainment изображен анимированный персонаж, потерявшийся в настоящей метели, и немного юмора, который оценят поклонники World of Warcraft.

39. Привет, большая идея

Краткий обзор экспертов по маркетингу и социальным сетям Веб-сайт Hello Big Idea расскажет вам все, что вам нужно знать о смелом и резком стиле текста.И, конечно же, его страница с ошибкой 404 не является исключением.

40. HubSpot

У нас тоже такое бывает! Это сообщение, которое мы размещаем, чтобы сообщить посетителям нашего сайта о некоторых проблемах с сайтом. Нашей целью было оставаться верным голосу бренда HubSpot, оставаясь как можно более привлекательными, чуткими и полезными.

Превратите страницу ошибки 404 в момент наслаждения

Никто не хочет попасть на страницу 404 — это раздражает и неожиданно. Тем не менее, вы не можете избежать их, поэтому всегда полезно иметь страницу 404, чтобы вернуться на свой сайт.

И, с точки зрения взаимодействия с пользователем, ваша страница 404 должна быть небольшим лежачим полицейским, а не кирпичной стеной. Правильный дизайн может быть разницей между неудачным отказом и возможной конверсией, так почему бы не сделать это забавным?

Примечание редактора: этот пост был первоначально опубликован в декабре 2015 года и обновлен для полноты картины.

Добавить комментарий

Ваш адрес email не будет опубликован.