Лучшие страницы 404 — примеры дизайна

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

Абра-кадабра!

Ребята, мне не нужны ваши инструкции и составлять заявку я не хочу. Я хочу купить то, что присмотрел… Прощайте!

Not found страницы нужны и важны как часть маркетинговой стратегии любого сайта коммерческой направленности. Если клиент может уйти из-за загрузки страницы на 0,0001 секунду дольше, чем он готов ждать, дурацкая страница 404 тем более способствует этому. Наоборот — правильно оформленная поможет понять, что случилось, где он находится в данный момент и что теперь делать.

В статье мы рассматриваем 18 примеров страниц 404, которые принадлежат сайтам с разной тематикой. Мы ставили цель показать многообразие их оформления — и удачное, и не очень удачное. И очень неудачное.

Давайте посмотрим, что получилось!

Присоединяйтесь к нашему Telegram-каналу!

• Теперь Вы можете читать последние новости из мира интернет-маркетинга в мессенджере Telegram на своём мобильном телефоне.
• Для этого вам необходимо подписаться на наш канал.

Разберем лучшие страницы 404-ошибки

Адамас. Магазин ювелирных украшений

Страница 404 «Адамас»

Особенности

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

Личное мнение

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

DNS. Интернет-магазин цифровой и бытовой техники

Страница 404 DNS

Особенности

• Графическая составляющая страницы прямо показывает, что мы на сайте DNS;
• есть кнопка с CTA «Перейти на главную«: это лучше просто ссылки;
• страница подгружает адреса магазинов вашего города.

Личное мнение

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

Garry Print. Магазин одежды с принтами

Страница 404 Garry Print

Особенности

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

Личное мнение

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

Еще чуть-чуть, и я снова с вами!

Kokoc.com. Продвижение сайтов

Страница 404 Kokoc.com

Особенности

• Трудно не заметить вертикальную «404» на странице;
• пользователю доступно главное меню;
• он может перейти на главную страницу, изучить услуги компании и ее кейсы;
• форма захвата готова помочь пользователю… стать клиентом компании. Неожиданно (нет)!

Личное мнение

Только не говорите, что не увидели здесь аллюзию на фильм «Изгой» с Томом Хэнксом в главной роли. Мы никогда не забудем тебя, Уилсон!

Не время унывать. Нам с тобой еще сайты продвигать!

Infiniti. Автомобильный салон

Страница 404 Infiniti

Особенности

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

Личное мнение

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

Konsoleta. Интернет-магазин белья и купальников

Страница 404 Konsoleta

Особенности

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

Личное мнение

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

Zlatoust Watch. Интернет-магазин часов

Страница 404 Zlatoust Watch

Особенности

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

Личное мнение

«Нет такой страницы» — не самая корректная формулировка проблемы. Хорошо, что можно перейти в каталог часов.

Лабиринт. Интернет-магазин книг

Страница 404 «Лабиринт»

Особенности

• Пользователю доступно главное меню сайта;
• варианты для перехода с 404 страницы — это скидки и подарки, а также главные книги по мнению редакции;
• маркетологи «Лабиринта» не зря едят свой хлеб. Даже 404 страница активно продает.

Личное мнение

Являюсь многолетним клиентом «Лабиринта» и не перестаю радоваться дружелюбию его сайта. А скидка в 40 % (см. под логотипом) всегда подпитывает любовь читателей к интернет-магазину.

Мебельный континент. Интернет-магазин мебели

Страница 404 «Мебельный континент»

Особенности

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

Личное мнение

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

• пользователь в этот момент мог искать не товар;
• «снят с публикации» — странная формулировка. Товара вообще нет или он отсутствует только на сайте?

Читайте также:

Как увеличить конверсию сайта: 30 рабочих способов

MED-магазин.

Товары для красоты, здоровья и спорта

Страница 404 «MED-магазин»

Особенности

• Пользователям по-прежнему доступны главное меню и каталог товаров;
• 404 страница продает, потому что обещает 5 % скидки на товары по промокоду 404;
• в тексте также интересуются, что пользователь не смог найти на сайте — вот это забота о покупателе!

Личное мнение

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

Мир охоты. Сеть магазинов

Страница 404 «Мир охоты»

Особенности

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

Личное мнение

Так и не понял, почему ноль в «404» оформлен как спасательный круг. Скажете, что есть рыбалка? Соглашусь, но ассоциация все равно слабовата. Я бы стилизовал «ноль» под прицел винтовки.

Много сна. Товары для ночного отдыха

Страница 404 «Много сна»

Особенности

• Пользователю не доступны навигационные элементы сайта — главное меню и футер
;
• вариант решения — переход на главную страницу — оформлен в качестве кнопки
;
• есть товарные рекомендации.

Личное мнение

То, что есть указание скидок на товарах в рекомендациях и количество отзывов на каждый — бесспорно, хорошо. Но на каком основании они формируются? Правильно: на рандомном!

Музмарт. Интернет-магазин музыкальных инструментов

Страница 404 «Музмарт»

Особенности

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

Личное мнение

Если запрошенная страница не найдена, предложите пути решения, а не просто ссылки. И, пожалуйста, не ломайте музыкальные инструменты. К слову, все неверно введенные адреса сайта преобразует в вид https://muzmart.com/404.

PETSHOPRU. Товары для животных

Страница 404 PETSHOPRU

Особенности

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

Личное мнение

Котик играет с клубком на сайте товаров для животных (посмотрите по ссылке — это не просто картинка, а анимация). Если это не милота, то что милота?!

Читайте также:

Как правильно работать с негативными отзывами в интернете

Спортмастер.

Интернет-магазин спортивных товаров

Страница 404 «Спортмастер»

Особенности

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

Личное мнение

Мне очень понравилась формулировка «возможно, ее никогда не было». Это прямо-таки готовый ответ на ввод адреса с несуществующим значением — посмотрите на ссылку, после того как перейдете по ней из раздела.

Wildberries. Маркетплейс разнообразных товаров

Страница 404 Wildberries

Особенности

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

Личное мнение

Формулировка «По вашему запросу ничего не найдено» здесь смотрится как нечто чужеродное. Такое сообщение вполне годится после того, как ввел название определенного товара в поисковую строку сайта и там ничего не нашлось. Мы же получаем такой текст на странице при вводе URL сайт в адресную строку браузера.

Все инструменты.ру. Инструменты для строительства и ремонта

Страница 404 «Все инструменты.ру»

Особенности

• Пользователю по-прежнему доступно главное меню и каталог товаров;
• в тексте страницы предлагается воспользоваться каталогом;
• переход на главную страницу оформлен как заметная кнопка;
• пользователь может также ознакомиться с популярными категориями товаров.

Личное мнение

Вы тоже заметили кнопки «Сказать спасибо» и «Пожаловаться» с правой стороны. Мне почему-то хочется сказать спасибо за такое оформление 404-й. Увидев то, что будет дальше, вы поймете, почему.

Copyblogger. Зарубежный блог по контент-маркетингу

Страница 404 Copyblogger

Особенности

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

Личное мнение

Как пишущий человек я оценил эту страницу 404, потому что ее текст — по сути реклама сайта Copyblogger. Цитирую начало:

Что-то пошло не так, потому что это страница с ошибкой. Эй, легко заблудиться! Copyblogger опубликовал более 3000 статей по коммерческому писательству, контенту и маркетингу на своем веб-сайте.

Как не надо делать страницы 404

Какая статья без антипримеров, благо в нашем случае их хватает. %&&$$&**#&&$$$ on this server

Но есть 404 страница еще страшнее…

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

Зайдите на сайт маститого маркетолога Сета Година и попробуйте ввести такой адрес страницы, который вызвал бы 404 страницу. Вы будете все время попадать на главную.

Ну нет у меня на сайте такой страницы. И что теперь?

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

Оригинальный текст для страницы 404 делает посетителей счастливыми

Jimdo  ·  08 December 2021

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

 

Но хороший сайт готов к подобному. Он распознает это как «Ошибка 404: Страница не найдена». Пользователи увидят страницу 404 и поймут, что произошло.

 

Ситуация решена, верно? Не совсем так. Ведь посетитель сайта все ещё не нашел искомую страницу. Когда он видит информацию «Страница не найдена», тогда пользователи, вероятно, просто уйдут с сайта.

 

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

 

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

 

 

 

Что показывает страница 404  Что обычно пишут для пользователей  Хорошие примеры для сайта  Как выполнить редактирование  Как предотвратить появление ошибки 404

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

 

 

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

• «Данная страница не может быть найдена» или «К сожалению, страница не существует».
• Более креативные владельцы сайтов предлагают интересные варианты. Например, предлагают посетить другие разделы своего сайта.

 

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

 

 

Решение проблем

 

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

 

 

Смешной текст

 

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

 

 

Полезный контент

 

Разместите на странице 404 активные ссылки на самые популярные страницы сайта. Вероятно, посетитель действительно искал одну из них.

 

 

Ссылки на социальные сети

 

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

 

 

Скидка или вознаграждение

 

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

 

 

 

На сайтах Jimdo на странице 404 размещается стандартное сообщение с текстом. Его несложно самостоятельно отредактировать через настройки:

• Перейдите к странице > Системные страницы
• Выберите «Страница не найдена / 404»
• Отредактируйте текст страницы.
• Опубликуйте на сайте.

 

Отличная страница 404 — это хорошо. Но ещё лучше, когда пользователи вообще не сталкиваются с этой проблемой. Чаще всего пользователи переходят на страницу 404 по двум причинам: «битые» ссылки или неправильный ввод URL-адреса.

 

Вот некоторые способы, чтобы предотвратить ошибку «Страница не найдена»:

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

 

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

 

Источник Блог Jimdo

Перевод WaterMillSky

 

 

 

 

Другие статьи Jimdo

 

 

 

 

© WaterMillSky 2012-2021

 

 

 

 

tagPlaceholderTags: Jimdo, Страница с ошибкой 404, Текст на странице 404

10 отличных примеров страниц ошибок 404 | by Weekday HQ

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

«СТРАНИЦА НЕ НАЙДЕНА» — пожалуй, самое неприятное, что можно увидеть на экране. Это страница, на которую никто не хочет попасть. Долгое время эта страница повторяла слова «разочарование» и всегда печально известна как «последняя страница Интернета».

Идея 404 родилась, как вы уже догадались, в комнате под номером 404, в которой располагались самые первые веб-серверы в ЦЕРНе.

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

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

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

Вот 10 примеров страниц ошибок 404, которые, по нашему мнению, были блестяще спроектированы.

1. Flipping Book

Концепция здесь перекликается с названием веб-сайта FlippingBook. На этой странице с ошибкой 404 рассказывается история супружеской пары, которая потеряла страницу из книги в домашнем хаосе. Напоминает ситуацию типа «Марли и я». Простой сине-белый цвет контрастирует с несколькими тонкими цветовыми вариациями, которые не кажутся слишком тяжелыми.

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

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

2. Behance.net

Эта страница не является страницей ошибки конкретного веб-сайта, а является одним из дизайнов, созданных визуальным дизайнером Майклом Цираки.

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

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

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

Бегите домой — отличный навигационный CTA для веб-сайта на тему ужасов, и я всегда ценю хорошую игру слов. 🙂

3. CSS-трюки

Эта страница с ошибкой — одна из моих любимых. Вы видите, что нет таких слов, как 404, ошибка, не найдено и т. д. На самом деле их 9.0020 вообще нет текста в обычном смысле. Тем не менее, ни один человек, использующий веб-сайт, подобный трюкам CSS, не смог бы понять смысл этой страницы. Это очень специфичная для домена страница ошибки , которая напоминает то, что означает веб-сайт, то есть язык веб-стилизации CSS.

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

4. Kwarter

Kwarter — это мобильная игровая платформа, работающая в режиме реального времени, и

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

Страница с ошибкой сначала начинается с того, что вы чувствуете вину за то, что попали на неработающую страницу, жирным шрифтом спрашивая вас — ВЫ СЧАСТЛИВЫ ТЕПЕРЬ? Но тут же берёт на себя очередь брать вину на себя, что видно из фразы — Наши плохие!

В настольном теннисе топ-спин — это очень агрессивный удар, и «теоретически» топсин может быть достаточно агрессивным, чтобы сломать биту на две части. Следовательно, эта страница имеет идеальный текст , и иллюстрацию . Навигационный CTA находится в контексте всей темы. Это не совсем делает очевидным, куда приведет вас кнопка SERVE AGAIN, но оставляет вас с любопытством, чтобы узнать это самостоятельно.

5. Магнит

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

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

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

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

6. Marvel

Я знаю, что вы думаете о Мстителях, но это Marvel — прототип веб-приложения и мобильного приложения.

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

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

7. Blue Fountain Media

Посетителю этого сайта предлагается два варианта. Он может либо вернуться назад, либо выбрать версию легендарной игры Pacman. Игра имеет правильную форму в цифре 404.

Я обязательно сыграю хотя бы в одну игру (и обязательно подсяду), прежде чем покину сайт. Простая цветовая схема и широкие возможности навигации — отличное дополнение.

8. EmailCenterUk.com

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

Эта страница не слишком фокусирует на CTA, , однако уловка, которую они здесь провернули, безусловно, может простить это.

Вам интересно узнать, что происходит, когда вы кого-то увольняете?

Вот он,

9. Amazon

Эта статья была бы неполной без фотографии очаровательной собаки.

Ши-тцу Соджу пришла, чтобы извиниться перед вами за то, что не смогла найти вашу страницу. Акцент на ИЗВИНИТЕ.

Вы можете Перейти обратно на домашнюю страницу, найти что-то на веб-сайте.

Да, еще забыл упомянуть, что вы можете встретить всех собак Амазонки. Снова отличный метод вовлечения пользователей .

10. Средний

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

Также ни с того ни с сего можно почитать несколько популярных статей о потерянности вообще, а почему бы и нет?

ЗАКЛЮЧЕНИЕ

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

Список страниц с ошибкой 404, упомянутый выше, действительно является ответом на вопрос, как повысить вовлеченность посетителей веб-сайта?

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

Я хотел бы знать ваши любимые страницы ошибок. Не стесняйтесь комментировать свои мысли ниже.

Нравится этот блог? Поделитесь им с друзьями как можно больше.

Создание 404 страниц с точностью до пикселя

Нравится Visual Inspector? Вашим друзьям это тоже понравится.

Распространяйте эту статью как можно больше. Это поможет нам расти органически, и мы будем благодарны.

Siftery предлагает вам пожизненную подписку на Visual Inspector всего за 49 долларов — https://www.canvasflip.com/visual-spector/siftery/

20 лучших примеров страниц с ошибкой 404

Фотография Саадии Минхас

Автор: Саадия Минхас, 25 января 2019 г.
Отмечен в креативность , дизайн , тенденции дизайна

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

Почему?

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

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

Здесь мы рассмотрим, как 20 крупных компаний обрабатывают свои страницы 404 — как они используют их, чтобы восстановить неудачный опыт перехода по мертвой ссылке, и как они берут на себя ответственность за сбой, перенаправляя своих пользователей на более зеленые пастбища, часто добавляя немного развития бренда и юмора одновременно.

1.

Амазонка

Привет собакам! Amazon использует страницу 404, чтобы дать вам некоторое представление о культуре их компании (включая обязательные изображения милых щенков). Amazon также немедленно берет на себя ответственность за ошибку (даже если это не их вина) — с помощью слова «SORRY» большими заглавными буквами, уведомляющего пользователя о том, что это не та страница.

2.

Flickr

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

3.

Adobe

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

4.

Гугл

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

5.

Awwwards

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

6.

Канва

Забавная маленькая игра — отличный способ развлечь потерянных посетителей, если у вас есть время собрать ее. Это определенно помогло ему попасть в этот список!

7.

Дрибббл

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

8.

Behance

Behance, похожий на Dribbble сайт, предлагающий визуальное вдохновение для дизайнеров, по сравнению с ним немного более стерильный. Подобно поисковой системе 00-х, они показывают просроченным посетителям список всех проектов, категорий и демонстрируют некоторые популярные дизайнерские проекты, чтобы помочь им вернуться в нужное русло.

9.

Новости дизайнера

Простота часто имеет свою силу. Страница Designer News 404 передает сообщение — бонусные баллы за то, что на ее реализацию не требуется месяц времени разработчика.

10.

Инстаграм

Простая страница с копирайтингом, граничащим с обвинением пользователя в ошибке (в отличие от Adobe, которые сразу берут на себя ответственность за ошибку и работают, чтобы помочь пользователю). Заголовок, который, если вы не читали глубже, может быть истолкован как «эта страница существует, но вы не можете получить к ней доступ». Этот день посетителей стал немного менее счастливым, увидев это.

11.

Основа интерактивного дизайна

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

12.

Ютуб

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

13.

eBay

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

14.

Этихад Эйруэйз

Копирайтеры Etihad 404 упустили памятку из-за краткости, потратив 3 строки, чтобы сообщить, что обычно достигается одной строкой, и в то же время дать пользователю несколько плохих советов ( Проверьте URL-адрес и попробуйте еще раз. Правда? Сколько в среднем пользователи правильно понимают, как форматируется URL-адрес? Кроме того, если вы находитесь на странице 404, повторная попытка волшебным образом не заставит ее внезапно работать).

15.

LinkedIn

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

16.

MailChimp

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

17.

Средний

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

18.

Лего

Немного эмоций может спасти плохую ситуацию — даже если это просто лицо виртуальной пластиковой игрушки. Лего отлично справляется с этой задачей.