Статьи

«Не найдено» не является опцией: обработка ошибок и взаимодействие с пользователем

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

Код 404, как вы, возможно, уже знаете, соответствует «Файл не найден» и, вероятно, является наиболее известным из всех кодов состояния, определенных в спецификации протокола передачи гипертекста (HTTP). Эти коды соответствуют разным ответам, которые пользователи могут получить при запросе документа с веб-сервера. В этом случае, когда пользователь не может получить доступ к файлу, веб-сервер выдаст ошибку 404.

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

Документ не найден

Давайте рассмотрим все возможные сценарии ответа такой природы:

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

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

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

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

    Другая проблема, связанная с недобровольными орфографическими ошибками, возникает, когда кто-то делает ссылку на документ на нашем сайте, но неправильно набирает URL в ссылке. Вы всегда можете попытаться заполучить людей, поддерживающих ссылающийся сайт, и попросить их внести изменения (удачи в этом!), Или вы можете рисковать и решить проблему на вашей стороне, особенно если эта ссылка важна тебе.

    В этих случаях вы можете установить перенаправление для наиболее распространенных ошибок. Однако Apache предлагает более элегантный выход: проверка орфографии. Директива Checkspelling Для получения дополнительной информации о настройке CheckspellingНастройке Checkspelling на Apache .

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

    • index.html Однако, если вы запускаете PHP на своем сервере, вы, скорее всего, будете использовать документ index.php то же самое может произойти, если вы используете ColdFusion ( index.cfmdefault.asp
    • favicon.ico Если в документе ничего не было указано, браузер попытается получить файл favicon.ico Однако есть быстрое решение: все, что вам нужно сделать, это добавить следующую строку в ваш документ между тегами <head>
    • <link src="/images/mycompany.ico" rel="shortcut icon" />

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

    • robots.txt Если файл robots.txt Быстрое исправление: поместите пустой robots.txt это не принесет никакого вреда.
    • Ghost files Таким же образом наш хостинг-провайдер может назначить нам сервер с IP-адресом, который ранее использовался непосредственно для доступа к другому веб-сайту. Эти 404 ошибки легко идентифицировать, поскольку они должны давать ссылки на документы и каталоги, которые совершенно не связаны со структурой нашего сайта.

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

    Разработка полезных 404 страниц

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

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

    3. Не называйте это «Ошибка 404»
    4. Мы все знаем, что означает «Ошибка 404», но кто-нибудь еще? Давайте не будем забывать, что Интернет для некоторых людей все еще остается неизведанной территорией. Мы не хотим потерять тетю Мэри, если она перейдет по неработающей ссылке, предлагая рецепт печенья, не так ли? Конечно нет … Это подводит меня к следующему пункту.

    5. Не думайте, что ошибка посетителя
    6. С «ошибкой 404» мы должны попытаться предложить какое-то объяснение тому, что испытывает пользователь. На данный момент у нас нет возможности узнать, что пошло не так, поэтому в общем, дружеское послание в порядке; что-то вроде:

      «Ой! Мы не смогли найти страницу, которую вы ищете.»
      Или:
      «Ваш документ не найден. Приносим извинения за неудобства».

      Хитрость заключается в том, чтобы ничего не предполагать, если вы не уверены, почему произошла ошибка. Напишите сообщение на языке, который показывает уровень знакомства, который подходит для вашего сайта. Обратите внимание, что мы используем настоящее время при обращении к проблеме (т. Е. «Вы есть», а не «вы были»), что позволяет посетителю почувствовать, что проблема не окончена и что вы работаете над ней. Это сообщение в сочетании с некоторыми из следующих ресурсов гарантирует, что пользователь не покинет ваш сайт — по крайней мере, не сразу.

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

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

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

    13. Исправить эти неработающие ссылки
    14. Пока что нам удалось предоставить посетителю полезную информацию и инструменты. Теперь пришло время принять корректирующие меры.

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

    • www.mysite.com/path/to/missing.html — это документ, на который неправильно ссылаются
    • www.othersite.com/referrer.html — это место, где существует неправильная ссылка

    Мы можем легко разделить любой из этих URL-адресов, используя первую косую черту (‘/’), чтобы разделить их на две части: имя хоста и местоположение файла на этом хосте. Сравнивая эти фрагменты информации, мы можем ожидать возникновения одного из следующих сценариев:

    A. Пользователь имеет устаревшую закладку или набрал неверный URL

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

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

    Б. На сайте есть неработающая ссылка!

    Что если мы найдем Реферера? Первое, что нам нужно сделать, это сравнить его имя хоста с нашим собственным: если есть совпадение, у нас проблемы.

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

    C. Неверная ссылка с внешнего сайта

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

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

    Как правило, URL запроса поисковой системы выглядит примерно так:

     www.searchengine.com/action?q=usable+error+pages&lang=en&safe=on

    Здесь 'q'

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

    Первая часть проста, так как мы уже отделили имя хоста от остальной части ссылающегося URL; осталось только выяснить, содержит ли оно имя поисковой системы, которую мы знаем. Вероятно, лучший способ сделать это — использовать функцию, такую ​​как indexOf (которая доступна во многих языках программирования и сценариев), и сравнить имя хоста с массивом терминов, таких как показано ниже:

     List = ["google", "yahoo", "msn", "altavista", "hotbot", "lycos"]

    Следующим шагом является определение переменной, которая содержит поисковые термины. В приведенном выше примере вы можете видеть, что поисковый запрос содержит не только поисковые термины, но и дополнительную информацию, относящуюся только к конкретным поисковым системам. Google, MSN и Altavista, например, используют переменную 'q''query' Yahoo почему-то нравится 'p'

    Как вы уже могли заметить, когда поисковый запрос содержит два или более слов, они объединяются с помощью знака плюс ( '+' Это позволяет нам разбить эту строку на слова, которыми мы можем кормить нашу внутреннюю поисковую систему.

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