404 пост

03cd83ae32a84ce93897ff0951d8d3b1.jpgЭтот пост знаковый для нашего блога. По счёту он, ни много ни мало, четыреста четвёртый. В честь этого мы решили написать о том, как нами был когда-то использован мощный потенциал страницы 404 на Одноклассниках. А заодно составили небольшую подборку необычных и интересных страниц с других сайтов.

Каждый день социальной сетью Одноклассники пользуется более 40 млн человек. И примерно 150 тысяч из них натыкается на страницу 404. Доля мизерная, всего 0,37% от общего количества посетителей. Но в абсолютном выражении очень даже приличная посещаемость. «Вашу бы энергию, да в мирных целях», — подумали мы и решили с пользой использовать этот трафик. На тот момент страница 404 выглядела так: 54f5be36b0fae4e559be39346be0289c.png

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

напомнить людям о вымирании редких видов животных; познакомить поближе с самим Фондом охраны дикой природы WWF; дать посетителям возможность сделать личный вклад в сохранение глобальной природной экосистемы. В результате новая страница 404 стала выглядеть так: 7b2a93f723ee14e8308ec46f53175c52.jpg

Сверху шёл текст самой ошибки, чтобы пользователь сразу понимал, куда он попал. Рядом с логотипом Одноклассников мы разместили логотип WWF. Ниже шёл информационный блок, состоявший из фотографии представителя какого-либо вымирающего вида (была собрана небольшая подборка) и краткого описания. К тому же с этой страницы вела ссылка на официальную группу WWF в Одноклассниках. Первая и вторая поставленные задачи были решены. А ради третьей задачи мы разместили в группе WWF специальный iframe, через который посетители могли попасть на сайт самого фонда и сделать пожертвование.

a55559d4a1e016778c0170b2b65d5fc5.jpg

Результат превзошёл наши ожидания — около 50% случайных посетителей страницы 404 переходили по ссылке в группу WWF. Этот проект длился один месяц, и на момент его окончания группа выросла до 30 тысяч человек. Более того, по данным самого WWF, в течение этого месяца пользователи Одноклассников сделали около 7% всех пожертвований. Однако в действительности эта доля была, скорее всего, заметно выше. Дело в том, что, перейдя с Одноклассников на сайт WWF, не все посетители сразу делали пожертвование. Некоторые возвращались позже, но уже напрямую, а не окольными путями.

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

6d419a34aa45acbbe3dabae267b2c7f1.jpg

Это фонд содействия в усыновлении детей-сирот. Мы сохранили такую же структуру страницы: логотип, фотография, описание. И всего за две недели, которые длился этот проект, было 18 обращений от потенциальных приёмных родителей. А первых детей усыновили уже через месяц после старта проекта.

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

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

Очень экспрессивная иллюстрация, с юмором.

275cf50de96476e9b6c97f07f32a486a.jpg

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

7d286cce2e2a5f2548bb900515aedc19.jpg

Анимированная страница, на которой раскачивается жирный воробей азиатского происхождения.

60d2a68383526c7719d7ed6c797cd24e.jpg

Торжество минимализма, а также дизайна над функциональностью и полезностью.

01b513352e29e98784a2ff8a72382a27.jpg

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

c8d0bddf05e60bf19431931da57814b8.jpg

Ещё один пример исключительно дизайнерской страницы. Стильно и красиво, а странность картинки заставляет остановиться, цепляет внимание.

361c597a5fe8fd93dffdde7f4e33c530.jpg

Mail Chimp Всегда креативно подходят к оформлению 404 страницы. Долгое время на этой странице гостил Гомер Симпсон, а сейчас его заменяет замороженная обезьянка. Анимированная страница с символом компании, замороженном в кубе льда.

d35604c6fb71d3f98e591f081e9373a9.jpg

Анимированная интерактивная страница с красивыми эффектами. Правда, тяжеловата.

f2601efe6888af6a76681c32942f0fcc.jpg

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

7fb5432c8796a6c9a8d4bdfc34512255.jpg

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

859051b7ec8c59e8db3ad469b976b998.jpg

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

6e594158836fa21db54e663b98d02ab5.jpg

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

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

© Habrahabr.ru