Пн, 2/12/19 – 0:23 | No Comment

Высокотехнологичный улетный визуал – три слова характеризующие основную тенденцию веб-дизайна 2020. Скоро визуальная лаконичность в оформлении дизайнов будет мейнстримом Web’а. Идет объединение искусства …

Читать статью »
Маркетинг

О маркетинге в Интернете и эффективности сайта

Дизайн

Секреты веб-дизайна, примеры стильных сайтов

Wordpress

Самое современное для сайта на Wordpress

Шаблоны сайтов

Обзоры шаблонов: лучшие темы для сайта

Свой сайт

Как создать, оформить, сделать сайт лучше

Главная » Свой сайт

Оформляем красиво страницу 404-ой ошибки

1 июня 2013 Нет комментариев

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

  • Правильно писать адрес
  • Свои извинения за сложившуюся ситуацию
  • Объяснение факту случившегося и важности перехода на главную / др. страницы

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

Для сайта с коммерческим предложением подчеркните:

  • Рациональный подход к делу и разумную стратегию
  • Заявленную креативность своих дизайнеров
  • Исключительность и особенность своего бренда
  • Подлинное качество сервисов и продуктов
  • Готовности предложить нестандартные идеи и пути их решения

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

пример страницы 404 с забавным описанием

Ooops! Похоже нет того, что искал – страница не нашлась. Но если подумать: ничего ведь на самом деле и быть не может. В принципе. Концепция игры разума в процессе получения сенсорных ощущений от чего-либо. В конечном счёте, любовь – это все что вам нужно

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

красивая страница сайтакрасивая страница 404

Важна идея! — пример красивого оформления 404-й ошибки сайта

По оформлению страницы:

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

По настройке страницы:

После создания, файл страницы (например 404.html) разместите на сервере, сконфигурировав файл .htaccess. Для случая, когда сайт на Apache вверху файла .htaccess размещаем директиву ErrorDocument 404 /404.html (файл – в корне сайта) или ErrorDocument 404 http://www.site.ru/404/ (файл – не в корне сайта)

Убедитесь, что страница не индексируется поисковиками (возвращается правильный http статус ошибки). Запретить индексацию можно в robots.txt, дописав строчку  Disallow: /404.html.

Читайте также:  Как исправить ошибку 404 (не найдено) в WordPress

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

Варианты 404 страницы — идеи оформления

Bark Box

Помылся шампунем для собак – страница ошибки 404

Компания реализует продукцию для домашних питомцев: «Это же шампунь для собак…»

Pando

404: Page not found - определённо в этом его вина

404: Page not found — почти наверняка это он виноват

Mitra

404 страница из Рунета: стиль флэт с персонажами - агентство mitra.ru

На 404-ой странице веб-агентства, парой персонажей представлена команда профессионалов

Валенки водка

Страница 404 отечественного бренда: алкогольный сайт VALENKI™

Sumato Soft

Пример красиво и грамотно оформленной 404-й страницы - Sumato Soft

Похоже, нет такой страницы. Можете продолжить горевать, а можете:

  • Познакомиться с нами
  • Посмотреть работы
  • Написать нам

Комплето

У маркетинговой группы «Комплето» 404-я собрана из элементов оформления главной и внутренних страниц 

Story and Hear

404 страница с закольцованным видео (coub)

У онлайн видео-школы, тематичная 404-я страница с зацикленным видео (coub video)

Born Group

Анимированная черно-белая 404-я страница сайта дизайнерского агентства

Оопс, выглядит как будто-то все пошло не так, раз ты здесь очутился. На верный путь вернут эти ссылки: портфолио, сервисы, о нас

Coffeemate

404 на продающем кофейном сайте: Похоже, кто-то не выпил свой утренний кофе…

Stugoo

Креативная ошибка 404: страницу съели космические монстры

404 страница на любителя чудовищ из space тематики… была съедена Юникроном. Трансформер: Я вас сюда заманил. Эффектная Ghost-кнопка: Никто на заманит Мегатрона!

Imaginovation 

lost in space 404 not found

Страница 404-й ошибки вида Lost in Space… Возвращайся на главную

Lander 

Тематическая 404-я страница ошибки красиво оформлена под плоский стиль сайта

Символичная страница ошибки Landing page платформы: «Наша ракета сбилась с курса»

Pixelemu

красивая 404 страница в стиле Flat

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

Checkmate

404 страница с забавной детской иллюстрацией

Мультяшая страница ошибки 404: даже Дора не может найти эту страницу. Возвращаемся домой

Piccsy 

яркая 404 страница

Вы куда-то не туда забрели, но иллюстрации R. Klonek стоит посмотреть 

Yougov 

404 страница не найдена

Персонаж  аналитической компании YouGov озадачен ошибкой: 404 страница не найдена

Fish Finger 

Занимательная страница 404 ошибки

Похоже вы высадились на 404-й. Не волнуйтесь за шеф-повара, гарантируем — будет жив

We Heart It 

Занимательная страница 404

Оппс! Приземление возле движущейся цели. Похоже страница сменила адрес или более не существует. Не падайте духом и возвращайтесь на сайт

Supremo

Прикольная картинка на странице с ошибкой 404

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

Quartzy

Неудачный эксперимент: ошибка 404

Эксперимент не удался — 404 страница ошибки от научно-маркетинговых исследователей