404 пост



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

    Наш опыт

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



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

    В результате новая страница 404 стала выглядеть так:



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



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

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



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

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

    У других

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



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



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



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



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



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



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



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



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



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



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



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



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

    На этом выставка достижений 404 закончена. Если у вас есть на примете другие варианты необычных и красивых страничек, выкладывайте ссылки в комментарии.
    Mail.ru Group
    1,217.15
    Building the Internet
    Share post

    Comments 34

      –36
      Я вот такую страничку смастерил :) dumpz.org/asdfasdfasd
        +13
        Очень понравилась идея страницы 404 с самим Фондом охраны дикой природы WWF. У меня на каждом сайте присутствуют в выдаче страницы 404 и если к ним применить подобную социальную рекламу, думаю будет польза для WWF и других подобных организаций.
          +1
          Соглашусь. В идеале не плохо было бы создать сервис, позволяющий вставлять элемент на свою страницу, который бы генерировал контент уже автоматически. Что-то вроде «Одноклассники 404 error API». С удовольствием бы ставил на страницы ошибок.
        +1
        За идею как раз брал страницу от Blizzard
        nn-sp.ru/404
          +3
          А если страницу вниз прокрутить, то не падает дальше.
            +3
            Потому что даже это поломали.
            0
            В целом, выглядит отлично и ново, но для сайта Союза Покупателей не слишком подходит. Слишком уж серьезная тематика, как по мне.
            +2
              +7
              Как вы могли забыть про хабр habrahabr.ru/404/
                +5
                А мне github'овская нравится github.com/404
                  +5
                  А я вот такую на сайт поставил. Честно — не моя, но посетителям нравится. и поэтому решил оставить
                  image
                    +3
                    Ваши посетители так часто попадают на 404, что она стала им нравиться о_О?
                      +4
                      дети. сайт школьный
                      +17
                      Не моё, но тоже кавайное:
                      image
                      –13
                      У меня такая stroydb.com/404
                        –9
                        Лего прикольно смотрится! Вполне оригинально
                          +14
                          Сам себя не похвалишь…
                          0
                          Вообще для глаз приятно. Легкая. Но, лично мое мненеи: 404 должна отличаться от основного лайаута.
                          0
                          Эх, напомнили про 404 и снова захотелось.
                            0
                            После успеха акций на 404 странице вы будете часть показов баннеров делать благотворительными?
                              +5
                              А как у вас выглядит страница под 451 ошибку?
                                +5
                                Не буду кидать ссылочку на свой бложик, что бы не спамить зря, просто прикреплю картиночку тут:
                                Скрытый текст



                                Заодно, в качестве бонуса, PSD печальной луны, пользуйтесь на здоровье: прямая ссылка на zip (26.26 Кбайт)
                                  0
                                  SerafimArts, что-то не так с прямой ссылкой на zip

                                  Некоторые требуемые файлы отсутствуют. Если Вы хотели просмотреть тему....
                                    0
                                    Ой, простите, наверное я криворуко выдрал ссылку с форума, где постил (или она доступна только для зарегистрированных).

                                    Перезалью так: vk.com/doc12526981_313885899 работает?
                                    0
                                    Вы напомнили мне вот этот выпуск xkcd и в очередной раз заставили грустить…
                                    0
                                    Вместо кролика на первом изображении почудился чувак с зловещим красным лицом и большими белыми глазами, переодетый в костюм кролика.
                                      –1
                                      вот мой старый вариант…
                                      image
                                        0
                                        Помню первый раз увидел эту 404 на одном локальном (да, давно это было) ресурсе, зашел в пост что бы найти.
                                        0
                                        Сразу вспомнил эту ошибку
                                        www.youtube.com/watch?v=Qg4qmltx9Zo
                                          +2
                                          Вообще оригинал здесь
                                            0
                                            Да. Первым просто прогуглил Ютюб :)
                                          +4
                                          Некоторые слишком усердсвтуют с оформлением этой страницы и ты потом сидишь секунд 30 пытешся понять попал ты на страницу, на которую хотел попасть или это все-таки 404. А некоторые молча делают редирект на главную, что тоже раздражает.
                                            0
                                            А ещё «весело», когда сначала перекидывает на мобильную версию страницы… которой нет, и в итоге перекидывает на главную. И ты сидишь как дурак и пытаешься с телефона хоть как-то эту страницу увидеть через кэш гугла или ещё как-нибудь. А то и не с телефона, просто «вэбмастер» не знал, что Opera бывает не только Mini.

                                          Only users with full accounts can post comments. Log in, please.