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

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

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

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

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

Сообщение об ошибке может выглядеть по разному: 

  • 404 Not Found;
  • HTTP 404 Not Found;
  • 404 Error;
  • The page cannot be found / страница не найдена.

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

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

Основная необходимая информация

Удачная страница с ошибкой 404 должна быть лаконичной — старайтесь не использовать технические термины в тексте. Избегайте строгой формулировки «Ошибка 404», так как это может напугать пользователей. Лучше всего сказать, что «Страница не найдена», а также предложить несколько вариантов действий для перехода с этой страницы.

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

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

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

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

Ниже рассмотрим несколько советов от Google по тому, как эффективно оформить страницу 404, а также, какую информацию можно добавить:  

  • Используйте дружелюбную манеру повествования;
  • Убедитесь, что дизайн вашей страницы выглядит так же, как и остальная часть вашего сайта;
  • Добавьте ссылки на свои самые популярные статьи;
  • Предоставьте пользователям возможность дать обратную связь по неработающей ссылке;
  • Убедитесь, что ваш веб-сервер возвращает фактический код состояния HTTP 404 при запросе страницы, чтобы она не отображалась в результатах поиска;
  • Используйте виджет Enhance 404, чтобы встроить окно поиска на свою страницу; 
  • Используйте инструмент «Изменение адреса», чтобы сообщить Google о перемещении вашего сайта;
  • Проявите творческий подход — страница 404 не должна быть скучной.

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

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

Ниже рассмотрим несколько советов по разработке дизайна страницы 404:

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

Удачные примеры страницы с ошибкой 404

DeviantArt

Lego

LimpFish

Mattel

ModCloth

Visitsteve

Titleist


Источник: designshack.net

 

 

 

Условия передачи информации

Я даю согласие OOO «ЭсБилдер» (далее «BINN») на обработку моих персональных данных в соответствии со статьями 6, 9, 10, 18 Федерального закона от 27 июля 2006 года № 152-ФЗ «О персональных данных», указанных в онлайн-форме и/или предоставленных мною с целью:

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

Настоящее согласие применяется в отношении обработки следующих данных: имя, номер телефона, адрес электронной почты (E-mail).

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

Согласие может быть отозвано мною в любой момент путем направления в BINN подписанного мною письменного заявления.