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

Мануалы
3Нравится
Комментарии
Поделиться
Как креативно оформить 404 страницу: 53 примера для вдохновения

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

Чаще всего пользователи сталкиваются с ошибкой 404, когда кликают на ссылку, которая ведёт на несуществующую страницу. О том, как найти такие ссылки, и что с ними делать, мы рассказали в посте «Как найти битые ссылки на сайте с помощью Netpeak Spider».

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

1. Зачем нужно оформлять страницу с 404 ошибкой

Как я уже сказала, правильно и интересно оформленная 404 страница поможет уменьшить негатив со стороны посетителей. Рассмотрим ещё некоторые причины оформлять неработающие страницы:

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

Основные рекомендации по оформлению 404 страницы:

  1. Визуально она не должна отличаться от общего дизайна → это поможет пользователю понять, что он всё ещё находится в пределах сайта.
  2. Объясните, что произошло, чтобы человек не чувствовал растерянность. Можно предоставить ему меню с кликабельными ссылками на основные разделы сайта, интересные материалы, главную страницу. Также можно разместить поиск по сайту, чтобы посетитель по ключевым словам смог найти то, что ему нужно.
  3. Не бойтесь добавлять креатив и юмор. Так вы сможете произвести хорошее впечатление на пользователя, повысить лояльность и симпатию к своему сайту.

2. Примеры крутых и интересных 404 страниц

Хочу обратить внимание, что следующие примеры соответствуют вышеперечисленным рекомендациям: на страницах есть и удобная навигация, и интересное оформление, и юмор 😊

Fortnite

Пример оформления 404 страницы на сайте Fortnite

Lego

Пример оформления 404 страницы на сайте Lego

Pirate Code

Пример оформления 404 страницы на сайте Pirate Code

Netpeak Software

Пример оформления 404 страницы на сайте Netpeak Software

Zendesk

Пример оформления 404 страницы на сайте Zendesk

GoDaddy

Пример оформления 404 страницы на сайте GoDaddy

FuseLab Creative

Пример оформления 404 страницы на сайте FuseLab Creative

Branded7

Пример оформления 404 страницы на сайте Branded7

NextPage

Пример оформления 404 страницы на сайте NextPage

Designzillas

Пример оформления 404 страницы на сайте Designzillas

Moz

Пример оформления 404 страницы на сайте Moz

Coca-Cola

Пример оформления 404 страницы на сайте Coca-Cola

Profflex

Пример оформления 404 страницы на сайте Profflex

Star Wars

Пример оформления 404 страницы на сайте Star Wars

Phive

Пример оформления 404 страницы на сайте Phive

99designs

Пример оформления 404 страницы на сайте 99designs

PetsBySpotify

Пример оформления 404 страницы на сайте PetsBySpotify

Mobkii

Пример оформления 404 страницы на сайте Mobkii

BigCommerce

Пример оформления 404 страницы на сайте BigCommerce

HubSpot

Пример оформления 404 страницы на сайте HubSpot

Bitly

Пример оформления 404 страницы на сайте Bitly

Kualo

Пример оформления 404 страницы на сайте Kualo

Hugo Ware

Пример оформления 404 страницы на сайте Hugo Ware

The Artery

Пример оформления 404 страницы на сайте The Artery

Solodev

Пример оформления 404 страницы на сайте Solodev

Theory&Practice

Пример оформления 404 страницы на сайте Theory&Practice

Madwell

Пример оформления 404 страницы на сайте Madwell

Wufoo

Пример оформления 404 страницы на сайте Wufoo

Wendy’s

Пример оформления 404 страницы на сайте Wendy’s

Sygic

Пример оформления 404 страницы на сайте Sygic

Creationmuseum

Пример оформления 404 страницы на сайте Creationmuseum

Vintage

Пример оформления 404 страницы на сайте Vintage

Pikabu

Пример оформления 404 страницы на сайте Pikabu

Panoraven

Пример оформления 404 страницы на сайте Panoraven

Dribbble

Пример оформления 404 страницы на сайте Dribbble

Spotify

Пример оформления 404 страницы на сайте Spotify

Eride

Пример оформления 404 страницы на сайте Eride

Blizzard

Пример оформления 404 страницы на сайте Blizzard

Zillow

Пример оформления 404 страницы на сайте Zillow

TwoRobbers

Пример оформления 404 страницы на сайте TwoRobbers

Hakim

Пример оформления 404 страницы на сайте Hakim

Asos

Пример оформления 404 страницы на сайте Asos

Canva

Пример оформления 404 страницы на сайте Canva

Romain Braiser

Пример оформления 404 страницы на сайте Romain Braiser

Docker

Пример оформления 404 страницы на сайте Docker

MSTQ

Пример оформления 404 страницы на сайте MSTQ

Intercom

Пример оформления 404 страницы на сайте Intercom

Jurassic World

Пример оформления 404 страницы на сайте Jurassic World

IKEA

Пример оформления 404 страницы на сайте IKEA

WAZA

Пример оформления 404 страницы на сайте WAZA

Ingrad

Пример оформления 404 страницы на сайте Ingrad

Profibeer

Пример оформления 404 страницы на сайте Profibeer

Синергия

Пример оформления 404 страницы на сайте Синергия


А вы находили интересные и крутые 404 страницы, которые вам запомнились? Буду рада, если поделитесь в комментариях 😊