Креативные страницы 404. Как это работает

Каждый раз, когда пользователь переходит по битой ссылке, он попадает на 404 страницу. Уверен, что вы неоднократно видели это (или подобное) сообщение в окне своего браузера. Вспомните, что вы делаете в таких случаях? Примерно в 80% случаев вы просто закрываете вкладку. А значит, компания, на сайт которой вы хотели перейти, теряла в вашем лице своего клиента или посетителя. О том, как сделать страницу 404 инструментом маркетинга, мы поговорим в этой статье. Ошибка 404 появляется, если:

  • Вы удалили какую-то страницу с вашего сайта. Например, был товар или раздел на сайте, его решили удалить по той причине, что эта услуга не предоставляется, или товар больше не продается.
  • Вы изменили структуру вашего сайта. Старая страница существует, но находится по другому адресу.
  • Ссылка, по которой переходит пользователь, была введена с ошибкой или не в полном объеме.
  • На сайте были динамические адреса. Потом их изменили на ЧПУ, но редиректы не настроили.
Проверить наличие битых ссылок на сайте вы можете при помощи программы Xenu’s Link Sleuth. Посмотрите на эти страницы

Эти страницы красивы, но не функциональны. Они заканчивают коммуникацию пользователя с ресурсом. И единственным способом пользователя попасть на другие страницы сайта будет только вручную сократить введенный url. 404 страница должна быть не только красивой (и не столько), но и информативной. Чтобы страница 404 помогала вам в приобретении новых клиентов, она должна соответствовать следующим требованиям:
  • Страница должна быть выполнена в стилистике дизайна сайта.
  • Страница должна предлагать пользователю совершить действие.
Например, наша страница выглядит следующим образом:

Почему страница 404 появляется в индексе поисковых систем?

Бывает так, что страница 404 индексируется поисковыми системами, и в результатах поисковой выдачи пользователи могут видеть следующую картину:
С точки зрения SEO, данная ситуация не является критичной, это никак не отразится на ранжировании сайта в поисковой выдаче. Но думаю, что вряд ли вы захотите, чтобы пользователи видели такой сниппет в результатах выдачи. В индекс поисковых систем 404 страницы попадают по следующим причинам:
  1. Неправильные настройки сервера. Это происходит в том случае, если несуществующие страницы отдают код статуса HTTP 200. Согласно Википедии: «200 OK - успешный запрос. Если клиентом были запрошены какие-либо данные, то они находятся в заголовке и/или теле сообщения».
  2. Также это может происходить из-за неправильной настройки CMS сайта.
  3. Поисковик воспринимает 404 ошибку как «временно недоступен» или «временно удален». Например, товар был удален, но позже может вернуться. Чтобы гарантированно убрать несуществующую страницу из выдачи, следует применить код 410 Gone к несуществующей странице, которая будет восприниматься поисковой системой как «удалена навсегда».Рекомендую посмотреть видео с Мэттом Каттсом (руководителем Google Webspamteam), где он рассказывает о том, почему страницы с 404 ошибкой долго не исчезают из выдачи :
  4. Глюк поисковой системы =). Происходит довольно редко, даже при правильно настроенном ответе сервера.
Чтобы проверить, присутствует ли ваша 404 страница в индексе, в поиске Google нужно ввести site:domain.com «часть текста, который находится на странице ошибки». Если страницы в индексе нет, то вы увидите такой результат:
А если есть, то такой:

Как убрать страницу 404 из индекса поисковых систем

Александр Пантелеев рекомендует использовать следующий скрипт, который подойдет к любой CMS:

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

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


Страница 404 на сайте Creative People

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

И да, в профессиональной среде, специально оформленная страница 404 ошибки является хорошим тоном.


Знаменитая страница 404 с мозгошмыгой на Хабре (доступна зарегистрированным пользователям)


404 метровая глубина с айсбергом на сайте Штокмановского месторождения


Страница 404 на сайте Турбомилка


Страница 404 на сайте веб-студии Zanami


Страница 404 на сайте Центра информационной безопасности с «Лебединым озером»


Эпическая 404 страница с молдавскими гастарбайтерами


Облако тегов в виде цифр 404 на сайте БФМ


На сайте Олега Чулакова похожий принцип, только вместо тегов превью работ


У Икеи на странице 404 просто безвыходное положение


У Евросети фирменная собачка


Страница 404 на сайте дизайнера Сергея Мосякина


У дизайнера Евгения Филатова удобная настроечная таблица на 404 странице


Традиционный русский квест на сайте студии «Парадокс Бокс»


Неопознанный персонаж на сайте дизайн-бюро «Щука»


Страница 404 студии «Джаст би найс» с арканоидом на HTML5


У Елены Клубничкиной фотоаппарат


Не дорисованная страница 404 на сайте студии «Банг! Банг!»

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

Откуда берется ошибка 404?

Каждое число в номере ошибки имеет свое значение и тем самым подсказывает, что могло случиться. 4 говорит о проблеме на стороне клиента, а не сервера (тогда было бы 5). 04 – об ошибке «not found» (не найдено). Причин для отсутствия страницы может быть несколько, например:

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

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

Чтобы сервер не пугал посетителей таким сообщением, страницу ошибки 404 нужно корректно оформить. Рассмотрим способы, как это сделать.

Сохранить дизайн сайта

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

Второй момент в дизайне – изображения и видео. Обязательно используйте тематические картинки на этой странице (желательно с юмором) и если будет уместно, то и видео! Юмор расположит к себе пользователя и даст понять, что о нем все-таки подумали.

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

Польза для посетителей

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

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

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

Вежливое общение

Даже на странице ошибки нужно общаться с пользователем. Поприветствовать, кратко и понятно объяснить, что произошло, и проявить готовность ему помочь.

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

Как избежать ситуации 404?

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

Проблемы могут возникать в том случае, если страницу переместили в другой раздел сайта, изменили ее URL, и при этом не настроили 301 редирект. Ссылка получается битой. Этого следует избегать, правильно прописывая правила перенаправления в файле.htaccess (технические детали вы найдете в выпуске рассылки №36).

Включите автоматическое уведомление о проблемах на сайте, чтобы решать их своевременно.

Резюме

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

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

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

Ошибка 404 или Not Found («не найдено») - код ответа сервера на несуществующую страницу на сайте.

Как это работает?

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

В нашем случае код ответа- 404. Ответ сервера выглядит следующим образом:

Причины 404 ошибки

Красивая страница 404 для сайта обязательно вам понадобиться, чтобы показать ее пользователю, когда тот:

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

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

Как сделать 404 страницу?

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

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

Как сделать страницу 404? Необходимо просто прописать в данный файл следующую инструкцию:

ErrorDocument 404 //сайт/404.php

Всё довольно просто!

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

В небольших проектах уменьшить вероятность возникновения 404 ошибки можно используя программу Xenu"s Link. С её помощью вы можете отыскать все битые ссылки на сайте и выполнить следующие действия:

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

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

Оформление 404 страницы

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

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

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

  1. Скажите “Нет!” технической информации!
  2. Большинству пользователей знаком термин “404 ошибка”, но не стоит углубляться в причины её возникновения и давать дополнительные технические рекомендации. Донесите пользователю суть ошибки.
  3. Предоставьте полезный контент!

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

Это можно реализовать разными методами:

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

В оформлении 404 страницы важно не переусердствовать - не стоит слишком нагружать ее контентом.

Дизайн страницы 404

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

Сделайте 404 страницу изюминкой сайта! Добавьте креативности страницы с ноткой юмора - это привлекает и удерживает посетителей.

В сети множество примеров того, что значит оригинальная и красивая страница 404. Я не поленился и нашел для вас несколько: