Код 404 – это код ответа сервера, сообщающий об отсутствии страницы по введенному в адресную строку URL. Чтобы о кривом адресе был в курсе не только веб-сервер, но и пользователь, на каждом (по крайне мере, уважающем себя) сайте есть для этого специальная страница. Ее наличие – это обязательное техническое требование, входящее в любой чек-лист по продвижению сайта в поисковиках. Вебмастера ее так и называют – «404-страница».

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

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

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

Условно разделить креативные 404 можно на несколько групп:

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

Муки выбора

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

Так или иначе, топ составили. Он не рейтинговый, мы просто выбрали из всего отсмотренного то, что нам безоговорочно зашло. И да, он на 100% зависел от наших личных предпочтений и не имеет ничего общего с объективным подходом.

Служба доставки еды «Достаевский»

https://dostaevsky.ru/sdfsdf

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

Страхование домашних животных Embrace Pet Insurance

https://www.embracepetinsurance.com/kfgi5

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

Pikabu

https://pikabu.ru/jjfuurn

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

Федерация фигурного катания на коньках России

https://fsrussia.ru/jjjdfurm

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

Веб-агентство Love Beets

https://www.lovebeets.com/jjjkjko

Почему хорошо: Иконки соцсетей – не редкость на 404, но здесь дизайном здорово обыгран «свекольный» нейминг (beet с англ. «свекла»).

Официальный сайт графического редактора Sketch

https://www.sketch.com/dsdsfd

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

Заказ рефератов и курсовых Multi Work


https://multiwork.org/dffdssfd4

Почему хорошо. Наглость – второе счастье. Здесь 404 выполнена как полноценный продающий лендинг. И кстати, весьма на уровне. Интересно, какая у него конверсия?

Хостинг-оператор Kualo

https://www.kualo.co.uk/dmnfsd

Почему хорошо. Во время написания этого материала автор залип на 40 минут на этой странице. Причина – отлично стилизованная игра Space Invaders. Креативно и визуально приятно. Наше почтение.

Агрегатор отзывов Flamp

https://omsk.flamp.ru/404

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

Французские веб-разработчики Romian Braiser

https://www.romainbrasier.fr/sdfdsf

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

Дизайн-студия 99Designs

https://99designs.com/kkkefu

Почему хорошо. Просто классно нарисованный кибер-пес. Чистые эмоции.

Инструменты корпоративного тайм-менеджмента Clockwise

https://www.getclockwise.com/jhhh49

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

KFC

https://www.kfc.ru/jdmfdp

Почему хорошо. Просто и со вкусом. Страница перенаправляет в целевые обе основные аудитории компании: завсегдатаев ресторанов быстрого питания и обжор-домоседов.

Веб-разработчики Amphibian

http://amphibian.com/404/

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

Графический редактор VistaCreate

https://create.vista.com/ru/lsdlkf

Почему хорошо. Стильно, с юмором, присутствует анимация. Эстетично, одним словом.

Разработчики шаблонов для Word Press CSS-Tricks

https://css-tricks.com/fdshhhfsd

Почему хорошо. Страница на 100% соответствует тематике бизнеса, а само решение выглядит очень стильно.

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

https://www.artlebedev.ru/jjdfoiere/

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

Автомобильный журнал «За рулем»

https://www.zr.ru/kksdf/

Почему хорошо. Отлично прослеживается тематика издания.

Интернет-магазин «Читай-город»

https://www.chitai-gorod.ru/sdsdffsd

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

Разработчики игр Blizzard

https://www.blizzard.com/ru-ru/dsffwre

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

Вдохновляйтесь и творите!

404 не обязательно должна быть произведением искусства. С точки зрения сухой технической необходимости хватит просто ее наличия. Но настоящая индивидуальность кроется как раз в мелочах. Почему бы не проявить себя творчески?

А какая 404 из нашего топа зашла вам? Делитесь мнением и ссылками на ваши любимые 404 в комментариях!