Как создать отличную страницу 404 для ваших пользователей

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

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

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

Что такое код 404?

404 — это один из кодов состояния HTTP, который появляется, когда страницу не удается найти.

404 принадлежит к группе 4xx, что указывает на то, что это ошибка на стороне клиента. Точнее, это означает, что клиент добрался до вашего сервера, но сервер не нашел запрошенный файл.

Код 404 может появляться по разным причинам, например:

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

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

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

• Стандартная страница 404 или
• Пользовательская страница 404.

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

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

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

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

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

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

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

Пользовательская страница 404 позволяет:

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

Кроме того, Google рекомендует создать пользовательскую страницу 404 .

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

источник: Гугл

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

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

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

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

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

• Панель поиска,
• Список ресурсов, доступных на вашем сайте,
• кнопка призыва к действию,
• Ссылки на ваш основной контент,
• Дизайн, соответствующий вашему бренду.

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

Удалить сообщение об ошибке

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

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

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

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

Хорошим примером страницы 404 с панелью поиска является Moz.com:

Так что, если вы искали что-то конкретное на Moz.com, но не нашли, вы можете снова поискать прямо на странице 404.

Список ресурсов

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

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

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

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

кнопка призыва к действию

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

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

Вот пример страницы 404 Netflix с кнопкой CTA, ведущей на их домашнюю страницу.

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

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

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

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

9gag использует свою страницу 404, чтобы побуждать людей загружать его приложение. Добавление фонового gif-файла идеально вписывается в стиль 9gag.

Ссылки на топовый контент

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

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

Отличный пример страницы 404, на которой представлен топовый контент, показан на веб -сайте Urban Outfitters . В нем есть раздел «Самое популярное» с возможностью купить товар сразу.

Фирменный стиль

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

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

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

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

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

Не оставляйте своих пользователей наедине со стандартной страницей 404.

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

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