понедельник, 17 августа 2015 г.

50 примеров креативного оформления страницы 404


В данном обзоре предлагаю вам ознакомиться с большой подборкой вариантов оформления страницы 404, старался отбирать только самые интересные и запоминающиеся. Для начала немного теории и мнение, сложившиеся после просмотра полсотни сайтов.
Что же все таки значит ошибка «404 Not Found (Не найдено)»? Если говорить техническим языком:
Сервер понял запрос, но не нашёл соответствующего ресурса по указанному URI.
Другими словами, причина ошибки следующая: посетитель переходит на адрес, по которому раньше находился документ, а в данный момент он не существует, причин этому может быть множество: изменение постоянных ссылок, автор страницы удалил документ, посетитель перешел по неверно набранному адресу страницы и т.д.
Страницу с ошибкой 404 можно использовать и с пользой, она может содержать не только ответ сервера, а также может и должна направить пользователя на другую страницу вашего сайта.
Основные правила при оформлении страницы 404:
— иметь ссылки на другие страницы сайта (именно ссылки, так как в очень многих примерах логотипы или картинки некликабельны);
— контактные данные владельца сайта (пользователь может связаться с автором и к примеру попросить выложить несуществующий материал повторно, исправить ссылку и т.п.);
— иметь оформление, соответствующее основному дизайну сайта.
Некоторые идеи, которые появились у меня, после подготовки обзора:
— сделали креативную страницу 404, напишите новость о ней, возможно, она появится в подобных обзорах и обеспечит дополнительный приток посетителей;
— сделайте красивую кнопку, ведущую на главную страницу сайта, ведь, несомненно, ее захотят нажать;
— логотип должен быть кликабельным;
— разместите анонсы лучшего материала на страницу с ошибкой;
— контекст на 404 странице, может быть очень рентабельным;
— на некоторых сайтах заметил автоматическое перенаправление на главную или предыдущую страницу.
Итак, переходим к обзору (каждый пример имеет картинку-превью, ссылку на страницу с ошибкой и краткое описание сайта):
Carsonified
Креативное агентство специализирующееся на разработке веб-приложений
YouCastr
Вещание местных спортивных соревнований
Unit Interactive
Студия веб-дизайна
Wufoo
4. Wufoo
Online-приложение для разработки веб-форм
GDZLLA
5. GDZLLA
Сервис для работы с twitter и flickr. Страница выполнена на флэш
Agens
6. Agens
Медийная реклама в играх
Frye / Wiles
Студия веб-дизайна
Product Planner
Планировщик для разработки веб-приложений
Jackfig
9. Jackfig
Студия веб-дизайна
Blizzard Entertainment
Разработчик WarCraft, StarCraft и Diablo
Huwshimi
11. Huwshimi
Блог фрилансера из Австралии
Springload
Студия веб-дизайна
i love typography
Любительский блог о типографике
nclud
14. nclud
Студия веб-дизайна
deviantART
Сообщество дизайнеров
Newspond
16. Newspond
Новостной сайт
HootSuite
17. HootSuite
Клиент для twitter
Jamie Huskisson
Блог PHP-программиста
Vimeo
19. Vimeo
Популярный видео-хостинг
Surfing On Static
Сайт музыкальной группы
GOG.com
21. GOG.com
Обзор культовых игр, которые получили всемирное признание. Полное название сайта Good Old Games
Digitalmash
Портфолио австралийского дизайнера
iStockphoto
Онлайн-магазин фотографий, графических изображений и флэш
GregOne
24. GregOne
Сайт французского дизайнера
Kidmondo
25. Kidmondo
Онлайн-журнал для родителей
CSSREMIX
26. CSSREMIX
Каталог CSS-дизайна
MailChimp
27. MailChimp
Управление Email-рассылками
Robo.to
28. Robo.to
Что-то на подобии создания визитной карточки. Страница выполнена на флэш
Deaxon
29. Deaxon
Студия веб-дизайна
OnWired
30. OnWired
Студия веб-дизайна
CoTweet
31. CoTweet
Клиент для twitter, решающий бизнес-задачи
Popscreen
32. Popscreen
Видео-хостинг
Fubiz
33. Fubiz
Блог о дизайне
creationthing.com
Сайт-визитка дизайнера
Object Adjective
Студия веб-дизайна
Dundee Living
Сайт-визитка
Acro Media Inc
Студия веб-дизайна
Astuteo
38. Astuteo
Студия веб-дизайна
Brightkite
Сервис похож на twitter, основной фишкой считается привязка к картам Google
Leap Anywhere
Социальная благотворительная сеть
247 media studios
Студия веб-дизайна
Turbomilk
42. Turbomilk
Отечественная веб-студия
Chris Jennings
Блог веб-разработчика из Майами
Ferdaze.com
Форум. Страница выполнена на флэш
Your Web Job
Поиск вакансий для веб-разработчиков
Lookitsme
46. Lookitsme
Социальная сеть знакомств
Tele2
47. Tele2
Оператор сотовой связи
Heinz
48. Heinz
Кетчуп Heinz
WooThemes
49. WooThemes
Разработчик тем для WordPress
Хабрахабр
Хабр знают многие...
Ну и в заключении хочется сказать, что сам никогда не делал толковых страниц с ошибкой 404, то времени нет, то желания, вам же рекомендую не следовать этому примеру, а создать интересный дизайн, который будет красоваться в подобных обзорах.
PS: обзор является первым пробным материалом на блоге, не знаю насколько у меня получилось, но я старался ориентироваться на опыт наших западных коллег, к тому же сам очень люблю паттерны и в свое время собрал их огромное количество. Указывайте на ошибки и пожелания в комментариях. Следующие несколько статей будут не такими обзорными, но тем не менее полезными для любителей WordPress.

0 коммент.:

Отправить комментарий