Примеры страница 404: Страница не найдена

Содержание

Страница 404 — классные примеры реальных сайтов

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

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

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

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

Как это возможно? Ответ читайте в нашей статье.

Страница с ошибкой 404 – что это?

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

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

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

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

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

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

Почему?

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

Зачем оптимизировать страницу 404?

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

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

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

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

1. Ultimate Guitar Чтобы просмотреть анимацию, откройте исходную страницу.

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

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

Хабиб Курди, старший копирайтер в GetResponse

Главные выводы:

Вовлеченность поддерживается даже без особого текста. Споткнувшийся гитарист или гитарист, потерявший гитару, находят отклик в душе музыкантов, передают вайб, который перекликается с содержанием сайта.
Чудаковатые видео говорят посетителям “эй, нет ничего страшного в том, что вы попали на несуществующую страницу”.
Что насчет текста? Да, он предельно прост и по существу. “Упс” – это стандартное восклицание, которое означает досаду от неудачи. Чуть ниже ссылка на главную страницу (простота навигации), а также ссылка “сообщить о проблеме”. Наконец, 2 cta-кнопки, которые дублируют ссылки выше, но делают их более удобными для клика.

2. Wizarding World Источник

Обычно страницы 404 выбиваются из общей тональности сайта. Страница 404 Wizarding World является исключением.
Вы видите кадр, где Гарри Поттер впервые использует каминную сеть для трансгрессии. В этот раз он вместо Косого переулка оказался внутри мрачной лавки волшебника “Горбин и Бэркес” на малоизвестной улочке.
Изображение полно загадок, которые под силу разгадать истинным фанатам Гарри Поттера. Похожие ребусы можно найти на страницах сайта Wizarding World.

Чуть ниже вопрос-обращение “Бедный, ты заблудился?” Это в духе миссис Уизли: она часто задается похожими вопросами, когда встревожена чем-то. Здесь мы видим ее в центре фотографии в кругу семьи.
Все эти приемы создают эффект погружения, и страница 404 не выделяется из общей атмосферы сайта. Создается впечатление, что пользователь попал сюда не случайно.
Чуть ниже размещена кнопка с призывом “Вернуться в Wizarding World” (“Вернуться в мир волшебства”), что дает двусмысленность: вернуться на основной сайт или вернуться в мир волшебства?

Никола Роза, владелец бизнеса Nikola Roza – SEO for the Poor and Determined

Главные выводы:

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

3. Wendy’s Источник

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

На странице у вас 3 опции: открыть меню Wendy’s, просмотреть доступные вакансии или поиграть в милую игру, стилизованную под Wendy’s, в процессе которой, признаемся, у нас разыгрался аппетит и захотелось отведать наггетсов и картошки фри.
Это далеко не скучная страница 404 – вы ее точно запомните. Она олицетворяет образ компании Wendy’s, которая любит веселье и бургеры.

Ада Дужиньска, эксперт по контент-маркетингу в GetResponse

Главные выводы:

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

4. Omelet Чтобы просмотреть анимацию, откройте исходную страницу.

Это креативное агентство занимается маркетинговыми проектами, и ее проект по созданию собственной страницы 404 оказался очень удачным.
Страница загружается анимацией разбивающегося яйца. Кричаще-красный цвет сообщения привлекает внимание, а игра слов (eggstinct => extinct – “не существует”) делает отсылку к теме яйца (egg – “яйцо”) – обратите внимание на название агентства – Omelet (омлет).
Это слово активно используется в кампаниях контент-маркетинга, где услуги Omelet скромно описываются как eggstinctly brilliant. Сайт Omelet заявляет: “Иногда вам приходится вскрыть (crack open – аналогия с “разбить яйцо”) плохую идею, зажарить ее и подать на блюде с толикой сарказма”.

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

Рональд Самсон, аналитик-исследователь в CreditDonkey

Главные выводы:

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

5. Canva Чтобы просмотреть анимацию, откройте исходную страницу.

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

Ада Дужиньска, эксперт по контент-маркетингу в GetResponse

Главные выводы:

Простота – залог успеха. Но не забывайте про навигацию.
Не бойтесь показать здесь свои самые лучшие стороны (например, дизайн в Canva).
Регулярно обновляйте страницу 404.

6. Slack Чтобы просмотреть анимацию, откройте исходную страницу.

Slack – это платформа для деловой коммуникации, которая хорошо понимает ценность баланса между работой и личной жизнью. Страница 404 прекрасно отражает эту философию. Текст выглядит успокаивающе и направляет в Справочный центр.
Присутствуют также элементы навигации. Но отдельно хочется отметить идиллический анимированный пейзаж. Открывается живописная сцена: летают бабочки, кругом цветы и радуга.
Более того – она интерактивна. Вы можете прокручивать пейзаж слева направо и гладить цыпленка и поросенка, которых встречаете по пути. Это одна из самых успокаивающих страниц 404.

Ада Дужиньска, эксперт по контент-маркетингу в GetResponse

Главные выводы:

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

7. Airtable Источник

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

Том Баррагри, менеджер по продуктовому маркетингу в GetResponse

Главные выводы:

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

8. Ueno Источник

Кто еще мог придумать изобразить бегущий хот-дог, чтобы вызвать у вас удивление и смех? Только Ueno.
Этот хот-дог, в свою очередь, напоминает нам, что техподдержка, скорее всего, так и не получила сообщение с просьбой исправить ошибку на странице. Спасибо за хорошее настроение, Ueno!

Брукс Конкл, владелец BrooksConkle

Главные выводы:

Несуществующая страница расстраивает, поэтому ваша задача – исправить это.
Смех продлевает жизнь – добавьте юмора.

9. Figma Источник

Figma – платформа для графического дизайна и создания прототипов – креативно подошла к дизайну своей страницы 404. На первый взгляд, это стандартная страница с ошибкой 404.
Но если приглядеться, то можно заметить, что цифры 404 можно редактировать. Вы можете бесконечно долго менять их очертание и форму. Даже если вы попали сюда по ошибке, не зная ничего о компании, вы можете наглядно посмотреть, что из себя представляет ее инструмент, играясь с цифрами.
Здесь есть также полоска навигации вверху, откуда вы можете попасть в любой раздел сайта. Черная CTA-кнопка “зарегистрироваться” выделяется на белом лаконичном фоне. Это один из наших любимых примеров того, как познакомить посетителя с фирменным инструментом.

Ада Дужиньска, эксперт по контент-маркетингу в GetResponse

Главные выводы:

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

10. GetResponse Источник

Мы считаем, что это отличный пример качественной страницы 404.
Тон высказывания и внешний вид полностью соответствуют философии бренда. Это проявляется в цветовой схеме, желтом подчеркивании, шрифтах и формулировках текста.
Хотя это страница ошибки, мы хотели, чтобы пользователь покидал ее с улыбкой на лице. Поэтому придумали эту карикатурную картинку, объясняющую, что что-то пошло не так.
Также мы хотели, чтобы пользователи знали, что им делать дальше. Есть ссылка на главную страница и подсказка проверить URL-адрес на предмет опечаток.
В нижней части страницы мы добавили дополнительные разделы, которые делают взаимодействие с этой страницей приятнее (и потенциально увеличивают конверсии). Мы разместили ссылки на лучшие статьи, ссылку на страницу с описанием инструментов платформы, а также на страницу регистрации.
Как еще можно оптимизировать эту страницу? Добавить строку поиска рядом со ссылкой на главную страницу. И хотя эта страница – не самый лучший вариант для повышения конверсий или подписок, мы надеемся, что она делает все, чтобы поднять настроение посетителей.

Михал Лешчиньски, глава отдела контент-маркетинга и партнерств в GetResponse

Главные выводы:

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

11. Lego Источник

Иногда продукта, который вы ищете, больше нет. Конечно, это грустно. И если большинство компаний принимают этот факт и извиняются.
Lego идут другим путем: они убеждают, что переживать не стоит, жизнь по-прежнему прекрасна. Ниже четкий призыв к действию “Приступить к покупкам”.

Ирек Климчак, старший менеджер проектов в отделе контент-маркетинга GetResponse

Главные выводы:

Проявляйте эмпатию.
Помогите посетителю сохранить спокойствие.
Предложите четкое решение.

12. Bouncer Источник

Эту страницу 404 точно не назовешь обычной. После попадания туда мы сразу понимаем, что оказались не в том месте. Горилла – талисман Bouncer – предстает в интимной обстановке, а текст лишь подтверждает наши догадки.
Здесь два призыва к действию:
1) вернуться на главную страницу
2) стать опекуном гориллы при посредничестве Всемирного фонда дикой природы.
Второй призыв визуально более заметный и указывает на приоритеты компании (шутка!).
Чуть ниже ссылки на свежие посты блога на случай, если мы хотим узнать больше о доставляемости писем.
Эта страница соответствует общей тональности сайта.

Радек Качиньски, директор Bouncer.

Главные выводы:

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

13. NASA Источник

У NASA очень красивая профессионально выполненная страница 404. Текст «Космический объект, который вы искали, исчез за горизонтом событий» и фоновое изображение загадочной галактики очень подходят космическому агентству.
Здесь нет уловок, вы можете продолжить просматривать сайт NASA, нажав на ссылки в строке навигации. Никто не пытается заставить вас задержаться на этой странице, однако у создателей получилось привлечь внимание.

Ада Дужиньска, эксперт по контент-маркетингу в GetResponse.

Главные выводы:

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

Время создать страницу 404

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

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

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

А еще есть маркетологи, которые пытаются с помощью этой страницы повысить продажи и конверсию.

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

Если вы в самом начале пути и еще не обзавелись сайтом, советуем прочитать нашу статью.

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

Если вы еще не слышали об этом новом инструменте GetResponse, посмотрите краткую видеоинструкцию.

Лучшие примеры страницы 404 | Как сделать страницу об ошибке интересной и функциональной?

1. ОПРЕДЕЛЕНИЕ ТЕРМИНОВ

1.1. В настоящей Политике конфиденциальности используются следующие термины:

1.1.1. «Администрация сайта» – уполномоченные сотрудники на управления сайтом, действующие от имени ООО «Третий Путь», которые организуют и (или) осуществляет обработку персональных данных, а также определяет цели обработки персональных данных, состав персональных данных, подлежащих обработке, действия (операции), совершаемые с персональными данными.

1.1.2. «Персональные данные» — любая информация, относящаяся прямо или косвенно к определяемому физическому лицу (субъекту персональных данных).

1.1.3. «Обработка персональных данных» — любое действие (операция) или совокупность действий (операций), совершаемых с использованием средств автоматизации или без использования таких средств с персональными данными, включая сбор, запись, систематизацию, накопление, хранение, уточнение (обновление, изменение), извлечение, использование, передачу (распространение, предоставление, доступ), обезличивание, блокирование, удаление, уничтожение персональных данных.

1.1.4. «Конфиденциальность персональных данных» — обязательное для соблюдения Организацией или иным получившим доступ к персональным данным лицом требование не допускать их распространения без согласия субъекта персональных данных или наличия иного законного основания.

1.1.5. «Пользователь сайта (далее Пользователь)» – лицо, имеющее доступ к Сайту, посредством сети Интернет и использующее Сайт Организации.

1. 1.6. «IP-адрес» — уникальный сетевой адрес узла в компьютерной сети, построенной по протоколу IP.

1.1.7. «Cookies» — небольшой фрагмент данных, отправленный веб-сервером и хранимый на компьютере пользователя, который веб-клиент или веб-браузер каждый раз пересылает веб-серверу в HTTP-запросе при попытке открыть страницу соответствующего сайта.

2. ОБЩИЕ ПОЛОЖЕНИЯ

2.1. Порядок ввода в действие и изменения Политики конфиденциальности:

2.1.1. Настоящая Политика конфиденциальности (далее – Политика конфиденциальности) вступает в силу с момента его утверждения приказом Руководителей Организации и действует бессрочно, до замены его новой Политикой конфиденциальности.

2.1.2. Изменения в Политику конфиденциальности вносятся на основании Приказов Руководителей Организации.

2.1.3. Политика конфиденциальности персональных данных действует в отношении информации, которую ООО «Третий Путь» (далее – Организация) являясь владельцем сайтов, находящихся по адресам: 3put. ru, а также их поддоменах (далее – Сайт и/или Сайты), может получить от Пользователя Сайта при заполнении Пользователем любой формы на Сайте Организации. Администрация сайта не контролирует и не несет ответственность за сайты третьих лиц, на которые Пользователь может перейти по ссылкам, доступным на Сайтах.

2.1.4. Администрация сайта не проверяет достоверность персональных данных, предоставляемых Пользователем.

2.2. Порядок получения согласия на обработку персональных данных и их обработки:

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

2. 2.2. В случае несогласия с условиями Политики конфиденциальности и отзывом согласия на обработку персональных данных Пользователь должен направить на адрес эл. почты и/или на почтовый адрес Организации заявление об отзыве согласия на обработку персональных данных.

2.2.3. Согласие Пользователя на использование его персональных данных может храниться в Организации в бумажном и/или электронном виде.

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

2.2.5. Обработка персональных данных Пользователя без их согласия осуществляется в следующих случаях:

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

2.2.6. Кроме персональных данных при посещении Сайта собираются данные, не являющиеся персональными, так как их сбор происходит автоматически веб-сервером, на котором расположен сайт, средствами CMS (системы управления сайтом), скриптами сторонних организаций, установленными на сайте. К данным, собираемым автоматически, относятся: IP адрес и страна его регистрации, имя домена, с которого Пользователь осуществил перехода на сайты организации, переходы посетителей с одной страницы сайта на другую, информация, которую браузер Посетителя предоставляет добровольно при посещении сайта, cookies (куки), фиксируются посещения, иные данные, собираемые счетчиками аналитики сторонних организаций, установленными на сайте. Эти данные носят неперсонифицированный характер и направлены на улучшение обслуживания Пользователя, улучшения удобства использования сайта, анализа посещаемости. Эти данные собираются автоматически, отправку этих данных Пользователь может запретить, отключив cookies (куки) в браузере, в котором открывается сайт.

2.2.7. Порядок обработки персональных данных:

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

3. ПРЕДМЕТ ПОЛИТИКИ КОНФИДЕНЦИАЛЬНОСТИ

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

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

3.2.1. фамилию, имя, отчество Пользователя.

3.2.2. контактный телефон Пользователя.

3.2.3. адрес электронной почты (e-mail).

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

4. ЦЕЛИ СБОРА ПЕРСОНАЛЬНОЙ ИНФОРМАЦИИ ПОЛЬЗОВАТЕЛЯ

4.1. Персональные данные Пользователя Администрация сайта может использовать в целях:

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

4.1.2. Осуществления рекламной деятельности с согласия Пользователя.

4.1.3. Регистрации Пользователя на Сайтах Организации для получения индивидуальных сервисов и услуг.

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

5. СПОСОБЫ И СРОКИ ОБРАБОТКИ ПЕРСОНАЛЬНОЙ ИНФОРМАЦИИ

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

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

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

6. ОБЯЗАТЕЛЬСТВА СТОРОН

6.1. Пользователь обязан:

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

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

6.2. Администрация сайта обязана:

6.2.1. Использовать полученную информацию исключительно для целей, указанных в п. 4 настоящей Политики конфиденциальности.

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

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

6.2.4. Осуществить блокирование и/или удаления персональных данных, относящихся к соответствующему Пользователю, с момента обращения или запроса Пользователя или его законного представителя либо уполномоченного органа по защите прав субъектов персональных.

7. ОТВЕТСТВЕННОСТЬ СТОРОН

7. 1. Администрация сайта, не исполнившая свои обязательства, несёт ответственность в соответствии с действующим законодательством Российской Федерации, за исключением случаев, предусмотренных п.2.5. и 7.2. настоящей Политики

Конфиденциальности.

7.2. В случае утраты или разглашения Конфиденциальной информации Администрация сайта не несёт ответственность, если данная конфиденциальная информация:

7.2.1. Стала публичным достоянием до её утраты или разглашения.

7.2.2. Была получена от третьей стороны до момента её получения Администрацией сайта.

7.2.3. Была разглашена с согласия Пользователя.

8. РАЗРЕШЕНИЕ СПОРОВ

8.1. До обращения в суд с иском по спорам, возникающим из отношений между Пользователем сайта и Администрацией сайта, обязательным является предъявление претензии (письменного предложения о добровольном урегулировании спора).

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

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

8.4. К настоящей Политике конфиденциальности и отношениям между Пользователем и Администрацией сайта применяется действующее законодательство Российской Федерации.

9. ДОПОЛНИТЕЛЬНЫЕ УСЛОВИЯ

9.1. Администрация сайта вправе вносить изменения в настоящую Политику конфиденциальности без согласия Пользователя.

9.2. Новая Политика конфиденциальности вступает в силу с момента ее размещения на Сайте, если иное не предусмотрено новой редакцией Политики конфиденциальности.

9.3. Действующая Политика конфиденциальности размещена на страницах сайтов находящихся по адресам: 3put. ru, а также на их поддоменах.

Копирайтинг для страницы «Ошибка 404» — Студия копирайтера Дениса Каплунова

Что такое ошибка 404Функции страницы 404 ошибка
1. Разъяснительная функцияПродающая функцияРазвлекательная функцияВажные моменты
Исправьте и настройте отслеживание 404 ошибкокПримеры страниц 404 в наших проектах

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

Сайт русский, а страница 404 на английском

Что такое ошибка 404

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

Почти всегда страница с 404 ошибкой — это полупустой экран, непонятная надпись на английском языке «Error 404. Page cannot be found», корявая вёрстка текста и никакой информации, что делать дальше.

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

Варианта развития ситуации два:

Целеустремленный пользователь догадается нажать кнопку «Назад» в браузере или перейти на Главную, если найдет соответствующую ссылку на странице.
Менее опытный (а, может, ленивый) посетитель сайта, вероятнее всего, закроет вкладку решив, что сайт неисправен или взломан. Результат: минус один потенциальный клиент.

Функции страницы 404 ошибка

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

Разъяснительная функция

Объясните посетителю, что произошло, в чём суть ошибки и что теперь делать. Как правило, это текст подобного содержания: «К сожалению, запрашиваемая страница не найдена. Возможно, вы перешли по ссылке, в которой была допущена ошибка, или ресурс был удален. Попробуйте перейти на главную страницу или каталог (список афиш, расписание поездов, популярные товары)». И обязательно сделайте ссылки на соответствующие страницы. Так человек не закроет страницу, потому что ему показали, куда перейти дальше.

Объяснение и подсказка для посетителя

Посетителю предлагается перейти на основной раздел сайта

Не только объяснение и подсказка, но и телефон для связи

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

Продающая функция

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

Сеть магазинов Lego предлагает популярные серии товаров

«Лабиринт» на 404 странице продает бестселлеры

«Аквалого» даёт возможность посмотреть хиты продаж

Развлекательная функция

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

Важные моменты

Title, тем не менее, лучше прописать без креатива: 404 — страница не найдена.

Любая удаленная страница на сайте или несуществующий URL должны отдавать код ответа сервера 404 (Not found) и использовать шаблон, заданный для 404 страницы.

Узнать, какой код ответа сервера отдает любая страница можно с помощью онлайн-сервиса bertal.ru или в Яндекс Вебмастере в разделе Инструменты — Проверка ответа сервера.

Исправьте и настройте отслеживание 404 ошибкок

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

Отлавливать URL, отдающие 404 ошибку, можно с помощью отчетов в Яндекс Метрике, настроив цель на сбор 404 ошибок, и отчетов в Google Analytics, настроив отслеживание через Google Tag Manager. В Яндекс Вебмастере выявить 404 ошибки можно перейдя в раздел Индексирование — Статистика обхода и нажав в правом верхнем углу История обхода.

Расположение 404 ошибок в Яндекс Вебмастере

Далее в фильтре столбца Стало надо выбрать HTTP-код 404 (Not found) и нажать Применить.

Выборка страниц в Яндекс Вебмастерес кодом ответа 404 (Not found)

Полученный список можно выгрузить в формате CSV и XLS при помощи кнопок в правом нижнем углу.

В Google Search Console информация о 404 ошибках находится в разделе Сканирование — Ошибки сканирования — Не найдено. Выгрузить список страниц в формате CSV можно нажав на кнопку Загрузка.

Расположение 404 ошибок в Google Search Console

Хорошим тоном будет разместить призыв отправить отчёт об ошибке. Тогда, особенно если ошибка выдается часто, вы быстро узнаете о проблеме от самих пользователей, получив на почту URL страницы с 404 ошибкой и страницы, с которой человек перешел по «битой» ссылке.

Призыв сообщить о 404 ошибке

Еще один вариант предложения отправить отчет о 404 ошибке

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

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

belcantofund.com

vertum.su

drenazh.su

chopshopsamara.ru

monahotel.ru

rielt-bg63.ru

Нужно эффективное SEO?

Обращайтесь, сделаем, как для себя

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

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

На этом сайте можно найти интерфейс Commodore 64.

Похоже, вам не стоило сюда заходить.

Попробуйте поймать кота 🙂

Студия дизайна делится забавными гифками про собак.

А эта страничка ушла в поход… и не вернулась.

Очень атмосферная интерактивная 404-ая страница.

Веб-страница ищет HTML своей жизни. Желательно без ошибок и вредных привычек.

Спасите несчастных леммингов!

Классический мем на сайте 9GAG.

Красивая иллюстрация броуновского движения от Hot Dot.

А этой страницы на сайте Mikandi нет, как и одежды у этой прекрасной леди.

Вам попалась страница 404? Решайте, кого уволить за такое свинство.

Синий экран смерти от Willismonds.

А эту страницу съели пациенты клиники. Очень сожалеем 🙁

Диаграмма Венна на сайте magnt.com.

Дыра в интернете на сайте CSS Tricks.

Поздравляем. Вы сломали наш сайт.

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

Здесь можно поиграть в пакмана.

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

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

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

Всё минималистично и главное — ссылка на релевантный материал.

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

Вот про экран с ошибкой от GitHub вы точно знаете, а как насчёт не менее известного Docker? Расстроенный кит смотрит на утонувший корабль, параллельно размышляя о ваших проектах.

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

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

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

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

Один из наиболее популярных сервисов общения между членами одной компании тоже вошёл в эту подборку. Ребята хорошо потрудились над созданием интересной и анимированной страницы ошибки 404 с небольшими элементами интерактивности (можно трогать кур и свинок). Также во время отсутствия активности на странице всё становится серым.

На странице 404 сайта Музея Сотворения Мира (там всё по Библии) отчётливо видно, что junior и senior не могут найти менеджера проекта. А вообще классно сделали: силуэт с отсутствующей стадией эволюции в центре отражает отношение создателей сайта к этой теории возникновения жизни. Кроме того, «that link is missing» можно перевести так: «связывающее звено отсутствует». Тут как в русском с фразой «я плачу» — либо платишь (за софт), либо плачешь (из-за багов).

Если вы думали, что новозеландцы не в восторге только от шуток про «Властелина Колец», то теперь вы знаете, что каждый раз, когда вы видите карту без Новой Зеландии, где-то в Шире плачет один хоббит. Собственно, на этом и решили акцентировать внимание новозеландцы на сайте правительства.

Самоиронией может похвастаться не только правительство Новой Зеландии. В Делавэре решили поиграть и с картой, и с названием. Хотя карта просто для красоты.

Мы тоже не исключение 🙂 Возможно, вы уже замечали, что мы, как и сайты выше, имеем собственную страницу 404.

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

Суть ошибки 404

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

Ведущие в пустоту ссылки именуют «сломанными» или «битыми». Появление 404 ошибки может быть по следующим причинам:

посетитель неправильно ввел адрес страницы;
страница на сайте была перемещена или удалена. Так, URL страницы мог быть изменен, но «битая» ссылка сохранилась на сторонних ресурсах или в закладках браузера.

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

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

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

Способы обнаружения ошибки 404

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

Яндекс.Метрика

Отслеживать посещения страниц 404 можно используя «Параметры визитов» в Яндекс.Метрике. Для этого в код счетчика необходимо добавить код «params:windows.yaParams||{ }» в качестве последнего параметра:

Далее, на 404 странице в тег BODY до кода счетчика Яндекс.Метрики необходимо разместить следующий JS-скрипт:

url здесь — это адрес неработающей страницы, а url_referrer — откуда на него пришли.

После внесения данных изменений вы сможете в отчете «Параметры визитов» в Яндекс.Метрике посмотреть полную статистику по посещенным 404 страницам и информацию – с каких страниц на них попадают:

В графе «from» — будут собраны URL, с которых пользователи попали на страницы 404, а в графе «page» — адреса несуществующих страниц.

Google Analytics

Не стоит забывать и про Google Analytics. Для просмотра отчета по посещенным 404 страницам в GA необходимо в момент их полной загрузки отправить данные о посещении. Это можно сделать с помощью следующего кода:

document.referrer здесь – это URL предыдущей страницы, а document.location.pathname + document.location.search — адрес несуществующей), title – передаваемый в GA параметр, задающий название страницы (для последующей фильтрации в отчете).

document.addEventListener(‘DOMContentLoaded’, function(){}) — это аналог функции $(document).ready(function(){}) на jQuery. Если на вашем сайте вы используете JS-фреймворк jQuery – вы можете использовать данную функцию, если нет – используйте пример выше целиком.

Чтобы проверить отработку скрипта и увидеть, сколько пользователей посетили несуществующие страницы – зайдите в отчет «Поведение», «Контент сайта», «Все страницы» в Google Analytics. Фильтр настраивается по названию отсутствующей страницы (параметр title, переданный в GA):

Другие способы

Узнать о несуществующих страницах помогут также инструменты веб-мастеров – Яндекс. Вебмастер и Google Search Console. В Вебмастере нужно открыть: «Индексирование» — «Страницы в поиске» — «Исключенные страницы» и отфильтровать отчет по статусу «ошибка 404».

В Google Search Console это отчет «Покрытие» — «Исключено» — «Не найдено — 404»:

Влияет ли ошибка 404 на индексирование сайта?

Есть мнение, что обилие страниц 404 ухудшает позиции веб-ресурса в поисковой выдаче. Это не совсем так. Само по себе присутствие на сайте URL с 404 кодом ответа не принесет никакого вреда. Об этом даже свидетельствует справка Google:

Однако, существует ряд иных причин, по которым Вам стоит исправить ситуацию. Например, это сохранение ссылочного веса на сайте. Для этого необходимо настроить 301 редирект. Это может быть:

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

Как не стоит оформлять страницу 404

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

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

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

Подытожим всё вышесказанное. Грамотно оформленная страница 404 должна быть:

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

Используемые источники:

https://liderpoiska.ru/blog/stranitsa-404-nie-oshibka-a-pomoshchnik/
https://tproger.ru/devnull/best-404-notfound-pages/
https://promo.altera-media.com/information/expert/404pages/

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

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

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

Mashable

Текст с фото: Плохие новости – мы не смогли найти страницу, которую вы ищете. Хорошие новости – мы наши все ваши потерявшиеся носки.

Template Monster

Текст с фото: Снежный человек, НЛО, хорошие актеры в фильмах Майкла Бэя… сущестование их не доказано. Так же, как и страница, которую вы ищете на TemplateMonster. Но нам кажется, что Вы тут оказались не случайно. Так почему же не вернуться на нашу домашнюю страницу или заглянуть на наш блог? А, кстати, вот Вам прощальный подарочек в виде страницы 404, если вы фанат креативных страниц 404, спешите скачать один из бесплатных шаблонов страниц ошибки 404, созданных нами!

Defrozo

Текст с фото: Нам жаль, но страница расфокусирована.

Diesel

StickerMule

Blue Daniel

dario brozzi

centresource

Текст с фото: Ребята, извините, парковка закрыта! Ваши действия – пойти домой или врезать лосю.

agens

Текст с фото: Похоже, что Вы потерялись в космосе. Может Вы ищете что-то из наших последних проектов?

Tinsanity

MailChimp

Good Dog Design

Текст с фото: Пропала собака! В последний раз видели в желтом кружке заголовка. Черно-белая. Похожа на колли. Отзывается на “good dog”. Отличительные особенности – невероятно быстро разучивает новые трюки и вытаскивает упавших в колодец сирот. Если найдете – вкусно покормите и подкиньте пару ему пару головоломок.

Tripomatic

Текст с фото: Извините, эта страница так и не вернулась из путешествия по пустыне Атакама.

Starbucks

RSQ

Текст с фото: Глубоко скорбим по поводу вашей потери. Ссылка мертва. Соболезнования можно найти на домашней странице RSQ.

Focus Lab

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

Michael Schmid

Текст с фото: Гамбургер! Подождите, что? Да, вот так я отреагировал, когда Вы тут появились. Это страница ошибки 404, тут не на что смотреть. Проходите мимо.

Высоких конверсий!

04-04-2016

Как несуществующую страницу сделать инструментом маркетинга

Есть, есть коммерческий потенциал у notfound-страницы!

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

В чём проблема со страницей 404

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

возврат на предыдущую страницу;
закрытие страницы 404;
закрытие браузера;
попытка поискать товар/информацию в общем поиске и уход на сайт к конкурентам.

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

Чем наполнить страницу 404, чтобы она принесла пользу

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

Итак, давайте посмотрим, что вы можете сказать через страницу 404:

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

Если посетитель попал на страницу 404 сайта глазной клиники «3Z», то ему предлагают записаться на диагностику. Однако эта страница ещё интереснее: игры, таблицы зрения по разным методам, переход на главную.

Сколько всего полезного!

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

3. «Как? Вы ничего не нашли? Тогда посмотрите, что у нас ищут и покупают чаще всего. Вдруг и вам понравится»

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

4. «Упс, что-то пошло не так и не туда. Может быть вам будут полезны эти разделы?»

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

5. «Если вы ничего не нашли, не хмурьтесь, ведь у нас всегда есть чем вас порадовать. Например, сейчас действуют акции и бонусы»

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

6. «Ой-ой, нехорошо, что здесь нет нужной вам информации. Попробуйте ещё раз — 99%, что у вас получится»

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

7. «Тише-тише… Не нужно так расстраиваться. Сыграйте в игру — это поднимет вам настроение»

На сайте компании «Северсталь» вы найдёте отличный материал для кровли, а на странице с ошибкой — игру с котиком. Вы любите котиков? Мы да!

8. «Ого, куда вы попали! Чтобы найти то, что искали, начните с начала. Вот главная — там всё, что вам нужно»

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

Больше пользы от 404

Оформление несуществующей страницы положительно влияет и на другие вещи:

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

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

P. S. Пользователи должны попадать на 404 случайно. Доверяй, но проверяй. Сервисы Google и Яндекс помогут найти битые ссылки. Это бесплатно.

Источник: Sibirix. ru.

Чтобы не пропустить интересную и полезную для вас статью о малом бизнесе, подпишитесь на наш Telegram-канал, страницу в Facebook и канал на «Яндекс.Дзен».
biz360

Как правильно сделать 404 страницу, чтобы клиент не убежал

2596

27.03.2019

Время чтения: 5 минут

Григорий Пащенко

Историческая справка

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

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

Основные задачи хорошей 404

Не испугай!!!
Привлеки внимание и заинтересуй
Покажи маршрут как отсюда выбраться
Дай привилегию посетителю
Грамотно отработай код для SEO

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

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

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

Чеклист для 404 страницы

Сразу отказываемся от технического описания на данной странице.

Рядовому пользователю искренне все равно что там произошло с сайтом и почему он здесь.
Двигаемся от простого к сложному. Обязательно разместите ссылку на главную страницу сайта. Она будет своего рода спасательным кругом для уже почти ушедшего клиента.
Разместите основные контакты: email, телефон и ссылки на группы в социальных сетях. Возможно клиент пожелает связаться с Вами в обход сайта.
Добавьте меню сайта с подразделами, чтобы можно было удобно вернуться в необходимый пункт
Добавьте строку поиска по Вашему сайту. Так посетителю будет намного проще вернутся к товару, который он искал.
Дайте клиенту скидку. Если уж Вы косякнули, то предоставьте пользователю небольшой дисконт 3-5 процентов (можно больше если это возможно). Вы не обеднеете, а человека явно обратит внимание на выгодное предложение. Будьте осторожны, я, ну тот самый который пишет эту статью, всегда чекаю 404 страницы на скидки. Как то так.
Фидбек. Реализуйте функционал, который позволит попавшему в 404 ситуацию посетителю сообщить Вам об этом. Конечно же, может ситуация возникает не с Вашей стороны, но лишний раз перепроверить это точно не повредит.
SEO и 404. Убедитесь, что на сайте отсутствуют ссылки ведущие на 404 страницу. В сети масса бесплатных аудитов, которые могут Вам в этом помочь. Наиболее распространенные и простые конечно же инструменты вебмастера от Яндекса и Google.
Будьте уникальны (опциональный пункт). При возможности постарайтесь сделать интересную, забавную и интерактивную 404 страницу. Это нужно для того, чтобы сарафанное радио захватило как можно большее количество человек, при достижении цели. Потому, что люди охотно делятся уникальными примерами со своими друзьями, а может быть о Вашей 404 напишут в какой-либо статье. Лишняя живая ссылка Вам точно не повредит.

Подведем итог

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

Бонус — наиболее интересные примеры 404 страниц по мнению автора.

Практически все помнят игру Galaxian на приставке денди. Если честно я подзавис на несколько минут играя на данной странице и тем самым немного поправил поведенческие факторы данному сайту. https://www.kualo.co.uk/404

А если Вы наберете не менее 1000 очков, то получите скидку на оплату хостинга.

https://www.orangecoat.com реализовали блок-схему, с вариантами действий при попадании на несуществующую страницу.

https://hakim.se/ зря Вы сюда попали…

https://key-seo.com дает возможность загнать кота в угол. Такой шанс упускать нельзя.

https://klaus.dk назад в 90е.

https://mashable.com играет на ситуации, которая случалась с каждым.

https://www.imdb.com отображает различные цитаты из фильмов переделанные на мотив ошибки 404.

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

Подпишитесь на нашу рассылку

Рекомендуемые статьи

Страницы 404 / Хабр

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

Первая «4» — означает, что ошибка на стороне клиента, «04» — означает конкретную ошибку «Not Found».

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

Коротко рассказываем о гибкой методологии разработки программного обеспечения (Agile), которую мы используем на проектах в EDISON Software Development Centre.

Your browser does not support HTML5 video.

Начнем с самых животрепещущих сайтов, а потом перейдем к «попсовым».

Роскомнадзор

PornHub

Старая версия 404 Хабра

Новая версия 404 Хабра

Virgin.com

Google

YouTube

Facebook

Reddit.com

Amazon.com

Vk.com

Linkedin.com

Imgur.com

Aliexpress.com

Bing.com

Stackoverflow.com

Github.com

Dropbox.com

Craigslist.org

Dribbble.com

Awwwards.com

Csswinner.com

Coolhunting.com

Codyhouse.co

Mailchimp.com

Slack.com

Mashable.

Bloomberg.com

Airbnb.com

Bitly.com

МГУ, психфак

Разговаривающая страница 404.

Еще подборки

, Muzli, 2017

Anatomy of a 404 Error Page, Envato, 2016

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

404 – страницы, ради которых стоит заблудиться на сайте, cossa, 2015

Идеальная страница 404 ошибки, или как удержать пользователя на сайте?, Habrahabr, 2014

Лучшие примеры 404 страницы, seo-design, 2013

Лучшие 404 страницы Рунета, oakhill, 2012

Лучшие примеры ошибки 404, netpeak, 2012

50 прикольных страниц ошибки 404 , Дежурка, 2009

Интерактивные

Играем в Pacman

Рушим сайт

Суслик

Спасаем леммингов

Поймай кота

P.S.

Ну и напоследок

А какая ваша любимая 404 страница?
Какая 404 страница на вашем сайте?

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

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

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

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

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

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

Вот пример:

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

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

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

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

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

Поскольку мы не можем контролировать, кто может отправлять посетителей по неработающим ссылкам в нашем домене, самое лучшее, что мы можем сделать, — настроить отличную страницу ошибки 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.

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

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

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

39. Спотифай

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

40 лучших примеров страниц 404 – Plerdy

Каждая страница в Интернете имеет свой уникальный адрес, который ведет на нее. Если страница была удалена, перемещена или в ее URL-адресе есть ошибка, пользователи будут перенаправлены на страницу 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 взял свой логотип (octocat) и стилизовал его, ссылаясь на «Звездные войны».

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

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

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

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

Crello — сервис для онлайн-редактирования изображений с приятным и забавным дизайном страницы 404.Говорят, страницу украли голуби. Это, наверное, одно из самых креативных объяснений ошибки.

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

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

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

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

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

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

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

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

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

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

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

Компания MentorMate решила использовать простой и проверенный способ – добавить код ошибки к красивой картинке. В данном случае это чашка кофе и цифры, соответствующие цветам сайта.

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

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

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

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

Поклонникам творчества Говарда Филлипса Лавкрафта обязательно понравится страница 404 Хакима. се. Это сайт Хакима Эль Хаттаба, шведского дизайнера и разработчика. Как только пользователи попадают на страницу с ошибкой, на них начинают смотреть десятки ужасающих глаз и пользователям предлагают вернуться на главную страницу.

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

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

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

Создавая страницу 404, команда Sumatosoft решила положиться на свое воображение и чувство юмора. НЛО, который крадет корову… лучший вариант для страницы 404, не так ли?

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

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

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

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

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

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

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

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

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

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

Заключение

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

Эффективные страницы ошибок 404: рекомендации и примеры

Вдохновение Натали Берч • 23 марта 2013 г. • 6 минут ПРОЧИТАТЬ

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

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

Хорошо продуманная структура страниц ошибок

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

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

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

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

Netiko использует нарисованные от руки грубые иллюстрации со скрытым сообщением и заметным пояснительным текстом.

Онлайн-конструктор шаблонов электронной почты

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

La Yogurt привлекает внимание своим спокойным голубым фоном и вкусными иллюстрациями. Кроме того, он обеспечивает четкую систему навигации и выделяющуюся кнопку «Домой».

Ideal Hut очаровывает причудливыми иллюстрациями, которые на самом деле придают динамику за счет использования анимированной красочной «черной дыры».

Soap Media выделяет сообщение о потерянном результате с помощью правильно выполненных иллюстраций.

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

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

Airgid Media Inc идет в ногу с современными тенденциями, интегрируя полноэкранный фотофон, изображающий недоумение и непонимание.

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

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

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

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

Jorgeatgu нарушает монотонность страницы с помощью наклонной типографики и красивой графики.

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

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

UK TV посвящен популярным телесериалам, призывающим вас смотреть онлайн-трансляции.

Red Monkey Goo в основном опирается на свой талисман, основные элементы которого прослеживаются во всем дизайне и пояснительном тексте со стандартным меню навигации.

Angry Birds добавляет индивидуальности, используя популярные сцены и персонажей из игры.

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

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

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

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

Is it WordPress источает образ тьмы только с одним ярким элементом, который играет роль логотипа и домашней обратной ссылки.

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

Ян Джеймс Кокс отмечен тонкой и нежной, слегка скомканной фактурой бумаги с рукописным заголовком и бодрящей фотографией.

Cool Apps имеет сильное внеземное ощущение с яркой, богатой деталями иллюстрацией.

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

Страница не существует… или существует?

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

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

Нравится то, что вы читаете? Подпишитесь на наши главные новости.

Единственные дизайны 404 страниц, которые вам нужны, чтобы вдохновиться

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

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

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

Сообщение об ошибке
Внешний вид бренда
Легкий комический рельеф
Ссылки на ваш лучший контент
Призыв к действию (CTA)

Мы в Simplified собрали наши самые любимые страницы ошибок 404, чтобы вы могли черпать вдохновение.

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

Lego берет плохую ситуацию и превращает ее в возможность. Дизайн страницы 404 соответствует бренду и полезен. То есть CTA страницы перенаправляет пользователей обратно на домашнюю страницу.

Связано: Использование базовой психологии для создания эффективных призывов к действию: упрощенный призыв к действию!

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

Остроумное использование Диснеем самого популярного персонажа для разрушения — Wreck-it Ralph — достойно аплодисментов.Кроме того, они добавили панель поиска, чтобы пользователи оставались на странице.

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

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

Связано: Ваше упрощенное руководство по минималистскому веб-дизайну

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

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

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

Космический юмор, навигационные ссылки и фирменные сообщения — страница 404 НАСА — это именно то, что вы ожидаете.

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

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

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

Связанный: (Добавьте ссылку на часть 2 здесь)

Другие почетные упоминания

1. ГБО

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

3. HomeStarRunner.com

4. Оранжевое покрытие

5. Старые добрые игры (GOG)

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

Страница ошибки 404: определение, обнаружение и примеры выигрыша

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

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

Вредны ли страницы с ошибкой 404 для вашего сайта?

Поскольку роботы Google просматривают ваш веб-сайт, ваша задача — максимально упростить их работу.Один из шагов на пути к «здоровому» веб-сайту — убедиться, что за кулисами нет ошибок. Очевидно, что Google будет сканировать ваш сайт проще и быстрее, если вы настроите или исправите ошибки 404. Кроме того, меньшее количество ошибок повысит вероятность того, что робот Googlebot снова сканирует ваш сайт в ближайшем будущем . Просто потому, что роботы любят удобные для роботов сайты! Чем чаще ваш сайт сканируется, тем больше страниц будет проиндексировано, и пользователи смогут быстрее находить ваш контент в поисковой выдаче.Наконец, пользователи ценят веб-сайт, который не ведет к неработающим внутренним или внешним ссылкам.

С учетом сказанного, наиболее важным шагом является убедиться, что робот Googlebot получает код 404 (настраиваемый или нет). Гэри Иллиес (аналитик тенденций веб-мастеров в Google) заявил в 2015 году, что ошибки 404 не приведут к штрафам.

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

Как обнаружить страницы с ошибкой 404 на моем сайте или с него?

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

Google Search Console – В разделе «сканирование» -> «ошибки сканирования» вы можете найти список внутренних неработающих ссылок (которые Google действительно распознает).
Ahrefs.com — Этот онлайн-инструмент отлично подходит для обнаружения обратных ссылок, но в нем также есть раздел «битые ссылки».Введя доменное имя в URL-адрес, вы можете легко увидеть список исходящих неработающих ссылок на вашем сайте. Учтите, что Ahrefs.com обычно не обнаруживает ВСЕ ошибки 404.

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

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

Если возможно, исправьте неверную ссылку. Если это на вашем собственном сайте, эта задача очень проста. Однако обычно неработающие ссылки будут поступать с внешних веб-сайтов. В этом случае, если у вас хорошие рабочие отношения с ресурсом входящих ссылок, свяжитесь с ними, чтобы исправить это. В противном случае выполните номер два:
Обязательно перенаправляйте (код 301) все неверные URL-адреса.Например, если люди попадают на страницу с ошибкой www.yourwebsite.com/blogg, просто перенаправьте ее на www. yourwebsite.com/blog.
Вам НЕ ОБЯЗАТЕЛЬНО исправлять каждую страницу 404, а иногда это просто невозможно. В этом случае вам следует сосредоточиться на создании пользовательской страницы 404. Пользовательская страница 404 может на самом деле помочь удержать пользователя на вашем сайте, а не нажимать «назад» после поискового запроса Google. Как же так? Выигрышная персонализированная страница 404 будет включать четкое сообщение, призыв к действию и/или возможность поиска.

Посмотрите несколько выигрышных 404 страниц со всего Интернета:

Интерактивные 404s

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

Modcloth 404:

Центр электронной почты Великобритании 404:

Фокуслаб 404:

Панель поиска 404s

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

Твиттер 404:

HowStuffWorks 404:

Верхние звенья 404s

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

HubSpot 404:

линия здоровья 404:

airbnb 404:

Креатив 404s

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

Люди 404:

Американская одежда 404:

Лего 404:

Пиксар 404:

Овес Quaker 404:

дистиллированная 404:

У нас есть место для последнего примера 🙂 Посмотрите, как страница Coolappse 404 привлекает ваше внимание с помощью этого замечательного креатива:

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

Добавьте список самых популярных ссылок на вашем сайте (есть вероятность, что пользователь щелкнет одну из них)
Добавьте привлекательную графику/объявления, чтобы пользователь захотел исследовать дальше
Добавьте панель поиска, чтобы пользователь мог искать исходный контент, который он ожидал увидеть. Даже если не найдут — велик шанс, что попадут на другую похожую страницу.
Pro 404 страницы — создание интерактивной страницы, которая в большинстве случаев побуждает пользователя нажать кнопку призыва к действию

Куда загрузить пользовательскую страницу ошибки 404?
Итак, теперь, когда вы получили вдохновение, мы объясним технический процесс загрузки пользовательской страницы ошибки. Первый шаг — найти, где находится страница 404.Расположение зависит от CMS. Если у вас сайт на WordPress, в файлах темы должен быть файл 404.php. Вы можете получить к нему доступ непосредственно со своего сервера или из панели администратора wp (если у вас есть доступ администратора) и отредактировать файл по своему усмотрению с помощью HTML или PHP. Если на вашем сайте используется другой тип CMS, он может находиться в другой папке, но вам следует искать его в файлах темы. Имя файла, вероятно, будет содержать «404».
После того, как вы загрузили настроенную страницу 404, перейдите на несуществующую страницу или www. yourwebsite.com/404 и убедитесь, что новая страница активна. Если вы по-прежнему не видите его, мы рекомендуем связаться с веб-мастером или системными администраторами и попросить дополнительную помощь.
Вопросы?
Если у вас есть какие-либо вопросы относительно важности убедительной страницы с ошибкой или того, как она может помочь удержать пользователей на вашем сайте, не стесняйтесь обращаться к экспертам по SEO компании yellowHEAD!
Удачи!
7 примеров включения страниц с ошибкой 404
Креативные подходы к более позитивному извинению
Работая над рядом веб-проектов на протяжении многих лет, я до сих пор получаю отличные примеры дизайна страницы 404, присланные мне бывшими членами моей команды.
Почему? Хорошо спроектированная страница 404 может стать возможностью для создания вашего бренда, когда у вашего пользователя что-то пойдет не так, и я пытаюсь привлечь их во все веб-проекты, над которыми работаю.
Если вы не веб-мастер, вы можете не знать, что такое ошибка 404, хотя наверняка видели ее! С технической точки зрения Википедия описывает это как «Сообщение об ошибке 404 или Not Found — это стандартный код ответа HTTP, указывающий, что клиент смог связаться с сервером, но сервер не смог найти то, что было запрошено».
Ваши пользователи будут описывать это, цитируя отличное выступление Ренни Глисона на TED, как «пощечину, ….. вы чувствуете, что провалились сквозь трещины»
Страницы 404 могут быть пропущены при веб-сборке, редизайне или общих веб-обновлениях, и это возможность упущена, если страница вашей компании раздражает и бесполезна для конечного пользователя. Да, возможно, у вас никогда не будет устаревших страниц, и да, кто-то может просто неправильно ввести ссылку, или ему может быть отправлена неправильная ссылка.
Посмотрите на страницу 404 веб-сайта вашей компании. Можете ли вы улучшить взаимодействие с пользователем и помочь своим пользователям?
. Наиболее важно создать процесс и отчеты для регулярного просмотра ошибок 404 в аналитике или с помощью инструментов Google для веб-мастеров, чтобы свести к минимуму количество ошибок 404. Но некоторые из них будут неизбежны, поэтому убедитесь, что они не являются просто блокпостом «Не найдено» черным по белому.
Советы для вашей страницы 404 и несколько отличных примеров в действии
Пусть ваш бренд сияет через и сохраняет опыт вашего основного сайта в дизайне 404, и не забывайте, чтобы копия соответствовала тону голоса вашего бренда.
Не вините пользователя, вам нужна копия, в которой говорится: «Что-то пошло не так, мы разбираемся»
Перенаправьте пользователя обратно на ваш сайт под номером . Это возможность указать ему полезное направление. Добавьте номер горячей линии, форму запроса поддержки, популярные веб-страницы или категории продуктов, не бойтесь продвигать свои продукты или даже демонстрационные страницы.
Добавьте немного юмора и сделайте его забавным, а также привлеките представителей бизнеса, чтобы продемонстрировать свои таланты.
Добавить носитель. Из всех 404-х, которые я нахожу, мне больше всего нравится The Rolling Stones – « не всегда можно получить то, что ты хочешь, но если ты попробуешь иногда, ты можешь найти то, что тебе нужно». Замечательный дизайн страницы 404 со ссылкой непосредственно на видео на YouTube .
В качестве последнего совета для малых предприятий, Инструменты Google для веб-мастеров предоставляют код Javascript, который вы можете добавить на свою страницу «Не найдено», чтобы автоматически предлагать пользователю ближайшую страницу или поощрять поиск — см. https://support.google.com/ webmasters/answer/136085 для получения подробной информации.
21 пример для вдохновения
Страница с ошибкой 404 – это та страница, на которую посетители вашего веб-сайта не должны сталкиваться. Особенно, когда они только знакомятся с вашим брендом.
Хотя полностью предотвратить это невозможно, вы можете сделать так, чтобы ваша страница 404 не создавала у них плохого впечатления о вашем бизнесе.
Еще лучше? Ваша страница с ошибкой может оставить вашу аудиторию с улыбкой и уверенностью, что они, в конце концов, в нужном месте.
Как это возможно? Это вы узнаете из этой статьи.
Ниже мы представляем некоторые из самых интересных страниц 404, которые мы видели в Интернете , а также комментариев экспертов от коллег-маркетологов , к которым мы обратились за помощью.
Но сначала давайте прольем свет на то, что такое 404 страницы.
Содержание
Что такое страница 404?
Страница 404 — это веб-страница, которую видят пользователи, когда их запрос вызывает ошибку 404 — код состояния HTTP, указывающий, что страница, которую они пытались открыть, не может быть найдена на сервере.
Чаще всего пользователи видят страницы 404, потому что либо ввели неправильный URL-адрес, либо нажали неработающую ссылку, которая ведет на несуществующую страницу. Другой причиной этого может быть то, что владелец веб-сайта решил удалить страницу или переместил ее в другое место, но забыл перенаправить ее на новый URL-адрес.
Пример стандартной страницы ошибки 404
В то время как большинство страниц 404 просто информируют пользователей о том, что контент, который они ищут, не может быть найден, многие маркетологи предпочитают делать свои страницы с ошибками забавными и приятными для посещения.
Тем не менее, давайте теперь посмотрим на некоторые из этих замечательных примеров веб-страниц 404, а также на некоторые идеи маркетологов, которые их рассмотрели. Как вы скоро увидите, все они направлены на то, чтобы изменить плохое качество обслуживания клиентов и вернуть потерянных посетителей с помощью некоторых творческих, забавных и вдохновляющих тактик.
Знаете ли вы? С помощью бесплатного конструктора сайтов GetResponse вы можете создать страницу 404 и целый веб-сайт! Он поставляется с готовыми шаблонами и мастером искусственного интеллекта, который создаст для вас целый сайт за считанные клики. Посмотрите это короткое видео, чтобы узнать больше об этом инструменте и начать создавать собственные страницы 404 уже сегодня.

Впечатляющие страницы 404 и что делает их замечательными
1. Пример 404 страницы: Ultimate Guitar
Чтобы просмотреть анимацию, перейдите на исходную страницу.
Лучшая часть их страниц 404 — это визуализация, которая идеально сочетается с веб-сайтом.
На веб-сайте публикуются ноты и ноты (письменные формы обучения игре песен) либо в виде экспертной документации и нотной записи, либо в виде материалов, предоставленных пользователями. Все они доступны для просмотра, поэтому пользователь может увидеть, какой из них считается высококачественным, и оставить свой отзыв о точности (или неточности).
У них есть надстройки премиум-класса, чтобы увидеть больше экспертного контента, включая видеоролики с практическими рекомендациями и пошаговые руководства, даже «официальные» вкладки, чтобы пользователь мог буквально узнать, как звучит определенная песня (или инструмент в песня) играет.
Их 404 страницы чередуются, от парня, играющего на гитаре и спрыгивающего с усилителя, чтобы выглядеть круто (и падающего), до другого гитариста, пытающегося хвастаться, размахивая гитарой на шее и заставляя ее улететь со сцены (и, вероятно, разбиться ).
Хабеаб Курди, старший копирайтер GetResponse
Основные выводы:
Они сохраняют привлекательность, не полагаясь на текст. Когда гитарист пытается выглядеть круто, но спотыкается и падает на землю или теряет свою гитару, это находит отклик у музыкантов и демонстрирует веселую, вовлеченную атмосферу, соответствующую веб-сайту и музыкантам (по большей части).
Причудливость видео позволяет пользователям понять, что нет ничего страшного в том, что они перешли не на ту страницу или на неработающую страницу. Да, вы хотите выучить новую песню (для себя, чтобы выглядеть круто или и то, и другое). Но музыка сложна, круто выглядеть сложно, делать и то, и другое тоже довольно сложно, так что не бойтесь упасть или потерпеть неудачу. Просто вставай и продолжай качаться!
Об этой копии. Это просто и по делу. Ой! является классической линией. Затем они дают ссылку для возврата на домашнюю страницу (удобная навигация), а также ссылку «сообщить о проблеме» на случай, если что-то не работает.Наконец, они дают вам два CTA, которые повторяют ссылки в приведенной выше копии, но дают пользователю очень простой способ, чтобы любой мог просто перейти прямо туда, куда он хочет попасть.
2. Пример страницы 404: Wizarding World
404 страницы обычно нарушают погружение в опыт сайта. Странице 404 из Wizarding World удается сохранить ее – и весьма мастерски.
Во-первых, есть изображение того, как Гарри впервые использует каминную сеть для путешествий. Это время, когда он заблудился и вместо того, чтобы приземлиться в Косом переулке, оказался в магазине темного волшебника (Борджин и Беркс) на какой-то тенистой улочке.
Это изображение полно подсказок для истинных фанатов Гарри Поттера, таких, как, скорее всего, можно найти на сайте Wizarding World.
Во-вторых, внизу есть вопрос, который гласит «О, дорогой, ты заблудился?» «О, Боже!» это то, что миссис Уизли часто говорит, когда она чем-то обеспокоена и чем-то озабочена, и, конечно же, миссис Уизли находится в центре этого изображения, в сопровождении большей части своей семьи.
Таким образом, впечатление от погружения сохраняется, и эта страница 404 выглядит почти как неотъемлемая часть сайта, как будто пользователь должен там находиться.
Наконец, внизу есть кнопка с надписью «Назад в волшебный мир». По иронии судьбы, это немного нарушает погружение, потому что кажется, что нахождение на этой странице похоже на то, что вы застряли в мире магглов.
Что, как я описал выше, совсем не похоже на это 🙂
Никола Роза, владелец Никола Роза — SEO для бедных и решительных
Ключевые выводы:
Сделайте страницу 404 максимально иммерсивной
Сделайте ее фирменной
Убедитесь, что она интуитивно понятна и ее легко покинуть с помощью кнопки
3.Пример страницы 404: Wendy’s
Вместо того, чтобы прибегать к общему дизайну и тексту 404, страница 404 международной сети быстрого питания демонстрирует индивидуальность своего бренда в полной мере. Копия полна каламбуров с едой, тонко напоминающих пользователю, что гамбургеры Венди свежие. На сайте есть три варианта: просмотреть меню Венди, найти работу или остаться и сыграть в милую и простую игру-платформер на тему Венди, которая, признаюсь, заставила меня хотеть наггетсов и картофеля фри. Это не скучная страница 404 — она запоминающаяся и прекрасный пример того, как бренд любит веселиться и есть гамбургеры.
Ада Дуржинска, специалист по контент-маркетингу GetResponse
Ключевые выводы:
Подчеркните индивидуальность вашего бренда в каждом уголке вашего веб-сайта
Хотя встреча с ошибкой 404 может разочаровывать, это не обязательно
4. Пример страницы 404: Omelet
Для просмотра анимации посетите исходную страницу
Хотя это креативное агентство лучше всего можно описать как ориентированное на маркетинг, его последний проект дизайна веб-сайта был особенно умным.Он выпустил страницу, на которой автоматически появляется ярко-красное предупреждение со словами «эта страница содержит яйца», когда анимированное яйцо трескается по экрану, привлекая внимание к выбору слова. Ярко-красный, цвет предупреждений, означает, что это важное уведомление, а тема яйца гармонирует с названием Omlet.
Это сообщение также используется в кампаниях контент-маркетинга, когда Omlet придумала фразу «яично-блестящий» для описания своих услуг. На веб-сайте креативного агентства говорится: «Иногда вам нужно взломать плохую идею, поджарить ее и подать с ноткой сарказма.»Похоже, Omlet – это необычное креативное агентство. Они берут обычную вещь или ситуацию и переворачивают ее с ног на голову, чтобы создать по-настоящему веселые кампании, призванные заставить людей задуматься (и посмеяться).
Рональд Самсон, аналитик-исследователь в CreditDonkey
Ключевые выводы:
Подберите тон к остальной части вашего веб-сайта
Сделайте его интересным и привлекательным
5. Пример страницы 404: Canva
Чтобы просмотреть анимацию, перейдите на исходную страницу.
Canva — это платформа для графического дизайна, и их страница 404 очень проста, но весьма привлекательна. Когда вы сталкиваетесь с этим сайтом, вы можете либо перейти на домашнюю страницу, либо остаться и сыграть в головоломку. И когда вы играете, вы вспоминаете, что делает Canva отличным инструментом — их шаблоны и красивые дизайны, которые вы можете создавать с их помощью. Хотя эта страница 404 не предназначена для конверсии, она делает ее интересной и увлекательной. Его простота устраняет дилемму «куда двигаться дальше» и позволяет легко вернуться на главную страницу и продолжить разработку. Что мне здесь не нравится, так это немного скучный текст и отсутствие навигации.Также кажется, что страница давно не обновлялась, возможно, с более современным дизайном.
Ада Дужинская, специалист по контент-маркетингу GetResponse
Ключевые выводы:
Чем проще страница 404, тем лучше, но не забывайте о навигации
Не бойтесь демонстрировать свои сильные стороны на странице 404
Не забывайте время от времени обновлять страницу 404
6.
Пример страницы 404: Slack
Slack – это платформа для делового общения, которая понимает необходимость баланса в жизни. Вот почему их 404 — прекрасный пример того, за что они борются. Копия на этой странице звучит спокойно и утешительно и перенаправляет вас в Справочный центр. На этой странице также есть обычные разделы навигации. Но что здесь выделяется, так это идиллический анимированный пейзаж на заднем плане. Это живописная сцена, наполненная бабочками, цветами и радугой.Более того — он интерактивен. Вы можете исследовать сцену слева направо и «гладить» цыплят и поросят, с которыми вы сталкиваетесь. Это определенно одна из самых успокаивающих страниц с ошибкой 404.
Ада Дуржинска, специалист по контент-маркетингу GetResponse
Ключевые выводы:
Обеспечьте удобную навигацию на странице с ошибкой 404
Если возможно, протяните руку помощи и предложите решения или перенаправьте на свою страницу справки тон в сообщении об ошибке
7.
Пример страницы 404: Airtable Источник
В мире, помешанном на прокрутке, нижний колонтитул вашего веб-сайта является главной недвижимостью.
Мне нравится, что Airtable не стала заново изобретать колесо со своими страницами 404 и придерживалась навигации, которая, как они знают, знакома их клиентам/посетителям веб-сайта. Предложение своим клиентам возможности поговорить напрямую с кем-то — идеальный CTA для «потерянных пользователей». Предлагая фронтальную и центральную поддержку , вы устраняете любой негатив, возникающий в процессе дезориентации клиента.
Том Баррагри, менеджер по маркетингу продуктов GetResponse
Основные выводы:
Правильное использование навигации в нижнем колонтитуле
Четкие и действенные CTA для следующего шага
Предложение: было бы здорово предложить более релевантные предложения на основе последней страницы, которую пользователь посетил
8.
Пример страницы 404: Ueno Источник
Нет ничего лучше бегущего хот-дога, который заставит вас задуматься! Уэно беззаботно развлекается, чтобы указать вам правильное направление.И этот хот-дог напоминает нам, что веб-мастера, вероятно, так и не получили записку, чтобы исправить страницу. Спасибо за смех, Уэно!
Брукс Конкл, владелец BrooksConkle
Ключевые выводы:
Попадание на неправильную страницу может вызвать разочарование, поэтому сделайте все возможное, чтобы изменить ситуацию
Юмор всегда побеждает
9. Пример страницы 404: Figma
Источник
Figma, платформа для графического дизайна и прототипирования, творчески подошла к разработке своей страницы 404.Когда вы вводите 404, это выглядит как обычная страница ошибки. Но числа 404 представляют собой полностью редактируемую векторную графику, и вы можете часами проводить на этом сайте, настраивая их форму и внешний вид. Даже если вы зашли сюда случайно, ничего не зная о компании, вы все равно сможете понять, для чего нужен инструмент, взаимодействуя со страницей. Вверху также есть обычная панель навигации, которая приведет вас в любое место на сайте. Черная кнопка призыва к действию «зарегистрироваться» выделяется на этом простом белом дизайне страницы.Этот пример страницы с ошибкой 404 — один из моих любимых, потому что он хорошо показывает, что представляет собой их инструмент.
Ада Дуржинска, специалист по контент-маркетингу GetResponse
Ключевые выводы:
Представьте, что страница 404 — это первое знакомство пользователя с вашим брендом. Возможно, вы сможете креативно представить здесь свой продукт или услугу
10. Пример страницы 404: Seer Interactive
Источник
Мне нравится эта страница 404, потому что она уникальна и не похожа на обычные.
У него броский заголовок, который побуждает любого, кто наткнется на страницу, остановиться и просмотреть информацию на ней.
Также есть призыв к действию, предлагающий читателю либо сразу искать нужную информацию с помощью строки поиска, либо использовать меню навигации в шапке сайта.
Они также тонко продвигают свою страницу сообщества, которая подчеркивает, как они отдают себя как компания.
АбдулГани Шеху, ведущий контент-стратег Your Content Mart
Ключевые выводы:
Не бойтесь пробовать что-то новое.
Вы можете перенаправить читателей на другую ключевую страницу вашего веб-сайта со страниц 404
Используйте стратегический подход к своим страницам 404, сообщая читателям о других способах поиска информации, которую они ищут (например, через панель поиска)
11. Пример страницы 404: Nextiva
Наша команда разработчиков действительно потратила время на создание интерактивной страницы 404. Я всегда ловлю себя на том, что смотрю на это несколько секунд, потому что на это интересно смотреть, и я ценю работу. Именно такие мелочи выделяют наш бренд.
Девин Пикелл, менеджер по маркетингу роста в Nextiva
Ключевые выводы:
Не бойтесь сделать страницу 404 интересной
Ваша страница 404 может отражать голос вашего бренда
Если возможно, включите интерактивность
12. Пример страницы 404: Zillow
Онлайн-рынок недвижимости Zillow заставляет вас чувствовать себя как дома на странице 404.Анимация кота, целенаправленно опрокидывающего растение, в сочетании с «Ой, что-то сломалось» одновременно веселая и милая. Это просто и позволяет вам вернуться на домашнюю страницу (или перейти в любое место на их сайте с помощью панели навигации). Самое замечательное в этом то, что вместо того, чтобы расстраиваться из-за того, что страница не найдена, она вызывает искреннюю улыбку на вашем лице.
Ада Дужинская, специалист по контент-маркетингу GetResponse
Ключевые выводы:
Не бойтесь быть более непринужденным на странице 404. На самом деле, это та страница, где вы можете больше всего продемонстрировать веселую и остроумную сторону своего бренда!
Опять же, ключ к простоте
13. Пример страницы 404: Mailtrap
Когда посетитель веб-сайта ищет определенную страницу и ошибается, мы показываем ему нашу страницу 404. На этой странице мы пытаемся сконцентрировать внимание на четком призыве к действию — вернуться на главную страницу. В то же время, если пользователь искал конкретную страницу/функцию — он мог найти ответ в нашем Справочном центре.Предоставление двух вариантов — отличная идея для восстановления потерянных посетителей сайта. Кроме того, мы записываем ошибочные URL-адреса. Для нас это один из каналов обратной связи, иногда это может быть сигналом для вас, что посетители ищут/ожидают увидеть на вашем сайте.
Андрей Записоцкий, менеджер по развитию Mailtrap
Ключевые выводы:
Дайте краткое и краткое объяснение того, что пошло не так
Объясните возможные причины проблемы
Добавьте четкий призыв к действию на главную страницу
Предложите возможность посетить Справочный центр, чтобы получить дополнительную информацию о продукте
Используйте страницу 404 как канал обратной связи и отслеживайте неработающие ссылки
14.
Пример страницы 404: Templatemonster Источник
На странице TemplateMonster 404 изображен талисман их бренда, чтобы он оставался узнаваемым. Это также отвлекает посетителей от нежелательной ситуации, демонстрируя часть индивидуальности компании. Кроме того, эти иллюстрации лучше всего делают страницу 404 остроумной без лишних слов.
Короткая, но лаконичная копия с внутренней ссылкой побуждает посетителя вместо этого перейти на другие страницы сайта. Это дает понять, что страница 404 не является для них тупиком, поэтому они могут продолжить свой путь.Следовательно, это помогает снизить показатель отказов и несвоевременный уход с сайта. В целом, дизайн прост, прямолинеен и позволяет избежать чрезмерных шуток.
Андре Оэнторо, генеральный директор и основатель Breadnbeyond
Ключевые выводы:
Обеспечьте удобную навигацию на главную страницу.
Используйте иллюстрации, чтобы исключить необходимость использования технического жаргона и сделать страницу удобной для глаз. эта страница 404
15.Пример страницы 404: Giphy
Поисковая система GIF GIPHY приветствует вас на своей странице 404 с тем, что я бы назвал крутым, но грустным ковбойским 3D-смайликом. Они могли бы оставить все как есть, но они дополняют это обнадеживающим текстом и бесконечным запасом популярных GIF-файлов. Так что, даже если вам грустно, что GIF, который вы искали, не существует, вам не нужно никуда идти, чтобы по-прежнему наслаждаться тысячами творений на GIPHY. Это очень полезно и удобно для пользователя. Также есть панель поиска и кнопка, которая перенаправляет вас на домашнюю страницу.На странице нет сообщения «Ошибка 404», но это и не обязательно – этого достаточно, чтобы понять, где мы находимся и что происходит.
Ада Дужинская, специалист по контент-маркетингу GetResponse
Ключевые выводы:
Страница 404 не обязательно должна быть тупиковой. Делайте страницу полезной, предлагая решения проблемы, которую пользователь может решить здесь
16.
Пример страницы 404: Bouncer Источник
Эта страница 404 точно не обычная.
Когда мы приземляемся там, мы сразу понимаем, что находимся не в том месте.
Талисман Вышибалы представляет себя в довольно интимной ситуации, и с забавным поворотом , который сообщает нам об этом.
Затем нам представляются два призыва к действию:
1) Вернуться на главную страницу
2) Подчеркнутый, более великой цели – усыновить гориллу с WWF
Затем, ниже fold, Bouncer предоставляет ссылки на свои последние сообщения в блоге на случай, если мы захотим потратить некоторое время и узнать больше о доставляемости электронной почты.
Все это определенно соответствует брендингу и тону голоса Вышибалы.
— Радек Качински, генеральный директор Bouncer
Ключевые выводы:
Четко призывайте к действию
Мыслите нестандартно, т.е. предложите поддержку для более важного дела
Используйте талисман своего бренда, чтобы сделать страницу и ваш бренд более человечными
Сопоставьте свою страницу 404 с тоном и голосом вашего бренда
Используйте раздел ниже на развороте, чтобы предоставить ссылки на другой полезный контент (т. е.г. популярные посты)
17. Пример страницы 404: Sprout Social
Источник
Что, если бы вы могли превратить страницу 404 в полноценную целевую страницу? Это именно то, что Sprout Social сделала со своими. В соответствии с типичными стандартами страниц 404 Sprout Social начинается с одного из этих нахальных маленьких сообщений об ошибках, указывающих на то, что вы находитесь не в том месте. Однако это не то, что отличает его от других страниц ошибок 404. Это все остальное.
Первое, что вы заметите, — это призыв к действию в центре экрана, предлагающий вам узнать больше об их услуге с помощью реальной демонстрации — рассказать о том, как увеличить количество конверсий на вашем сайте.А если вы предпочитаете получать информацию об их компании по электронной почте, на странице есть форма подписки на их информационный бюллетень. Но это не настоящий кикер. У них на самом деле открыт чат поддержки на странице, так что вы можете напрямую поговорить с кем-то, кто поможет вам достичь того, чего вы хотите! На самом деле это не страница 404, а отличный пример того, как превратить потерянные души в платящих клиентов.
Роберт Бернал, GetResponse USSEOManager
Ключевые выводы:
Предложите несколько различных способов превратить досадную ошибку в достижение цели
Продемонстрируйте доступность службы поддержки в чате, чтобы обеспечить удовлетворенность клиентов
18.Пример 404 страницы: НАСА
Источник
У НАСА есть гладкая, профессиональная, но умная страница 404. Его копия («Космический объект, который вы ищете, исчез за горизонтом событий») и галактическое фоновое изображение очень символичны для космического агентства. На этой странице нет никаких уловок, и вы можете изучить веб-сайт НАСА, нажав на хорошо заметную панель навигации. Это не заставляет вас оставаться там дольше, чем необходимо, и позволяет погрузиться в исследование космической тематики.
Ада Дужинская, специалист по контент-маркетингу GetResponse
Ключевые выводы:
Если есть способ сохранить копию и дизайн формы 404 связанными с вашим бизнесом, сделайте это! Сохраняя стабильную тему на всех своих веб-сайтах, вы поддерживаете интерес посетителей к вашей истории.
19. Пример страницы 404: GetResponse
Источник
Я искренне считаю, что эта страница 404 эффективна.
Тон и внешний вид этой страницы соответствуют новой визуальной идентичности, к которой мы стремились. Это видно по цветовой схеме, желтому выделению, используемым шрифтам и всему тексту.
Хотя очевидно, что это страница с ошибкой, мы хотели, чтобы наши посетители уходили с улыбкой. Вот почему мы использовали эту комическую иллюстрацию, чтобы объяснить, что пошло не так.
Мы также хотели, чтобы наши посетители знали, что делать дальше. Вот тут-то и появилась ссылка на главную страницу, а также тонкий намек дважды проверить, выглядит ли введенный URL-адрес правильно.
В самом низу страницы мы также добавили несколько дополнительных разделов, чтобы сделать сайт более удобным для посетителей (и, возможно, повысить конверсию). Мы добавили ссылки на наши популярные статьи, ссылку на страницу, где посетители могут узнать больше о наших функциях, и страницу регистрации.
Теперь, если бы мы хотели еще больше оптимизировать эту страницу, я бы, вероятно, выбрал функцию панели поиска рядом со ссылкой на главную страницу. Хотя это может быть не лучшим вариантом для конверсий и получения новых регистраций, я подозреваю, что это улучшит опыт наших посетителей, помогая им повторно ввести свой запрос и найти часть информации, которую они искали.
Михал Лещински, руководитель отдела контент-маркетинга и партнерства GetResponse
Ключевые выводы:
Обязательно обновите страницу, если вы меняете свой визуальный образ
Сделайте страницу интересной, приятной и удобной для навигации
Оцените эффективность страницы с точки зрения конверсий и положительных взаимодействий с пользователями
20.Пример страницы 404: Ahrefs
Источник
Это может показаться легкой игрой для SEO-компании, но не все из них использовали свои страницы 404 так же эффективно, как здесь Ahrefs.
Это весело, познавательно, и я не удивлюсь, если он также хорошо конвертируется.
Поскольку посетители сайта Ahrefs, скорее всего, заинтересованы в SEO, они, вероятно, оценят то, что здесь сделала команда — они объяснили, что такое неработающие ссылки, и намекнули, что вы можете идентифицировать такие страницы на своем собственном сайте, используя их бесплатную неработающую ссылку. средство проверки.
И хотя на странице отсутствуют элементы, которые мы привыкли видеть, такие как ссылка на главную страницу, панель поиска или другой полезный контент, их целевая аудитория, скорее всего, будет знать, как это сделать.
Михал Лещински, руководитель отдела контент-маркетинга и партнерства GetResponse
Вынос ключей:
Не пренебрегайте потенциалом страницы для привлечения подписчиков
Используйте страницу 404, чтобы показать, о чем ваш бренд
Не бойтесь пойти другим путем
21.
Пример страницы 404: Лего . Источник
Иногда товара, который вы ищете, больше нет. Это печально. В то время как большинство компаний признают этот факт и иногда извиняются, Lego, с другой стороны, напоминает пользователям, что они не должны волноваться, потому что все ПО-ПРЕЖНЕМУ УДИВИТЕЛЬНО. Они также предлагают четкое решение с призывом к действию «Начать покупки».
Ирек Климчак, старший менеджер проектов по контенту GetResponse
Ключевые выводы:
Сопереживайте пользователю
Помогите ему сохранять спокойствие
Предоставьте четкое решение
Время создать собственную страницу 404
Как вы уже убедились, пропажа страниц — это не конец света.На самом деле, многие владельцы сайтов стратегически используют свои страницы 404.
Многие пытаются превратить неприятный опыт в положительный — добавляя забавное сообщение или интерактивность на страницу с ошибкой, чтобы развлечь своих посетителей.
Другие сосредотачиваются на оказании помощи — показывая посетителям самых полезных ссылок, прямой путь к главной странице сайта или панель поиска , чтобы помочь им найти часть контента, который им интересен и ищет.
Наконец, есть маркетологи, которые используют свои страницы ошибок для увеличения дохода и увеличения количества конверсий.
Надеемся, что страницы ошибок, которые мы показали вам в этой статье, послужат источником вдохновения для дизайна, который поможет вам создать замечательную, привлекательную и высокоэффективную собственную страницу 404.
Теперь, если это только начало вашего пути и у вас еще нет полноценного веб-сайта, вам будет полезно прочитать наше руководство о том, как создать веб-сайт с нуля.
Здесь мы объясним пошаговый процесс и аспекты, которые вы захотите учитывать при создании собственного сайта — будь то надежный веб-сайт WordPress, требующий тонны ручной настройки, или сайт, созданный с помощью интуитивно понятного перетаскивания. Конструктор -and-drop, подобный тому, который предлагает GetResponse.
Наконец, если вы еще не слышали об этом новом передовом решении, посмотрите этот краткий видеообзор, чтобы лучше понять то, что вы получите из коробки.

.
No related posts.