Картинка ошибка 404 – 50 прикольных страниц ошибки 404

50 прикольных страниц ошибки 404

Хорошая страница ошибки 404 может быть также важна для сайта как и его содержание. С помощью такой страницы вы сможете направить посетителя к нужной вам домашней странице сайта.
Если на вашем сайте или блоге нет такой страницы, возможно вам стоит задуматься о её создании. А для вашего вдохновения тут собрано 50 прикольных и необычных примеров страниц ошибки 404. 
Другие примеры таких страниц вы сможете увидеть в ранее опубликованных подборках Эффективные страницы ошибки 404 и Ошибки 404 — часть вторая.

Сайт Propeller

Иллюстрированная страница ошибки 404 на B3ta

Страница ошибки 404 Cuoma

Забавная страница ошибки 404 на Tinsanity

Сайт  latelategifts

Муха на странице ошибки сайта 24-4 Media

Разорванная бумага на CssTricks

Иллюстрации акул на Renkoo

Плачущий ребенок на iFolderLinks

Мусорная корзина на странице ошибки 404 TurboMilk

Страница ошибки 404 на Zivity

Такая страница ошибки на сайте Soocial

Разноцветные кубики на rush68

Страница ошибки на Ook

Забавный котенок на Github

Так изобразили ошибку на сайте RetardZone

Надпись на футболке на Planetgeek

Кривляющийся мужчина на PatternTap

Простая и забавная страница ошибки 404 на Studentmarket

Иллюстрация на странице ошибки 404 на BrightKite

Страница ошибки 404 на сайте ClearSpring

Иллюстрация девушки на Erotica Challenge

Грустная мордашка на kidmondo

Смешная страница ошибки сайта Funned

Необычная страница ошибки 404 на nickciske

Страница ошибки в стиле ретро на сайте Lileks

Сайт lightpostcreative и его страница ошибки

Стройка на странице ошибки сайта tele2

Яркая страница ошибки 404 на DDZ

Кот в компьютере на Catswhocode

Космос на странице ошибки Abduzeedo

Разыскивается странница на сайте Limpfish

Стильная иллюстрация на Ferdaze

И на  Expansion Broadcast иллюстрированная страница ошибки

Художественная страница ошибки сайта Chrisglass

Страница ошибки на Fuelly

Облака на Zanami

Страница ошибки на Southpark Studios

Страница ошибки сайта Geeksquad

Милый котенок на Centerd

Марио на странице ошибки сайта Dawdle

Смешной монстр на Cartoon Network

Птерозавры на странице ошибки Amorphia Apparel

Такая страница ошибки на Mozilla

Ещё один забавный пример страницы ошибки 404 Jotsai

Смешная страница ошибки на The Brand Surgery

Страница ошибки Mmo Game Zone

На странице ошибки сайта Acorn Creative разместили носок

Автор – hongkiat

Перевод — Дежурка



Комментарии

Оставить ответ

Похожие статьи


Случайные статьи

www.dejurka.ru

10 оригинальных страниц ошибок для сайта

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

Стандартная страница 404 для uCoz легко заменяется на нестандартную, об этом ниже. Эти страницы такие же простые, как и в этом материале.

Установка

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

Каравай, каравай, кого хочешь выбирай…


Весьма интересный вариант в виде объявления.
Скачать



Объемные цифры возникли из пустоты.
Скачать



А это анимированная страница.
Вы станете свидетелем похищения страницы НЛО.
Скачать



Одинокая и грустная луна…
Скачать



А здесь Лох-несское чудовище.
Скачать



Какая-то сказочная страница, не находите?
Скачать



Кулак. Похоже, какого-то зека.
Скачать



Код виден через дыру в сайте.
Скачать



Слыхали легенду о кракене?
Скачать



Ну, и на последок такая вот страница ошибки.
Скачать


Хочется сделать подборку просто оригинальных страниц ошибок 404 (Page not found) на разных сайтах. Если знаете такие страниц, то отправляйте ссылки на них в комментариях. Будет интересно посмотреть, до чего додумались веб-мастера и дизайнеры.

Надеемся, что и наша подборка вам понравилась. Все изображения взяты с открытого источника dribbble.com.

yraaa.ru

Советы по созданию своей ошибки 404

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

404 ошибка — самая часто встречаемая на просторах интернета. А что же означают эти до боли знакомые всем цифры? Первая цифра ­4 указывает на ошибку со стороны клиента, например, плохое соединение или неверно введенный адрес в строку поиска. Другие два числа обозначают конкретную категорию ошибок, которая включает такие статусы, как Conflict, Precondition Failed, Bad Request и другие статусы четвертого класса. Возникновение данной ошибки имеет несколько причин:

  • плохое соединение;
  • ссылка, ведущая на адрес, устарела или была удалена;
  • страницу перенесли на новый адрес;
  • опечатка при вводе адреса сайта.

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

Стандартную страницу с этой ошибкой знают все, выглядит она достаточно устрашающе:

К сожалению, не все посетители знают, из-за чего происходит эта ошибка и первая мысль при появлении этого окна будет: а что мне делать дальше? Я все сломал? Уйду отсюда подобру-поздорову. Даже опытного пользователя это окно может смутить или отпугнуть.

Как удержать посетителя?

Чтобы ошибка не испугала посетителя, объясните ему, что ничего страшного не произошло и нужно лишь перейти в другой раздел сайта. Тактично направьте пользователя к выходу из этого злополучного «тупика».

Существует несколько способов вернуть доверие:

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

  2. Объясните, что произошло. Не обязательно подробно расписывать о происхождении ошибки, составлять длиннющие инструкции. Достаточно обойтись одной или несколькими фразами. Слово «ОШИБКА» совсем необязательное, зачастую лишь больше вгоняет в ступор. Если сайт носит развлекательный характер, можно юморнуть и покреативить. Заставьте улыбнуться гостя, тогда он охотнее вернется на главную страницу. Но обойдемся без юмора ниже пояса и обидных шуточек, давайте уважать наших пользователей.

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

  4. Обязательно добавление фирменного стиля или общих элементов внешнего облика сайта. Слишком сильное различие дизайна ошибки и сайта в целом настораживают. Это наводит пользователя на мысль: а не перешел ли я по какой-то нехорошей ссылке? А не покинул ли я нужный сайт. Наличие логотипа или названия компании обязательны.

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

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

Как у нас

Наша страница с ошибкой 404 выглядит так:

Полностью весь внешний вид оставили в том же стиле, что и сам сайт. Не трогали верхнее меню и подвал, чтобы никого не шокировать резкими переходами. Для удобства вставили ссылки на самые популярные услуги (для клиентов) и основные разделы блога (для просто интересующихся). Обязательно добавили ссылку на главную страницу 1PS и призыв к действию «Напишите нам», чтобы уж точно никто не затерялся. Но! Учтя все технические вопросы, мы забыли про креатив. Уже работаем над этим. В скором будущем и мы обзаведемся привлекательной и забавной страничкой.

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

© 1PS.RU, при полном или частичном копировании материала ссылка на первоисточник обязательна.

Понравилась статья?

71 6

Сожалеем, что не оправдали ваши ожидания ((
Возможно, вам понравятся другие статьи блога.

Понравилось? Поделись!

1ps.ru

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

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

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

Что касается неопытного пользователя, то он, увидев страницу где написано «ошибка» да в подарок к этому ещё и какие-то непонятные цифры, с вероятностью 99,[9]% в панике закроет страницу, браузер, выключит компьютер, вытащит вилку компьютера из розетки, отключит электричество в щитке, соберёт накопленное, сделает пластическую операцию, поменяет имя и переедет на другую планету.

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

Вот пример стандартной страницы ошибки 404:

Скучно, непонятно, скучно.

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

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

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

17.

Студия Олега Чулакова(???). Сайт необычный. А вот этот поток сознания можете считать либо шуткой либо бредом. И не поймешь недокреативили или перекреативили.

16.

Далее уже поднадоевшие образы «пацанчиков с периферии»

15.

А тут пацакчики. К сожалению, не нашел сайт, где это чудо размещается.

14.

На сайте turbomilk.ru решили не «прибивать» подвал к низу странички, однако страница об ошибке у них забавная

13.

Дизайнер Евгений Филатов на своем сайте придается ностальгическим воспоминаниям. Сейчас не очень часто смотрю телевизор, но раньше помню эти полоски по понедельникам. Так же здесь вы можете откалибровать свой монитор.

12.

На lure.com.ua мы видим того самого пользователя и разжёванную инструкцию.

11.

Сайт у «Занами» так себе, но 404 страница отсылает нас мысленно к одному из лучших советских мультиков.

10.

У автомобильного портала autocolo.com на странице ошибки 404 страшное горе: мужик потерял машину, зато научился летать в странной позе. Вот уж не знаешь, где найдешь где потеряешь. А если отвлечься от несчастного летающего мужика на сопроводительный текст, то становится как-то черновато, хотя может они не в том смысле…

9.

А вот отсыл к истокам сетевого сленга.

8.

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

7.

На хабре с обновлением дизайна обновилась и 404 страница. С неё можно попасть на другие ресурсы хабра.

6.

Тут даже неловко стало:

5.

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

4.

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

3.

Многие строительные компании берут на 404 страницу образ гастарбайтеров. У нас в рейтинге таких страниц целых две. Чаще всего на таких сайтах заезжанные Равшан, Джамшут и «Насяльника». Но тут вот интересно. И со звуком.Целый фильм

2.

Нет страницы? Не беда! Поиграй в пэкмана.

1.

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

Вне конкурса работы студии ClickON:

Квартиры->дома->стройка->кран

Компания продает 3D принтеры, а их 404 страницу охраняет вот такой крутой человечек со световым мечом:

Творите.

www.clickon.ru

Как сделать из страницы 404 что-то полезное и интересное: 30 примеров

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


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

Рассмотрим наиболее удачные примеры.


Страница 404 AliExpress

  • Автоматический редирект на главную страницу сайта через 4 секунды.

Страница 404 Amazon

  • Предложение перейти на главную страницу.
  • Есть ссылка на страницу «Собаки Amazon»:

Собаки Amazon

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

Страница 404 Aviasales

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

Страница 404 Blizzard

  • Уместный сарказм.
  • Возможности перейти во все разделы со страницы.

Страница 404 Coca-Cola

  • Возможность перейти на главную страницу.
  • Доступ к разделам компании со страницы (круглая красная кнопка в верхнем правом углу).
  • Подписка на новости компании.

Страница 404 Convert Monster

  • Креативное оформление – молодая красивая девушка с призывом в духе sex sells.
  • Доступ ко всем разделам сайта из футера (его видно при прокрутке вниз).
  • Изображение и призыв к действию меняется каждый раз при обновлении страницы 404:

Sex sells!

Страница 404 Ebay

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

Страница 404 Evernote

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

Страница 404 Facebook

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

Страница 404 Тупичка Гоблина

  • Графическое оформление в духе компьютерных игр конца 90-ых.
  • Анимация на странице – в прорези двери справа появляются красные глаза.
  • Доступ из страницы ко всем разделам сайта.

Страница 404 студии Дениса Каплунова

  • Оказывается адрес неверно введенной страницы.
  • Оригинальный сопроводительный текст.
  • Доступ из страницы к основным разделам сайта.

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

  • Ссылка на акции в теле страницы.
  • Возможность воспользоваться поиском по сайту или выбрать книгу из каталога.

Страница 404 студии Артемия Лебедева

  • Оригинальный сопроводительный текст.
  • Доступ к самым интересным разделам сайта студии.

Страница 404 Новолипецкого металлургического комбината

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

Страница 404 Ozon

  • Оригинальный сопроводительный текст.
  • Доступ к каталогу товаров.
  • Возможность посмотреть все акции и спецпредложения «Озона».

Страница 404 Sotmarket

  • Нетривиально оформленные ссылки на разделы каталога электроники.
  • Кликабельный логотип «Сотмаркет» для перехода на главную страницу сайта.

Страница 404 «Текстерры»

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

Страница 404 банка «Тинькофф»

  • Оригинальный текст со смайликом.
  • Ссылки на основные услуги банка «Тинькофф».

Страница 404 «Викиума»

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

Страница 404 «Яндекса»

  • Возможность воспользоваться поиском 🙂
  • Ссылки на сервисы «Яндекса».
  • Ссылка на установку переключателя раскладки клавиатуры Punto Switcher.
  • Рекламные объявления (!) на странице 404.

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

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

Страница 404 Студии Аниматоров «Кудесник»

  • Рисунок-смайлик недвусмысленно намекает, что произошла досадная ошибка.
  • В описании страницы даются способы решения проблемы, притом оформлены они гиперссылками.
  • Излишнее дублирование информации о том, что страница не найдена.

Страница 404 Lego

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

Страница 404 «Кинопоиска»

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

Если на картинке сверху это был Рон Уизли из «Гарри Поттера», теперь – Хан Соло из «Звездных войн»

Страница 404 творческой мастерской «Штуки»

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

Страница 404 Playboy Russia

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

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

Страница 404 «Единого визового центра»

  • Запоминающаяся картинка-мем с Grumpy Cat.
  • В описании страницы способы решения проблемы выполнены гиперссылками.
  • За присланный на почту скриншот страницы 404 обещают подарок.

Страница 404 Udemy

  • Заголовок страницы мотивирует простить владельцев сайта за попадание на нее.
  • Есть гиперссылка на страницу поддержки. Все серьезно.

Страница 404 Pikabu

  • Скажу просто – на этой странице прекрасно ВСЁ!
  • Что за существо сидит рядом с парнем?

Страница 404 Pixar

  • Более удачный образ, чем Печаль из мультика «Головоломка» для страницы 404 трудно представить.
  • Заголовок страницы «Оооо… Не плачь». Трудно сдержаться, глядя на изображение.
  • Описание страницы написано будто от лица Радости из того же мультфильма:

«Этот всего лишь ошибка 404!

То, что ты ищешь, могло затеряться в долгосрочной памяти».









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

  1. Мгновенный переход на главную страницу: в этом случае человек не поймет, что он ввел неверный адрес или перешел по неработающей ссылке, и может повторить неверный ввод.
  2. Внешний вид страницы
  • с нечитаемыми символами:

Страница 404 с «кракозябрами» – совершенно непонятно, что делать дальше

  • со стандартной и малоинформативной надписью:

Дежурная и неинформативная страница, которая никак не объясняет, что делать дальше

  • дзен-вариант страницы 404 (такой, например, у Школы-студии МХАТ):

Белоснежный пустой фон страницы 404

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

kak-sdelat-iz-stranitsy-404-chto-to-poleznoe-i-interesnoe-primery

texterra.ru

опупенное оформление + 10 примеров

Все, кто хоть раз пользовался интернетом, попадали на страницу “ошибка 404”. И наверняка, видя её у себя на экране, просто брали и уходили с этого сайта.

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

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

Почему она появляется

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

Стандартная ошибка 404

Теперь давайте определимся, почему же посетитель сайте может видеть такую ошибку. А все происходит потому что:

  1. Ссылающаяся сторона совершила ошибку при указывании информации на Вас;
  2. Пользователь неправильно ввёл ссылку;
  3. Страница (ссылка) была удалена;
  4. Страница (ссылка) была изменена.

Ещё раз, если Ваш сайт состоит из 10+ страниц, то скорее всего у Вас уже есть эта ошибка и Вы о ней просто не знаете.

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

Чем грозит

Как Вы поняли, от этого не уйти. Такие коллапсы будут, если не по Вашей вине, то по вине клиентов.

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

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

  1. Уходить с сайта;
  2. Расстраиваться, что не нашли нужную информацию;
  3. Понижать свой уровень доверия к Вам.

И всё это ведёт не просто к отсутствию дополнительных денег, а к убыткам и потерям. Что я могу представить только в плохом сне.

НАС УЖЕ БОЛЕЕ 29 000 чел.
ВКЛЮЧАЙТЕСЬ

Как Сделать такую страницу

Если Вы задались вопросом как сделать страницу ошибки 404, то хочу Вас поздравить, она у Вас уже есть (кроме landing page).

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

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

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

И просто в любое место с новой строки вписать — ErrorDocument 404 http://ВАШ_САЙТ/404.php

Как сделать

Данная ссылка будет являться указанием пути к файлу, который будет показывать Ваш сайт при возникновении ошибки.

Больше ничего не надо, всё очень просто! И если вдруг не хотите расширение .php, то можете сделать .html, в глобальном смысле разницы нет.

Цеплять и продавать

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

В остальном он может преследовать разные задачи. Для этого давайте рассмотрим разные варианты и чем они хороши.

Просто и красиво

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

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

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

Ох, капитан, мы потерялись.
(404. Это не то место, где ты должен быть)
Идти домой Хлоп!
Я стесняюсь…
Извините, Вы попали на “битую” страницу
Свалить отсюда

Ссылки на основные разделы

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

При этом дизайн также важен как и в первом случае. Делайте уклон на оригинальность и юмор.

Упс!
Я стесняюсь…
Мы не можем показать страницу, которую Вы ищите.

Попробуй ещё раз/поиск

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

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

Попробуйте еще раз

Реклама продукта

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

Причём показать Ваш продукт можно даже когда он искал что-то другое. В идеале, не просто показать, но и сделать специальное предложение на него.

Пример рекламы 1 Пример рекламы 2

Интерактив

Чтобы клиент чуть больше провёл на Вашем сайте, и чуть больше повзаимодействовал с ним, можно на данной странице создать “интерактив”, с которым он может что-то поделать, потаскать, покликать, посмотреть или даже поиграть.

Интерактив играИнтерактив видео

Форма захвата

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

Поэтому чтобы его не терять, и чтобы он к вам ещё раз вернулся — нужно взять его контактные данные и добавить в свою e-mail рассылку.

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

Пример формы захвата

Это наш вариант страницы, на который Вы можете легко попасть введя in-scale.ru/любыеслова. Самое интересное, что такого рода ошибок почти нет на просторах интернета.

Поэтому рекомендую сделать акцент именно на этом, если ваш бизнес подразумевает e-mail маркетинг.

Коротко о главном

Ух, я Вам покажу!

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

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

Тут и встаёт вопрос, что нужно Вашему посетителю в тот момент, когда он попал на эту страницу и как его плавно перевести на то, что хотите от него Вы.

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

in-scale.ru

QA Platform Blog — Искусство ошибаться: 32 примера достойных 404 страниц

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

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

Какие еще плюсы может принести такой подход к оформлению ошибок?
Вот перечень большинства из них:

  • Обеспечивает позитивное настроение ваших пользователей
  • Ваш сайт становится запоминающимся
  • Если сделать навигационное меню – это сильно упростит поиск посетителям
  • Шанс показать, на что вы способны
  • Показывает посетителю, что вы заботитесь о нем
  • Производит впечатление
  • Дает возможность поделиться с друзьями

Мы подобрали варианты, когда разработчики сайта ответственно подошли к вопросу.

404-е ошибки отечественного производства

1. www.sombrero.su/404/
Буэнос диас! Очень креативный подход и превосходная реализация на сайте мексиканской кухни.

2. www.profflex.ru/404/
Для чего еще может пригодиться монтажная пена? Конечно, для оформления страницы ошибки.

3. www.designstudy.ru/404/
Очень тематичная иллюстрация – мазки кистей для школы дизайна. Однозначно заслуживает внимания.

4. http://habrahabr.ru/showme404/
Интерактивная солнечная система с юмором и навигацией по сайту. Хабр, как всегда, в своем стиле.

5. http://designfire.ru/404/
Такой страницы нет, как нет и её освещения – приходиться зажигать спичку. Отличный дизайн ошибки, для сайта «с огоньком».

6. http://cpeople.ru/404/
Минимализм выполненный в современном стиле. Еще одна страница в копилку интересных решений.

7. www.motocms.ru/404/
Красиво и со вкусом. Такие страницы вызывают только позитивные эмоции, несмотря на ошибку.

8. www.defa.ru/#404
Стильная страница с высокой содержательностью.

9. www.inclouds.ru/404/
Выполнено в лучших традициях современного дизайна, и что не менее важно, соблюдена общая стилистика сайта.

10. http://turbomilk.ru/404sdfwert
Просто и с юмором. Да и дизайнер поработал на пять с плюсом.

11. http://ifolderlinks.ru/404/
Креативно и остроумно. А также доходчиво и понятно.

404-е ошибки зарубежных сайтов

12. www.bluedaniel.com/404/
Это однозначно шедевр. Станция 404 выше всяких похвал.

13. www.dmcloud.net/404/
Приятная анимированная страничка, хоть и содержание ее дождливо и зябко.

14. www.ipolecat.com/404
Забрел в тупик. Очень символично для рассматриваемой нами темы.

15. http://tix02.be/en/404
Современный дизайн с элементами всеми любимого интрактива – просто прекрасно.

16. http://veerle.duoh.com/404
Красочно и необычно, как раз подходит для такого сайта. Отдельно хочу отметить исполнение навигации.

17. www.bluefountainmedia.com/404/
Вака-вака! Всеми известный PACMAN ждет вас на «ненайденной» странице.

18. http://magnt.com/404/
Элегантно и информативно. Хороший пример, как можно оформлять страницу 404.

19. http://www.titleist.com/404
Забавный вариант странички, с толпой людей ищущих мяч для гольфа.

20. http://trackmaven.com/404
Анимированная история о вырванной страничке книги. Завораживает и заставляет следить за летящими листами.

21. www.edukate.com/404
Похоже, вы сошли с курса… и одинокий корабль в ночи. Отличная задумка и ее реализация.

22. www.randco.com/404
Дизайнер постарался и на славу. Так и хочется осмотреть сайт.

23. www.fork-cms.com/404notfound
Страница канула в морскую пучину. Отличное дизайнерское решение.

24. www.fullscreen.com/404
Модное фото со стильным дизайном – можно использовать как залог успеха.

25. http://saltcitybuilds.com/404
Выполнено в лучших традициях современного дизайна, а еще не забыли анимировать навигацию.

26. http://us.blizzard.com/en-us/error.html
Создатели игр решили отличиться и поздравляют нас с поломкой сайта. Нескучно и круто.

27. http://huwshimi.com/404/
Еще одно отличное сочетание юмора и красоты исполнения. Ниндзя украл эту страницу!

28. http://molo.me/404
Забавная анимация и приятная картинка производят хорошее впечатление.

29. http://hotdot.pro/en/404/
Интерактивные завораживающие цифры не дают оторваться. Выглядит круто.

30. http://mailchimp.com/404/
Что-то есть в этой замороженной обезьяне окутанной льдом.

31. http://becherovka.com/error
Данная страница пропитана элитным алкоголем и обвораживает древностью. Очень элегантное исполнение.

32. http://hakim.se/404
Тебя не должно быть здесь. Оцените задумку – разбудите глаза.

Материал подготовил Юрков Кирилл

blog.qapl.ru

Отправить ответ

avatar
  Подписаться  
Уведомление о