Страницы ошибок
Шаблоны дизайна страниц в FigmaHTML-шаблоны страниц
Это страницы, которые сообщают, что сервис не может отобразить контент.









Принципы
Задача команды продукта — сделать так, чтобы пользователь не сталкивался с ошибками в сервисе:
- При изменении адресов в сервисе настройте переадресацию;
- Ограничьте возможность попадания пользователя без прав: не показывайте ссылки на страницу, либо делайте их неактивными;
- Обеспечьте бесперебойную работу сервиса.
Когда использовать
Только для 400-х и 500-x ошибок.
Это коды состояния HTTP, принятые Консорциумом Всемирной паутины (W3C) в 1992 году.
403 — доступ запрещен,
404 — запрашиваемый ресурс не найден,
500 — ошибка сервера, и другие...
Не используйте для ошибок, которые происходят внутри сервиса, и при этом остается доступ к сервису в целом. Например: ошибки очереди печати, или ошибка при загрузке файла неправильного формата.
Такие ошибки нужно показывать прямо в интерфейсе или в модальном окне.
Не используйте одну страницу для всех видов ошибок. Нужно подготовить внятный текст для решения конкретной проблемы.
Структура страницы
Страница должна отличаться от обычных страниц сервиса, быть короткой и информативной — так пользователь быстрее поймет, что пошло не так.
Страница состоит из блоков:
- Логотип сервиса;
- Заголовок страницы;
- Текстовый блок с причиной ошибки и возможным решением;
- Контакты техподдержки.
Для 404 ошибки можно добавить поиск по сайту, или предложить вариант наиболее близкий к тому, что ввел пользователь. Особенно это актуально для поисковых сервисов.
Связь с сервисом
На странице должны присутствовать лого сервиса и ссылка на главную, либо основные разделы.

Неправильно
Заголовок
Заголовок должен кратко объяснить что случилось.
Рядом с заголовком укажите код ошибки. Это поможет техподдержке быстрее понять, что случилось, если пользователь объясняет проблему словами — по телефону или в чате.

Причина ошибки
Если это необходимо, опишите ошибку чуть подробней, но не углубляйтесь в технические детали. Укажите причину, почему она могла возникнуть.
Неправильно
Запрос URL /sea9679879 не найден на этом сервере
Правильно
Возможно, вы ошиблись, набирая адрес, или страница удалена.
Это не обязательный блок, иногда достаточно заголовка.
Решение
Помогите пользователю найти выход из ситуации и продолжить работу, предложите возможные действия для устранения ошибки.
Например:
- Вернуться на главную и повторить последнее действие;
- Закрыть браузер и войти еще раз;
- Перезагрузить страницу.
Если предпринятые действия не работают, предложите ему сообщить об ошибке в техподдержку.
При 404 ошибках нельзя делать автоматический редирект на главную. Пользователю будет проще исправить ошибку в адресной строке, если адрес был набран неправильно.
При 403 ошибках обязательно давайте ссылку на выход и повторную авторизацию, пользователю будет проще войти с другой учеткой, если он ошибся с реквизитами при входе.
Контакты техподдержки
У пользователя должен быть выбор, как обратиться в техподдержку — отправить сообщение на почту, в чат или заказать обратный звонок.
Команда сервиса сама решает, какие способы обратной связи предоставить. Если нет технической возможности добавить на страницы ошибок чат с техподдержкой или форму заказа обратного звонка — можно ограничиться ссылкой на электронную почту или телефоном техподдержки.
Чтобы техподдержка сразу поняла, что случилось, в обращение должна автоматически прикладываться информация об ошибке.
Если это массовая ошибка не по вине пользователя, и команда сервиса уже устраняет её, не указывайте контакты техподдержки.

Язык общения
Коротко и понятно объясните, что произошло и что делать. Избегайте технических терминов и сленга. Напишите, что произошло, с точки зрения пользователя, а не с точки зрения системы.
Пользуйтесь правилами редполитики.
Неправильно
Ошибка e-ecb00676. Произошла критическая ошибка.
Извинения
Извиняться нужно, если проблема произошла по нашей вине. Если проблема возникла не по нашей вине, извиняться нельзя.
При ошибке 500 мы подводим пользователя — он не смог воспользоваться сервисом, когда это было нужно. В этом случае извиниться в сообщении обязательно.
Правильно
Извините, сервис недоступен. Мы знаем о проблеме и уже занимаемся ей.
При ошибке 404, когда пользователь ввел неправильный адрес, или пришел по устаревшей ссылке, мы покажем ошибку без «извините». В таких случаях нужно просто сообщить о проблеме.
Графика
Ошибка мешает пользователю выполнить его задачу и прерывает сценарий. В такой момент даже, казалось бы, милая и веселая графика может вызвать у пользователя негативные эмоции.
Если вы используете в сервисе свои изображения - они должны быть без эмоциональной нагрузки. Постарайтесь избегать использования смайликов и изображений животных.

Не рекомендуется
HTML-шаблоны страниц
Используйте их как основу для страниц ошибок вашего продукта. Это решение с общими рекомендациями, которое подойдет всем продуктам Контура.
Если у вашего продукта сложился свой язык общения с пользователям, можно использовать свою графику, предварительно тестируя её на пользователях.