Как оформить ошибку 404 на сайте

В этой статье мы расскажем, почему стоит делать уникальную страницу 404 для сайта и как правильно её оформлять. Покажем удачные и неудачные примеры оформления таких страниц. 

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

Зачем оформлять страницу 404 Not Found?

Существует 2 основные причины появления 404-ой ошибки:

• неправильно введён адрес ссылки;
• страница была удалена.

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

Вот так оставлять нельзя:

Рисунок 1. Стандартная страница 404 Not Found

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

Приведем пример количества посещений страницы с 404-ой ошибкой на сайтах, с которыми мы работаем.

Сайт 1:

• 1 143 477 просмотров сайта за год;
• 42 114 просмотров страницы 404 за год (или 3,85%).

Приведем для сравнения такие цифры: у самого популярного раздела каталога 218 011 просмотров за год (19%), что всего в 5 раз превышает количество просмотров 404-ой страницы. А у раздела, который находится на 6 месте по количеству просмотров за год, эта цифра составляет 14 935 просмотров (или 1,3%), что в 3 раза меньше, чем у страницы 404.

Сайт 2:

• 64 625 просмотров сайта за год;
• 547 просмотров страницы 404 за год (или 0,84%).

Из 11 разделов на сайте целых 4 раздела имеют меньше просмотров, чем страница 404.

Только представьте, какое большое количество посетителей сайта попадает на страницу 404-ой ошибки, и в ваших силах удержать и заинтересовать их.

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

Как оформить страницу ошибки

Существует 5 вариантов:

1. Оставить стандартную страницу ошибки браузера. Но ведь мир и так довольно жесток 🙁

Рисунок 2. Мем

2. Сделать страницу креативной и интересной:

Gif 1. Страница 404 с анимацией с сайта  https://rabota.gk-rte.ru/404

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

3. Сделать страницу полезной для посетителя, помочь ему найти нужную информацию:

Рисунок 3. Страница 404 с полезным контентом с сайта https://drarthurkhristenko.ru/404

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

4. Совместить предыдущие 2 варианта:

Рисунок 4. Страница 404 с полезным контентом и креативом с сайта https://www.coca-cola.ru/404

Отличный пример совмещения креатива и полезной для посетителя информации на сайте Coca-cola.

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

5. Использовать промокод на скидку:

Рисунок 5. Страница 404 с промокодом с сайта https://www.planeta-sport.ru/404/

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

Рисунок 6. Мем

Шапка и футер — оставляем?

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

Наша рекомендация: оставить шапку и футер при оформлении страницы с 404-ой ошибкой. Тем более так рекомендует Google:

“Страница 404 должна быть выполнена в том же стиле (включая элементы навигации), что и основной сайт.” — Google.

Создаем блок с ошибкой 404

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

Рисунок 7. Пример 404-ой страницы на сайте https://kolesa.kz/404/

Сайт по продаже автомобилей использует оригинальную фразу “Докатились” и тут же предлагает посмотреть объявления. Из минусов здесь можно отметить тёмный фон, так как на основном сайте он светлый.

Рисунок 8. Пример 404-ой страницы на сайте https://www.pixar.com/404

* Перевод: “Не плачь. Это всего лишь 404 ошибка. То, что ты ищешь, могло переместиться в долгосрочную память.”

Рисунок 9. Пример 404-ой страницы на сайте https://www.lego.com/ru-ru/404

Рисунок 10. Пример 404-ой страницы на сайте https://www.f1news.ru/404/

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

Рисунок 11. Пример 404-ой страницы на сайте https://www.tinkoff.ru/404/

Рисунок 12. Пример 404-ой страницы на сайте https://www.aviasales.ru/404

Рисунок 13. Пример 404-ой страницы на сайте https://www.kinopoisk.ru/404/

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

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

Текст для страницы с ошибкой 404

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

• Извините, такой страницы у нас нет. Мы поможем найти нужную информацию.
• Извините, такой страницы у нас нет. Но есть много другой полезной информации.

Элементы навигации

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

Если ваш сайт предоставляет услуги или продаёт товары, то добавьте ссылку на каталог и основные услуги/товары.

Рисунок 14. Пример 404-ой страницы на сайте https://www.mann-ivanov-ferber.ru/404/

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

Рисунок 15. Пример 404-ой страницы на сайте https://www.nytimes.com/404

Например, The New York Times добавил на страницу 404-ой ошибки самые популярные статьи, которыми чаще всего делятся их читатели.

Возможность сообщить о неработающей ссылке

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

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

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

Рисунок 16. Пример отработки кнопки “Сообщить о нерабочей ссылке” со страницы https://enjoyme.ru/404/

Основные рекомендации

Резюмируем основные рекомендации из данной статьи:

1. Оформите страницу 404 в том же стиле, что и весь сайт. Это касается элементов навигации, шрифта, цвета.
2. Подготовьте понятный и короткий текст, который не вызовет отторжения у пользователя. Ему должно быть ясно, что запрашиваемая страница недоступна.
3. Добавьте креатив в оформление, чтобы удержать посетителя на сайте.
4. Добавьте ссылки на главную страницу, основные категории и услуги, а также на самые популярные статьи или записи блога.
5. Вся информация должна помещаться на первом экране. Нет смысла добавлять больше: вряд ли посетитель страницы 404 будет скроллить вниз.
6. Дайте пользователю возможность сообщать о неработающих ссылках, даже если не собираетесь проверять эти сообщения.

Блок-схема

Как только вы определитесь с оформлением, нужно нарисовать блок-схему.

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

Если вы никогда не составляли блок-схемы или хотите получить больше информации об их составлении, то рекомендуем прочитать нашу статью “Как сделать ТЗ на дизайн сайта бесплатно самому: подробная инструкция”.

Рисунок 17. Пример составленной блок-схемы для 404 страницы Ant-team.ru

Итоги и бонусы

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

И чтобы процесс создания страницы с 404-ой ошибкой не принес вам лишней головной боли, предлагаем воспользоваться нашим чек-листом и шаблоном технического задания, где подробно описан каждый шаг (читайте красный текст):

• Чек-лист на дизайн для страницы 404
• Шаблон ТЗ на дизайн для страницы 404

А чтобы было ещё понятнее, можете воспользоваться примером заполнения шаблона ТЗ и нарисованной блок-схемой:

• Пример ТЗ на дизайн для страницы 404 Ant-Team
• Блок-схема 404 Ant-Team

Это настоящее техническое задание, которое мы заполняли для нашей страницы 404-ой ошибки.

Автор статьи: Кирилл Агафонов (Ant-team.ru)

P.s. Подписывайтесь на наш телеграм-канал t.me/seoantteam, чтобы первыми узнавать о выходе новых материалов.

При написании статьи использованы источники:

1. https://developers.google.com/search/docs/advanced/crawling/soft-404-errors?hl=ru&visit_id=637885645086554669-667034082&rd=1#93641
2. https://yandex.ru/support/metrica/stand-out/informative-page-404.html#informative-page-404

Время на прочтение
4 мин

Количество просмотров 143K

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

В качестве вступления отметим, что страница 404 «Не найдено» (404 Page Not Found) – это один из кодов состояния HTTP, принятых Консорциумом Всемирной паутины (W3C) в 1992 году. Для тех, кому интересно значение цифр 404, вкратце расскажем.

1. Первая «4» означает, что произошла ошибка со стороны клиента. Такой ошибкой может быть неверно написанный URL или запрос несуществующей страницы. В свою очередь, первая «5» значила бы ошибку со стороны сервера.
2. Цифры «04» — определяют конкретную ошибку Not Found из группы 4хх. Среди других ошибок из этой группы — 400 Bad Request, 401 Unauthorized, 402 Payment Required, 403 Forbidden и так далее.

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

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

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

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

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

Принимая это во внимание, приведем список рекомендаций по созданию кастомной 404-й страницы.

1. Будьте любезны с посетителями.Они попали на эту страницу не по своей вине. Постарайтесь выразить свое сожаление и готовность помочь.
2. Не углубляйтесь в технические детали. Термин «ошибка 404» сам по себе уже в достаточной мере техничен и в то же время понятен большинству пользователей. Нет никакой необходимости отпугивать посетителей любой другой специфической информацией о причинах этой ошибки. По сути, необязательно даже использовать цифры «404», достаточно просто объяснить суть проблемы.
3. Предложите пользователям проверить написание ссылки. Если они вводили адрес ссылки самостоятельно, то вполне вероятно могли допустить ошибку.
4. Придерживайтесь единого стиля сайта. Дизайн страницы 404 по оформлению и по ощущениям должен быть выдержан в стиле Вашего бренда, чтобы у пользователей не возникло заблуждения, что они попали на какой-то другой сайт.
5. Страница ошибки 404 не должна выглядеть как обычная страница. Ваши посетители должны ясно видеть, что страница не была найдена и не содержит какого-либо контента. Поэтому не стоит наполнять ее слишком большим количеством текста и ссылок.
6. Небольшая порция юмора никогда не помешает. Довольно часто 404 страница становится для дизайнеров и разработчиков платформой для выражения своих креативных и юмористических идей. Вместо того чтобы пользователи быстро закрывали ненайденную страницу, лучше удержать их от закрытия сайта, заинтересовав забавно и изобретательно выполненной страницей.
7. Будьте полезными и предоставьте ссылки на возможные совпадения. Если пользователи оказались на ненайденной странице, они, вероятно, что-то искали. Так помогите же им это найти. Разместите на странице меню или ссылки на недавно перемещенные страницы. Или почему бы не дать ссылки на самые популярные страницы Вашего сайта? Либо на самый новый и актуальный контент. Так или иначе, пользователи должны быть не более чем в одном клике от перехода на какую-либо другую страницу сайта. И, конечно же, всегда давайте ссылку на главную страницу.
8. Добавьте строку поиска. Чтобы не потерять своих посетителей, позвольте им найти то, что они искали, оказавшись на странице ошибки.
9. Обеспечьте способ отправить отчет об ошибке. У пользователя всегда должна быть возможность отправить вам сообщение об ошибке, если он пожелает. Это поможет Вам узнать о каких-либо внутренних недочетах сайта. Еще лучшим решением для отслеживания проблем на сайте станет автоматическое уведомление. А если произойдет внезапный всплеск 404-х ошибок, полезным будет мгновенное уведомление. Это позволит исправить проблему в режиме реального времени, пока она еще релевантна.
10. Позаботьтесь о вопросах SEO. Для оптимизации сайта важно максимально сократить количество внутренних ссылок на 404-е страницы, а еще лучше вовсе исключить возможность формирования некорректных URL адресов, ведущих на страницы 404. Инструменты для вебмастеров помогут Вам отслеживать ошибки на сайте, в том числе и ошибки с кодом 404 Not found. Более того, эти инструменты помогут Вам понять, откуда берутся ошибки и как они формируются – ошибка в URL ссылки на сайте, либо это атака конкурентов.

    Немного отклоняясь от оригинала статьи, добавлю ссылки и скриншоты инструментов, о которых говорится в этом пункте.
    Google:

    

    Яндекс:

    
    Также рекомендую ознакомиться с официальной информацией о страницах 404 от поисковых систем: Google — здесь и Яндекс — здесь.

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

Немного о термине

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

Причины появления проблемы  

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

Неправильный адрес 

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

Человек сам поймет, что опечатался, перейдет на главную и продолжит искать нужную ему категорию. Например, юзер захотел посетить интернет-магазин https://www.sportmaster.ru/catalog/brendy/reebok/ , но при написании адреса ошибся и вместо доменной зоны .ru, указал .com. В таком случае пользователь увидит следующую информацию: 

Неправильная ссылка на каналах для привлечения трафика 

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

Технические неполадки 

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

Битые ссылки 

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

Эту неполадку можно обнаружить с помощью различных сервисов: Labrika, Screaming Frog и тд. Чтобы решить проблему, необходимо с битого урла настроить 301 редирект на актуальный или же совсем убрать такие гиперссылки, чтобы пользователь не смог перейти по ним.  

Читайте также


Самостоятельная регистрация организации в каталогах и справочниках: как делать и чего ожидать

Неправильная работа сервера 

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

Последствия 

Если странички вашего ресурса начали отображать еррор 404 request failed with status code, необходимо как можно скорее обратиться к компетентному специалисту, который обнаружит сбой и поправит его в краткий срок. Такая проблема может негативно повлиять на продвижение сайта, то есть: 

Код ошибки 404: что это такое и как ее устранить 

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

Яндекс.Вебмастер 

Это универсальная программа, которая позволяет отслеживать состояние ресурса и уведомлять о возникновении какой-либо проблемы. Чтобы найти неработающие адреса, необходимо перейти в раздел «Внутренние ссылки»: 

Чтобы найти площадки, которые ссылаются на ваш сайт, следует перейти в категорию с внешними линками:

Google Search Console

 Чтобы посмотреть, какие странички перестали работать, нужно перейти в инструмент от Google в раздел «Страницы» и найти причину «Не найдено (404)».

Xenu

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

После того как все url загрузятся, можно просто отсортировать список по статусу и найти обозначение not found: 

Screaming Frog

Это многофункциональный сервис для проверки веб ресурсов. Для того чтобы выявить ошибки 404, программа должна отсканировать площадку и выгрузить все гиперссылки. Для начала вам нужно ввести url в специальную строку, а затем нажать на Start, чтобы началось сканирование. После проверки перейдите во вкладку Response Codes и поставьте фильтр Client Error (4xx). После введения всех параметров на экране появятся не найденные странички. 

Netpeak Spider

Это платный сервис, который устанавливается на компьютер. После установки необходимо оплатить лицензию. С помощью этой программы вы сможете не только искать странички, которые не работаю, но и проводить полноценный технический аудит. Чтобы найти разделы с 404 кодом ответа сервера, нужно ввести адрес в специальную строку и дождаться выгрузки всех url. Затем кликните на кнопку «Старт», потом на «Отчеты» и после на «Сводка». Как только вы увидите список ссылок, нужно найти в категории «Статус страницы» параметр «Битые».  

404 that’s an error: как ее исправить  

Чтобы выбрать оптимальное решение проблемы, необходимо выявить конкретную причину ее появления: 

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

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

Оформление несуществующей страницы 

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

Развлекательный блок 

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

Оформление несуществующей страницы 

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

Развлекательный блок 

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

Дополнительная перелинковка на товары или услуги 

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

Внедрить строку поиска   

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

Читайте также


Продающие тексты: как писать маркетинговые статьи для интернет-магазина

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

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

Что предпринять, если проблема осталась 

Если вы разобрались, что такое http error 404 not found, нашли причину появления данной ошибки и поняли, как ее исправить, это еще не значит, что она исчезла навсегда. Она может вернуться при следующем внесении изменений в структуру url, при сервисном сбое, при удалении ненужных разделов. Если гиперссылки на несуществующие страницы присутствуют на вашем ресурсе, их всегда могут поправить технические специалисты. Однако если на сторонней площадке размещены url на несуществующие странички вашего ресурса, тогда вам следует написать в техподдержку и попросить заменить адрес или убрать его совсем. Если и это не помогло, тогда стоит тщательнее заняться оформлением неработающих адресов, чтобы пользователи от вас не убежали, а, наоборот, заинтересовались.

Заключение 

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

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

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

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

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

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

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

Вывод

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

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

Что такое ошибка 404 и почему она возникает

Ошибка 404 или Not Found появляется, если страница, на которую вы переходите, не найдена. Чтобы лучше понять, как возникает ошибка Not Found, рассмотрим этот процесс детально:

• Переход по ссылке. Пользователь кликает ссылку на сайте или вводит URL в адресной строке браузера.
• Отправка запроса на сервер. Браузер соединяется с сервером — физическим компьютером, где располагается сайт со всеми его файлами и базами данных. 
• Ответ сервера. Браузер получает от сервера закодированный ответ с трехзначным кодом. Код показывает, как именно сервер обработал запрос браузера. 

Если соединиться с сервером не получилось, вы увидите сообщение «не удается получить доступ к сайту».

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

Причины ошибки 404 Not Found:

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

Что такое ложная ошибка 404 и почему она возникает

Ложная ошибка появляется, когда браузер получает успешный ответ 200 OK, но все равно выводится сообщение 404 Not Found. Также можно увидеть страницу, на которой мало контента, или пустой экран. 

Причины ложной ошибки 404:

• Некорректная настройка кода ответа: Для несуществующих страниц сообщение об ошибке 404 владелец сайта заменил на страницу-заглушку с кодом 200 OK. 
• Недостаточное количество контента. На странице мало материалов или они отсутствуют.
• Нет доступа к ресурсам. В корневом каталоге сайта помимо прочих находится файл robots.txt. Он содержит информацию для поисковых систем о том, какие ресурсы сайта можно сканировать, а какие — нет. Если в robots.txt заблокирован доступ к странице или каким-то ее файлам, это может вызывать ошибку Soft 404.
• «Тяжелая» страница. На странице слишком много файлов или у них очень большой размер. Из-за этого страница загружается долго и в итоге провоцирует ошибку.

Чем вредны ошибки 404 для SEO 

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

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

Как найти внутренние и внешние ссылки на страницы 404

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

Обнаружить оба вида ссылок помогут бесплатные сервисы Яндекс.Вебмастер, Google Search Console, Xenu’s Link Sleuth, условно-бесплатный Screaming Frog SEO Spider Tool и платный Netpeak Spider. 

Яндекс.Вебмастер

Как найти внутренние ссылки: добавьте URL сайта → зайдите в панель «Ссылки» → «Внутренние ссылки».

Что делать с битыми ссылками

Внутренние битые ссылки нужно убрать или заменить на работающие URL-адреса. Проверять ресурс на наличие неработающих внутренних ссылок следует минимум раз в месяц.

Когда вы собрали внешние битые ссылки, нужно:

1. Сделать выборку битых URL-адресов с сайтов, у которых ИКС больше 500. Это сайты с хорошей репутацией и посещаемостью, поэтому с них идет большой трафик. С битыми ссылками на этих ресурсах нужно разобраться в первую очередь.
2. Настроить с этих ссылок переадресацию (301 редирект) на страницы с перемещенным или похожим контентом. Пользователь перейдет по битой ссылке, а попадет на ту страницу, которую вы укажете. Таким образом посетитель увидит материал, который ожидал, и не покинет сайт. 

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

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

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

Развлечь пользователя

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