Оформление 404 страницы - важно или нет?

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

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

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

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

Ещё пример, плохо оформленной страницы "Ошибка 404″:

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

Улучшаем оформление 404 страницы

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

Совет 1: Сохраняйте целостность дизайна

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

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

Совет 2: Максимальная информативность и полезность

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

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

Совет 3: Быть дружественным и понятным

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

Лучше написать что-то вроде простой фразы: "Ошибка 404: Страница не найдена" или "Ой Мы не смогли найти страницу, которую вы искали!". И обязательно добавить информативности из второго совета, который я описывал выше.

Пример креативной страницы 404 на сайте habrahabr.ru:

Совет 4: Минималистский дизайн работает

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

Ведь неизвестно, что пользователю надо и что он ищет на таком большом сайте. Поэтому минималистический дизайн будет очень кстати.

Поисковая оптимизация и 404 страница

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

Есть два способа, чтобы 404 страница не появлялась в результатах поиска:

• Убедитесь, что ваш сайт возвращает правильный HTTP заголовок (HTTP/1.1 404 Not Found) в ответе сервера, проверить можно на сайте bertal.ru:

  

  При таком HTTP коде, поисковые системы будут автоматически игнорировать эти страницы.

• Закрыть 404 страницу от индексации в robots.txt:

  Disallow: /404.html

Настройка

У многих CMS, страница "ошибка 404″ отдаётся автоматически. Но есть движки, у которых эта функция не работает, поэтому надо настроить её.

Для этого, надо создать файл 404.html (можно любое другое название), оформить его и добавить полезную информацию, о которой я писал выше. Загрузить файл в корень сайта и прописать в файле .htaccess вот такой код:

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