Пример страницы 404:

Ошибка 404 означает, что страница не найдена (Not Found). Хорошо это или плохо для SEO? Если рассматривать в общем, то это нормально. Google рассматривает появление ошибок 404 как естественный процесс работы сайта. Вот, что говорит справка:

Но не все так однозначно. На практике сайт действительно может «просесть», если ошибка 404 появилась на странице, которая приносит трафик на сайт.

В любом случае, лучшим решением с точки зрения SEO будет разобраться, почему возникла ошибка 404 Not Found. Выявление причины подскажет наиболее верный путь устранения ошибки.

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

Почему так происходит:

• Ошибка в URL. Пользователь неправильно ввел ссылку или в нее были внесены изменения на стороне сайта. 
• Страница переехала или удалена. Это следствие изменения структуры сайта, технических работ или банально «факап» контент-менеджера.

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

• Google вебмастер. Бесплатный и простой в использовании инструмент. Аудит сайта доступен в отчете “Сканирование”, вкладка “Ошибки сканирования”.
• Seoto.me. Мощный сервис, способный проанализировать даже самые крупные сайты. Но платный.
• Serpstat.com. Инструмент отличается широким функционалом. Кроме битых ссылок, показывает качество оптимизации домена и график глубины проверки. Позволяет проанализировать сайты конкурентов. Все платно.
• Check My Links. Это бесплатный плагин для Google Chrome. Его минус в том, что он работает постранично, проверить весь сайт сразу нельзя. 

Ольга Ильюхина, SEO-специалист Webpromo:

«Все инструменты для проверки сайта можно разделить на онлайн и офлайн, которые в свою очередь делятся на массовые и постраничные. Для массовой проверки страниц можно использовать Screaming Frog SEO Spider, Netpeak Spider, Xenu, а также такие сервисы, как Serpstat. В случае проверки только одной страницы можно выбрать наиболее подходящих вариант среди букмарклетов (например, проверка кода ответа в bertal.ru), расширений для Chrome (Redirect path), плагинов для многих CMS и т.д.»

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

Читайте также: Как написать текст о компании и оформить страницу «О нас». От рекомендаций до вдохновляющих идей

Что думает пользователь, увидевший такую страницу? Скорее всего «Ой, что это? 404 не найдено? Непонятно… Пойду-ка я на другие сайты». И будет прав. На приведенном выше скриншоте нет абсолютно никакой полезной информации, нет ни малейшей попытки что-то объяснить пользователю, удержать его и помочь ему.

Шаблон информативной страницы 404 зависит от специфики сайта. Однако есть несколько правил, обязательных для всех:

1. Дайте пользователю понять, что он попал на тот сайт, который искал. Важную роль в этом играют хедер (шапка сайта) и футер (подвал сайта).
2. Объясните, почему пользователь видит на странице ошибку, а не контент, за которым пришел. Желательно, простыми и понятными словами.
3. Разместите в видимой зоне контактные данные (телефоны, e-mail и т.д.), чтобы пользователь знал, куда ему обращаться со своим запросом.
4. Добавьте кнопку возврата на главную страницу, чтобы пользователь мог повторить свой сеанс и вновь попробовать найти то, что ему нужно.
5. Не стоит настраивать 301 редирект на главную страницу. Пользователь не поймет, почему он попал не туда, куда хотел. Возможно, он предпримет несколько повторных попыток, но потом уйдет.
6. Интернет-магазинам полезно добавлять на страницу 404 поисковую строку, чтобы пользователь, столкнувшись с ошибкой, мог сразу найти альтернативный товар. Если в URL прописаны категории ― добавьте в шаблон ссылки на похожие товары или тематические статьи.
7. Помните, что любая ошибка вызывает негатив со стороны пользователя. Отвлеките его анимацией или мини-играми. Это повысит шанс, что разочарованный посетитель задержится на сайте.
8. А еще люди обожают жаловаться. Дайте им такую возможность! Добавьте строку обратной связи с предложением сообщить вам о проблеме. Это проявление заботы о пользователе и дополнительная возможность сгладить негатив.

Совет! Если ваша страница с ошибкой 404 Not Found будет не просто информативной и полезной, но и визуально красивой ― пользователь получит приятный опыт взаимодействия с сайтом и уровень его стресса существенно снизится.

Читайте также: Что нужно знать о поведении потребителей в 2021 году

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

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

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

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

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

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

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

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

• карусель товаров;
• кнопка “На Главную”;
• кнопки категорий услуг;
• строка поиска;
• кнопка вызова онлайн-чата.

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

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

Также читайте другие статьи в блоге Webpromo:

• Офлайн-конверсии Facebook Ads и Google Ads. Как повысить качество лидов?;
• Что такое SEO-тексты и как их правильно писать? Научитесь, чтобы оказаться в Топе Google;
• Performance Marketing в диджитал – тренды 2021, которые нужно внедрить;

И подписывайтесь на наш Telegram-канал про маркетинг.

Лучшие страницы 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 страницу. Вы будете все время попадать на главную.

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

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

20+ потрясающих примеров страниц 404 (2022)

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

Поддерживайте мотивацию своих посетителей с помощью тщательно отобранного списка самых забавных страниц 404.

Посадка на «страницу не найдена» может реально свести посетителей с ума.

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

Содержание

• Что такое страница 404 и зачем она нужна?
• 1. Bluegg — Игра слов
• 2. Дрифт — встраивайте причудливые видео
• 3. 9Gag — Включить абсурдные активы
• 4. Маховик — Минималистичный и тонкий юмор​
• 5. Slack — смешно, потому что странно
• 6. Дэн Вуджер. Иногда достаточно милой иллюстрации.
• 7. Team Coco — Глупые гифки
• 8. Comedy Central — истеричный, но фирменный
• 9. NMFH — черный юмор в лучшем виде
• 10. HBO – используйте внутренние шутки​
• 11. The New Yorker – Воспользуйтесь преимуществами того, что уже работает​
• 12. Blizzard — Удивите свою аудиторию
• 13. eharmony — Отнеси тему к своему сервису
• 14. Distilled — Акценты забавны
• 15. Emailcenter — сделайте его личным
• 16. IMDB — Быть смешным требует времени и усилий
• 17. Orangecoat — добавьте визуальные диаграммы
• 18. Github — шутки
• 19. CSS-трюки — меньше да больше смеха
• 20. Mashable – Забавный взгляд на потерянное
• 21. Taco Bell — Еще один глупый смех
• 22. Стив Ламберт — Признайте неловкость
• 23. SHOCK — Шаблон страницы 404 для продажи

Что такое страница 404 и зачем она нужна?

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

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

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

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

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

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

Вот 23 отличных примера хорошо выполненных 404 страниц.

1. Блюгг — Игра слов

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

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

2. Дрифт — Встраивайте причудливые видео

Элемент неожиданности является ключом к успешному предложению новых 404-х.

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

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

3. 9Gag — Включить абсурдные активы

Стив Джобс сказал: «Творчество — это просто соединение вещей». Трудно заметить, но 9Gag создал творческую связь между одной из самых популярных гифок, растерянным Траволтой, и их страницей 404. Результат может не показаться смехотворным «ха-ха», но это яркий пример связи одного из визуальных активов вашего бренда со «ненайденной страницей».

4. Маховик — Минимальный и тонкий юмор

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

5. Slack — это смешно, потому что странно

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

6. Дэн Вуджер — Иногда достаточно милой иллюстрации

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

Вуджер ловко связывает посетителя со своим портфолио строкой «Вероятно, вы искали мою иллюстрацию…»

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

8. Comedy Central — истеричный, но фирменный

Comedy Central был достаточно умен, чтобы отобразить несколько персонажей из своих шоу и приписать каждому из них цитату, связанную с 404 страницей. Например, Тревор Ноа из The Daily Show появляется с растерянным лицом и цитатой, относящейся к сегменту «Момент дзен» из его шоу.

9. NMFH — Черный юмор в лучшем виде

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

10. HBO — использование внутренних шуток

HBO 404 — один из моих любимых. Он показывает, как использовать внутренние шутки, чтобы вызвать смех. В этом случае они добавили изображение «Умерь свой энтузиазм» за буквами 404 и добавили текст: «Похоже, эта ссылка красивая, красивая, довольно неработающая». Любой, кто видел шоу, сразу понял это.

11. Житель Нью-Йорка – Воспользуйтесь тем, что уже работает

Пример New Yorker показывает, как взять и без того забавный актив бренда, связанный с потерей, и разместить его на странице 404. Мультфильм из выпуска 2011 года, на котором изображена мышь с GPS — идеальный мультфильм для использования на странице «страница не найдена».

12. Blizzard — Удивите свою аудиторию

Вот еще один дизайн страницы 404, оригинальный и неожиданный. У Blizzard Entertainment есть разбитое окно, меню, которое, кажется, упало, и обвинение: «Благодарю (поздравляю). Вы его сломали».

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

13. гармония — Связать тему с вашим сервисом

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

14. Дистиллированный — Акценты забавны

Distilled есть комичная британская беседа, наполненная такими фразами, как «старый приятель» и «взорван». Они называют свой 404 «Четыреста четвертое сообщение об ошибке», что само по себе забавно.

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

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

15. Электронный центр — сделайте его личным

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

16. IMDB — Быть смешным требует времени и усилий

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

17. Оранжевое пальто — добавление визуальных карт

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

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

18. Github — Шутки

 Аудитория Github — разработчики-гики. Их вдохновленная «Звездными войнами» сцена с талисманом Octocat и цитатой «Это не та веб-страница, которую вы ищете» является подходящим посланием для их аудитории. Обратите также внимание на то, как размещение панели поиска в центре обеспечивает отличное решение для навигации с этой страницы.

19. CSS-трюки — меньше да больше смеха

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

20. Mashable — Забавный взгляд на потерянное

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

21. Taco Bell — Еще один глупый смех

Taco Bell известен как бренд, умеющий пошутить в социальных сетях. Их страница 404 также вызывает смех с ее анимацией тако и глупым текстом: «СТРАНИЦА, КОТОРУЮ ВЫ ИСКАЛИ, НЕ СУЩЕСТВУЕТ (если только вы не искали страницу с анимацией тако, спотыкающегося и буквально проливающего бобы. Если это случае, он точно существует, и вы его точно нашли.)’

22. Стив Ламберт — Признайте неловкость

И последнее, но не менее важное: эта забавная страница 404 была создана практически без бюджета и спецэффектов. Как будто переход по неработающей ссылке недостаточно неудобен, Стив Ламберт поднимает ее на новый уровень, представляя «Самые неудобные 404 ненайденные страницы в Интернете». На странице показано видео, на котором Ламберт странно бормочет посетителю. Видео напомнило мне о неловких моментах Кремниевой долины.

23. ШОК — Шаблон страницы 404 для продажи

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

ШОК минимальная страница скоро появится, которая имеет 6 стилей фона на любой вкус.

Заключение

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

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

Ищете свежий контент?

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

Вводя свой адрес электронной почты, вы соглашаетесь получать электронные письма Elementor, в том числе маркетинговые электронные письма,
и соглашаетесь с нашими Условиями и положениями и Политикой конфиденциальности.

Бен Пайнс

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

Вам также может понравиться

Комментарии

Запустите свой облачный веб-сайт

Что такое страница 404? Полное руководство с примерами

Содержание

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

Следует ли использовать собственную страницу ошибок?

Руководство на 404 страницы

Примеры на 404 страницы

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

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

Это может произойти по разным причинам, например, если страница была удалена, перемещена или переименована, а вы не настроили вместо нее переадресацию 301.

При возникновении ошибки 404 пользователь увидит общее сообщение об ошибке «404 Страница не найдена».

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

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

Как ошибка 404 влияет на SEO?

Хотя ошибки 404 не оказывают прямого влияния на SEO, они могут косвенно повлиять на рейтинг вашего сайта в результатах поиска.

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

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

Что такое программные ошибки 404?

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

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

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

Как исправить ошибку 404?

Если вы видите на своем веб-сайте ошибку 404, вы можете исправить ее несколькими способами.

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

Если URL-адрес больше не существует, в противном случае пользователь может не понять, почему он попал на эту страницу.

Создание пользовательской страницы 404

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

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

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

Примеры страниц с ошибкой 404

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

1. Умный пассивный доход

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

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

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

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

2. Nintendo

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

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

3. Гордон Рэмси

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

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

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

4. Страница Amazon 404

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

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

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

5. Marie Forleo fun 404 page

Это красивая жирная страница 404 от Marie Forleo. Снова предлагает 2 простые URL-ссылки на ее домашнюю страницу и возможность просмотра видео.

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

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

6. Щепотка Yum

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

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

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

7.

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

Он состоит из очень простого дизайна со ссылками для подключения к социальным сетям или для подписки на информационный бюллетень.

В нижнем колонтитуле также есть дополнительная форма подписки, предоставляющая еще одну возможность подписаться.

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

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

8. Yoga Journal

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

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

Из приведенных выше примеров видно, насколько они разнообразны по дизайну.