Гайд по страницам 404: как создать и улучшить

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

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

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

Страница 404, также известная как 404 not found page, представляет собой веб‑страницу, которую сервер отображает в случае, когда пользователь пытается зайти на несуществующий URL‑адрес или когда запрошенная страница не может быть найдена.

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

Коды ошибок HTTP: полный список ошибок сервера

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

Почему пользователи попадают на страницу с ошибкой 404

Обычно это происходит случайно, если только кто‑то не ищет страницы с ошибками, чтобы использовать их в качестве примера в продвинутом руководстве по страницам ошибок 😉

Опечатка в URL‑адресе

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

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

Неработающие ссылки

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

К счастью, такие ссылки легко найти и исправить. Поможет Анализ сайта от Топвизора: 

Коды ответа сервера отображаются слева — и, если там будет страница с кодом ответа 404, вы её сразу же увидите 

Попытки попасть на несуществующую страницу

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

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

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

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

1. Управление недовольством пользователей

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

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

2. Перенаправление пользователей обратно на ваш сайт

Неважно, куда именно — на главную страницу или куда‑то ещё, ваша цель — удержать пользователей на вашем сайте, а не заставить их уйти.

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

3. Повышение коэффициента удержания клиентов

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

Это не просто домыслы. Улучшение основных показателей вашего сайта — это один из ключевых элементов успешной стратегии поисковой оптимизации.

Продуктовый подход в SEO: что это, для чего нужно и как это работает

Лучшие примеры 404‑страниц

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

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

Mailchimp

Многие считают 404‑ю страницу Mailchimp образцом простого и энергичного дизайна. 

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

Tripadvisor

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

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

Что такое хлебные крошки и как сделать их на сайте 

Vans

Компания Vans отлично справилась со своей страницей с ошибкой 404, не упустив ни одного нюанса.

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

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

Screaming Frog

Screaming Frog — это инструмент, который SEO‑специалисты и владельцы сайтов используют для поиска и устранения неработающих ссылок (и который можно заменить Анализом сайта 😉). Поэтому довольно иронично, что он попал в подборку лучших 404‑страниц в интернете.

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

Lego

Дизайнеры страницы 404 Lego превзошли себя, создав идеальное сочетание юмора и актуальности бренда. Создаётся впечатление, что маленький строитель тянется к экрану компьютера!

Один из лучших элементов — надпись под заголовком: 

«Мы не можем найти эту страницу. Мы постараемся не потерять голову из‑за этого, но если это произойдёт... мы вернём её на место».

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

Pixar

Как и в случае с Lego, на странице 404 от Pixar мы встречаем персонажа из блокбастера «Головоломка» — Печаль. Этот персонаж олицетворяет чувство растерянности, которое может возникнуть у посетителя, когда он попадает на страницу с ошибкой.

Несмотря на комичность страницы, она остаётся ясной и информативной. Чёрный текст с засечками остаётся очень чётким на белом фоне, что делает его ещё более привлекательным для глаз.

Christmas Tree World

Страница ошибки Christmas Tree World действительно превосходна.

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

Tim Hortons

Когда речь заходит о понятных сообщениях, Tim Hortons занимает первое место (и в списке пончиков, конечно). Сообщение об ошибке 404 абсолютно ясно, а забавный штрих в виде пончика для цифры 0 поддерживает атмосферу веселья.

Sandals

Второй туристический бренд в этой линейке — Sandals.

Как и Tripadvisor, Sandals решил использовать забавную шутку о путешествиях, чтобы сделать свою страницу 404 более весёлой и развеять разочарование пользователей. 

Фоновое изображение расслабляет и пробуждает вдохновение для путешествий. 

Waterstones

Если бы существовал приз за самую полезную страницу 404, Waterstones, безусловно, был бы одним из главных претендентов на него.

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

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

Trivago

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

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

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

Русскоязычные примеры страниц 404 

Покажем несколько удачных примеров из Рунета. 

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

То же самое у Тинькофф‑Журнала, только без рекламы. Цифры 4, 0 и 4 образуют грустный смайл: 

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

Ключевые элементы лучших страниц 404

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

1. Строка поиска — не стоит принимать всё решения за своих пользователей. Позвольте им самим выбирать, куда двигаться дальше, добавив строку поиска.

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

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

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

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

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

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

Как создать безупречную страницу 404

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

Обратите внимание на юзабилити

Чтобы предотвратить разочарование и сохранить посетителей на сайте, важно задуматься о пользовательском опыте (UX) страницы с ошибкой 404. Убедитесь, что контент доступен, инклюзивен (его могут просмотреть пользователи с ограничениями здоровья) и соответствует остальному сайту. 

Сделайте страницу удобной для восприятия и навигации.

Что такое юзабилити и как его улучшить 

Сохраняйте индивидуальность вашего бренда

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

Используйте юмор, но с умом

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

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

Как я увековечил гранитную мастерскую в ТОП‑1 и принёс миллионные прибыли владельцам 

Помните о предзятости негативного опыта

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

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

Ещё о техническом SEO ⚙️

Что делать со страницами, которые выдают ошибку 404 

Как собрать вопросы и ответы (FAQ) для сайта, которые приведут трафик и лиды 

Что делать после аудита и все ли ошибки нужно исправлять