Лучшие примеры страниц ошибок 404
7 271
09 апреля 2018 в 17:05
Многие сайты стараются выполнить абсолютно все страницы красиво и оригинально. Представляем вам подборку из лучших примеров страниц ошибок 404.
Ошибка 404 это страница, появляющаяся при переходе пользователя на несуществующую или удаленную страницу. Такие страницы можно делать очень банальными, ведь на них переходить очень небольшое количество пользователей, а соответсвенно заморачиваться по их поводу особо не стоит. Тем не менее, существуют сайты, на которых эта страница выполнена настолько хорошо, что на неё хочется зайти специально.
#1 — IconFinder
IconFinder это проект на котором вы можете найти сотни тысяч различных картинок и иконок для игр, веб проектов, простого создания фотографий и многое другое.
- Перейти на страницу с ошибкой
#2 — GitHub
GutHub это гигантский ресурс для программистов, куда они могут выгружать свой код и делиться им как со своей командой, так и другими пользователями Интернета.
- Перейти на страницу с ошибкой
#3 — Hoppermagic
Большая веб студия для создания различных проектов на заказ.
- Перейти на страницу с ошибкой
#4 — DanWoodger
Красивый развлекательный веб проект.
- Перейти на страницу с ошибкой
#5 — DropBox
DropBox это сервис облачного хранения данных. Вы можете загружать различные файлы на эту платформу и иметь к ним доступ со всем устройств по всему миру.
- Перейти на страницу с ошибкой
#6 — Bilty
Сайт предназначен для сокращения ссылок. Вставляете большую ссылку и получаете короткую ссылку и плюс трекинг переходов по этой ссылке.
- Перейти на страницу с ошибкой
#7 — BrandCrowd
Портал для приобретения готовых логотипов для использования в ваших проектах.
- Перейти на страницу с ошибкой
#8 — Lego
Официальный веб сайт компании Lego, которая производит конструкторы для детей.
- Перейти на страницу с ошибкой
#9 — Airbnb
Сайт по бронированию домов по всему миру.
- Перейти на страницу с ошибкой
#10 — HotDot
Крупная веб студия по созданию сайтов и веб проектов.
- Перейти на страницу с ошибкой
Страницу 404 не обязательно делать очень красивой, но её обязательно стоит добавлять на все ваши сайты. На нашем сайте тоже есть такая страница, чтобы на неё попасть пропишите в URL некий несуществующий адрес.
Больше интересных новостей
Не хотят брать на работу? 5 частых ошибок при поиске
Топ-7 языков программирования, которые популярны у работодателей в США
10 самых провальных технологических запусков последнего десятилетия
Устанавливаем капчу на свой сайт / Google reCAPTCHA
Лучшие примеры 404 страницы — Блог Admixer Advertising
Главная / Общее / Лучшие примеры 404 страницы
0 + 0 + 0 +
Сегодня 4 апреля.
4.04. Ничего не напоминает? Да, именно это ненавистное страница-не-найдена. И совсем не случайно, именно сегодня — день вебмастера. В честь профессионального праздника мастеров кода мы подготовили подборку креативных дизайнов страницы 404.
1) Bluegg
Решение британского креативного агентства простое и эффективное. Главное, вы сразу понимаете, что попали не туда.
2) B3ta
Слайдшоу из популярных мемов по поводу ошибки 404 — тоже выход. И креативно, и просто в исполнении.
3) Hot Dot Production
А вот и отличный пример, как ошибку 404 можно обыграть в атрибутах бренда, даже если это просто красные точки.
4) zanami.ru
Известные цитаты — тоже могут сыграть на вашу пользу при создании дизайна той-самой-страницы, как показывает кейс российской студии дизайна и разработки.
5) 9Gag
com/embed/9J7tdYltWyXIY» allowfullscreen=»» frameborder=»0″/>Когда что-то не найдено, грех не использовать мем с Траволтой.
6) Arthur MB
Милая и стильная иллюстрация — еще одно отличное решение в дизайне страницы-404.
7) turbomilk.ru
И, напоследок, вдохновляющая речь Ренни Глисона на Ted о том, как заставить 404 страницу работать на вас.
2016-04-04
0 + 0 + 0 +
Предыдущий: 5 вдохновляющих Ted Talks для маркетологов
Следующий: Admixer ищет помощника в отдел контекстной рекламы (вакансия закрыта)
9 лучших страниц с ошибкой 404, которые мы видели
Здесь, в WordStream, наш замечательный разработчик веб-сайта недавно изменил дизайн нашей страницы с ошибкой 404.
Это кажется глупым — зачем тратить время на страницу, на которую мы не хотим, чтобы люди переходили? — но мы все были рады увидеть обновление. Это мило, мило и эффективно перенаправляет потерянного клиента на нашу домашнюю страницу или панель поиска.
Что такое страница ошибки 404?
Обо всем по порядку. Ошибка 404 или Not Found возникает, когда пользователь пытается перейти по мертвой, неработающей или несуществующей ссылке. Вместо того, чтобы обслуживать страницу, которую хотел пользователь, сайт обслуживает страницу с ошибкой 404.
Разработчики веб-сайтов и маркетологи осознают важность захвата каждого посетителя сайта, даже если он попадает на страницу с ошибкой. На самом деле, особенно если они попадут на страницу с ошибкой! Вы не хотите, чтобы ваши посетители покидали ваш сайт из-за сбоя, который может быть вашей ошибкой из-за того, что вы не убрали мертвые ссылки.
Что делает страницу с ошибкой 404 хорошей?
При разработке страницы с ошибкой 404 на своем веб-сайте не забывайте следовать следующим рекомендациям:0016 всегда имеют ссылку, которая перенаправляет пользователя на домашнюю страницу.
Вот несколько наших любимых страниц с ошибкой 404!
1. GitHub
Эта страница с ошибкой кажется трехмерной; когда вы наводите курсор на экран, двойник из «Звездных войн» движется вместе с вами! GitHub также предоставляет удобное место для поиска по сайту или входа в систему.
2. The Onion
В классическом стиле Onion эта страница 404 содержит саркастическое/сатирическое объяснение того, как вы сбились с пути, а также панель поиска для навигации.
3. Slack
Некоторые разработчики из Slack повеселились на этой странице! Анимация перемещается по их «странному месту», показывая свинью и курицу в разных местах, отображая верхнюю и нижнюю панели навигации.
4. Yelp
Если вам нравятся папины шутки так же, как и мне, вам понравится страница ошибок Yelp с детективом Дарвином. В соответствии с передовой практикой любой Yelper может легко уйти с этой страницы на главном экране или с помощью нижней навигации.
5. Hootsuite
Мне особенно нравится страница ошибок Hootsuite из-за очень характерной фразы: «Возможно, вы здесь, потому что: вы искали своего щенка и заблудились». Случается с лучшими из нас.
6. Спотифай
Spotify демонстрирует индивидуальность бренда на этой странице, предоставляя ссылки для перехода на предыдущую страницу, домашнюю страницу и страницу справки.
7. Weemss
В то время как Ларри любит превращать пони в единорогов, Weemss использует другой подход, превращая пони в зомби, когда вы попадаете на их страницу с ошибкой! Более того, они предлагают помочь вам спасти пони… зарегистрировавшись или войдя в их программное обеспечение.
8.
UpWorthyСтоит посетить страницу ошибок UpWorthy, чтобы посмотреть видео, представленное на этой странице. Хотя здесь нет типичной панели поиска или навигации, вместо этого UpWorthy предоставляет некоторую наживку; что, вероятно, как вы попали на сайт в любом случае.
9. WordStream
Лучшее приберегли напоследок! Наш разработчик веб-сайта недавно изменил дизайн этой симпатичной страницы — мы принимаем предложения по названиям рыб.
Какая ВАША любимая страница с ошибкой 404?
Прежде чем комментировать, ознакомьтесь с нашей Политикой комментариев.
Пользовательские страницы 404: основы, идеи дизайна и лучшие примеры
Довольно грустно, когда ты теряешься или введенная ссылка никуда не ведет или не работает (ой! 😲). Итак, страница 404 спешит на помощь. Это место на веб-сайте, где дизайнеры и копирайтеры, наконец, могут позволить себе немного причудливости. Или умный. Или оба. Но есть несколько вещей, о которых нам нужно поговорить.
Что такое страница 404 и как ее настроить?
Давайте разберемся: что это за страница 404? Можно ли легко изменить его в WordPress? И почему это важно?
Страница 404 и легенды
Легенды гласят, что в те темные и мрачные времена, когда интернета не было, в ЦЕРН (Европейская организация ядерных исследований, что в Швейцарии) была комната номер 404. Ярчайшие умы того времени решили создать базу данных для сбора информации о своих исследованиях. Поэтому они назвали это «базой данных 404». Позже он сильно разросся, как всемирная паутина, и, наконец, запутал нас всех.
Хорошая история, правда? Ну, на самом деле 404 — это просто код состояния ответа HTTP, а комнаты 404 никогда не существовало в ЦЕРНе. Все коды, начинающиеся с 4, означают ошибки клиента (а те, которые начинаются с 5, означают ошибки сервера ). Итак, если вы видите ошибку 404, это просто означает, что сервер в порядке, но что-то произошло на стороне браузера — например, он пытается открыть несуществующий URL-адрес.
Страница 404, SEO и UX
Google заявляет, что ошибки 404 не влияют напрямую на SEO-рейтинг сайта. Но есть несколько вещей, которые следует учитывать:
- Если ошибка 404 произошла не из-за того, что пользователь ввел неправильный URL, это не проблема. Но если страница действительно существовала, но позже была перемещена или переименована, это совсем другая история. Если эта страница имеет большой ссылочный (ссылочный) вес, вы потеряете его, если не настроите перенаправление 301, которое автоматически передает этот вес.
- Если на эту страницу ведет много ссылок, вы потеряете весь этот трафик, если не настроите переадресацию 301.
- Если много битых ссылок, они просто тратят краулинговый бюджет поисковых систем.
В заключение, перенаправление необходимо, если страница была перемещена, переименована или удалена.
В остальных случаях (когда посетитель использовал неправильный URL-адрес или разработчик сайта допустил ошибку) может быть по крайней мере три сценария того, что отображать пользователю:
- 404 страница, в которой говорится, что URL ошибается и (вероятно) предлагает вам проверить другие ссылки;
- перенаправление на Домашнюю страницу;
- перенаправление на распродажу или другие страницы, которые вы продвигаете.
Некоторые разработчики используют переадресацию на главную или продвигаемую страницу. Но посетителей это сбивает с толку, потому что они могут не понимать, почему и как они туда попали, и это, скорее всего, заставляет их уходить с сайта с ощущением, что там что-то не так. Таким образом, это плохая практика взаимодействия с пользователем.
Вместо этого вы можете создать классную страницу 404 со ссылками на страницы, которые вы хотите, чтобы пользователи посещали. Это поможет привести их туда, куда вы хотите, и создаст дополнительные внутренние ссылки.
Для некоторых URL-адресов перенаправление 301 может быть лучшим решением, например, когда вы можете угадать, какую страницу люди на самом деле имели в виду — скажем, с yourwebsite.com/shok на yourwebsite.com/shop.
Как настроить страницу 404 в WordPress?
Существует два типа плагинов, которые могут вам понадобиться для вашей страницы ошибок:
- плагины для перенаправления;
- плагинов для настройки шаблона страницы.
Вы можете найти множество бесплатных плагинов для 301 редиректа (или настроить его вручную, изменив файл .htaccess, конечно).
Для настройки дизайна вы можете использовать плагин 404 Page: просто создайте страницу с любимым конструктором, а затем назначьте ее с помощью этого плагина в качестве страницы ошибки.
Pro tip
Если вы являетесь пользователем Crocoblock, вам не нужен этот плагин, потому что вы можете легко сделать это с помощью JetThemeCore.
Также, если вы используете тему, которая поддерживает полное редактирование темы, этот шаблон можно настроить там. В качестве альтернативы, если у вас есть Elementor Pro, вы можете сделать то же самое.
Десять 404 страниц для вашего вдохновения
Mantra Labs и исчезновение
Источник: Mantra Labs Космос — центральная визуальная тема веб-сайта консалтингового агентства, специализирующегося на UX и технологиях. Вот они и используют остроумную фразу «Ой, у вас кончился кислород», когда посетитель немного теряется или случается ошибка.
Самое интересное, что у него есть таймер, который возвращает вас на главную страницу через десять секунд. За это время космонавт удаляется, становится меньше и, наконец, исчезает внутри цифры «0». Гораздо веселее, чем просто сразу куда-то перенаправить, не так ли?
Уэно и несколько версий страницы с ошибкой
Источник: УэноСоздатели контента этого сайта, без сомнения, легенды. Потому что есть как минимум пять версий текста на 404 страницы, так что каждый раз, когда ты там оказываешься, это чистое развлечение. Они рассказывают истории о погоне за дикими гусями, веб-админах в девяностых или просто высмеивают стандартные «заботливые» сообщения большинства компаний. И есть анимация бегущего хот-дога на фоне вращающейся сферы.
Почему это хот-дог и почему он выбегает из петли летающих картинок реальности — еще один вопрос, вызывающий улыбку.
Да, конечно, это сайт агентства. На их сайте полно остроумных текстов, и даже прелоадеры забавны. Это удивительный пример того, как заставить людей дольше оставаться на своих страницах.
Волшебный мир со щепоткой дымохода
Источник: Волшебный мирВо время долгих и утомительных путешествий мне всегда хочется немного дымохода; единственная проблема может заключаться в нехватке дымохода. В любом случае, этот сайт дает нам надежду не только тем, что рассказывает невероятную историю, но и своей страницей 404. Очень просто и прямо в точку.
Alts Digital и внутренние шутки
Источник: Alts DigitalУгадайте, дамы и господа? Да, конечно, это сайт диджитал-агентства. Он использует крупную типографику, множество анимаций (которые, кстати, не глючат и загружаются очень быстро) и не-папины шутки. Большой желтый блок — это ссылка на главную страницу; кроме того, рядом со значком гамбургера есть слово «Ошибка» вместо обычного слова «Меню» на остальных страницах. Анимированный фон соответствует визуальному стилю остальной части сайта. Хорошая работа, вот и все.
Майбру и успокаивающий Боб Росс
Источник: Майбру Если в стрессовой ситуации у вас закончились успокаивающие таблетки, просто начните смотреть видео Боба Росса.
Этот легендарный художник заставил тысячи людей чувствовать себя уверенно, изучая живопись, и убедил их, что практически любую ошибку можно исправить, если проявить немного творчества. Он не боялся делать их сам. Что ж, хватит мудрых слов; просто взгляните на эту страницу с ошибкой на сайте другого (вот еще раз) агентства.
Bluepath и обнадеживающие новости
Источник: BluepathЕсли вам недостаточно Боба Росса, эта страница дает надежду. Это сайт компании из Атланты, которая занимается структурированием и визуализацией данных. Слева вы можете увидеть интерактивную карту города с расположением всех преступлений, совершенных за указанный период. Но стрелка справа заверяет заблудших посетителей, что они в безопасности, но немного в стороне — отличный способ продемонстрировать некоторые навыки даже на странице «не найдено».
Ева Хаберманн и немного драмы
Источник: Ева Хаберманн Это удивительный пример сайта актрисы. Он показывает несколько коротких видеороликов из разных фильмов, в которых принимала участие Ева, рассказывает, чем она занимается, и дает категории на выбор.
Но самое драматичное здесь — страница с ошибкой: нет шапки, просто черный фон, вот это фото и прямое заявление, что я сломал Еву. Бедная она, так что мне лучше вернуться на главную страницу.
Coulee Creative с несколькими фейспалмами
Источник: Coulee CreativeУ этого агентства дизайна и брендинга есть смелое заявление. И фейспалмовый GIF для показа. На самом деле, это соответствует общему дизайну и атмосфере их сайта. Однозначно одобрено!
Готовность к выживанию и времена, когда трава была зеленее
Источник: Ready To Go SurvivalЭтот веб-сайт продает снаряжение и наборы для выживания в чрезвычайных ситуациях и помогает людям подготовиться к ним и развить навыки самообороны, тактики и выживания. Так что даже использование персонажа из старого фильма не кажется неуместным.
Кстати, дизайнерское решение этого сайта очень интересное: используется логотип, который как будто не менялся 20 лет. А в остальном выглядит вполне современно. Вместе с темой, о которой идет речь на сайте, это кажется удивительно применимым.
Trippin нон-стоп
Источник: TrippinTrippin — отличный сайт о туристических направлениях, описанных местными жителями. Очень трудно перестать заниматься серфингом, если вы любите путешествовать. И даже если вы введете неправильный URL-адрес, они все равно не позволят вам уйти и подключиться, чтобы узнать о другом месте назначения. Хорошо, это последняя вдохновляющая 404 в этом списке — я иду планировать новую поездку.
Часто задаваемые вопросы
Что означает ошибка 404? Ошибка
404 означает, что введенный посетителем URL-адрес не существует, но веб-сайт и сервер работают.
Влияют ли ошибки 404 на рейтинг SEO?
Нет, они не влияют напрямую на SEO-рейтинг, если это происходит из-за неправильного URL-адреса, введенного пользователем. Но если страницу переместить или переименовать, вы рискуете потерять ссылочный вес этой страницы. Кроме того, если ошибок 404 много, они используют краулинговый бюджет, а это означает, что боты поисковых систем не будут переиндексировать другие страницы.
