Опубликовано руководство по дизайну Веб 2.0



    На дизайнерском сайте Web Design From Scratch опубликовано подробное руководство по дизайну Веб 2.0. Это руководство представляет собой список из 15 дизайнерских приемов, которые чаще всего используются на сайтах нового поколения, с конкретными примерами и скриншотами.

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

    В результате «очистки» страниц взгляд посетителя фокусируется на контенте. Упрощается навигация. Легче привлечь внимание пользователя к чему-то важному.

    В дизайне сайтов Веб 2.0 можно использовать термин «рисование информацией» или «информационные пикселы» (data ink). Вообще, сам Тафт когда-то говорил, что эффективность информационного дизайна выражается в соотношении «информационных» пикселов на экране к общему числу пикселов.

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

    Меньше колонок
    Несколько лет назад дизайн в три колонки был нормой, а частенько встречались даже четыре. Сегодня две колонки никого не удивляют, а три — общепринятый максимум.

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

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

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

    Увеличенный кегль
    На сайтах Веб 2.0 размер шрифта обычно больше, чем на сайтах прошлого поколения. Это правило вытекает из принципов простоты и функционального дизайна.

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

    Четкий логотип
    Ясный, мощный и сильный бренд создается с помощью заметного и запоминающегося логотипа.

    Кроме всех вышеперечисленных, упоминаются еще шесть дизайнерских приемов, которые встречаются не так часто: использование насыщенных цветов; гламурные поверхности (rich surfaces); градиенты; отражения; изящные пиктограммы и даже многоугольные звездочки.

    Комментарии 35

      0
      плюс к попыткам
      http://www.habrahabr.ru/column/648/

      а вообще полезно для развития :)
        0
        Опередили вы меня со ссылкой. От себя мне остается только добавить, что существенно ничего с даты написания той статьи не изменилось.
          0
          да, сейчас уже обсуждается web 3.0 :))

          а мода на дизайн будет меняться гораздо чаще. чеммаркетологи будут придумывать названия ;)
        0
        Вообще рад, что людей наконец начинает "отпускать" и разработчики массово начали думать о том, что главное на сайте именно его содержимое. И форма должна помогать работать с этим самым содержимым и усваивать его.
        Жаль, что заказчики на разработку сайтов до такой степени ретроградны, что объяснить им это ещё не скоро получится.

        Вывод: Делаем сайты для себя любимых и не морочимся на отсталых комерсах! ))
          +1
          Уже не дождусь, когда же будут в моде сайты не с красивыми картинками, функциями и приблудами, а с качественным контентом.
            0
            "Чистый" текст воспринимать сложно. Текст, красиво оформленный, снабженный иллюстрациями сканируется глазом быстрее. ;)
              0
              с качественным контентом
              Контент появится качественный когда с него можно будет заработать нормально - сейчас 1000 символов без пробелов стоит 2 доллара.

              "Чистый" текст воспринимать сложно
              Не правило - разукрасить "Войну и мир" в навороченной верстке не будет приятным для глаз. Что хорошо буклету, плохо книге.
                +1
                Ничего подобного.
                Я зарабатываю 10$ за 1000 знаков качественного контента.
                  0
                  Извините, я считаю что это мало.
                    +1
                    Я живу в маленьком провинциальном городе, где средняя зарплата составляет 150$.
                    Работая по "московским" ценам, я за день могу заработать эту сумму.
                    Вывод: для меня это достаточно.
                      +2
                      Разумеется, можно прожить на эти деньги, если заниматься этим профессионально. Я совсем о другом.

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

                      А в сети такое невозможно. Для сети никто не пишет, кроме группы контент-менеджеров и копирайтеров (при чем, копирайтеров меньшенство). Потому что нет механизмов чтобы в сети серьезно заработать с какого бы то ни было текста. В сравнении с книгопечатаньем.

                      Текс в сети катастрофически дешевле нежели на бумаге, в ряде случаев. Что приводит к тому что серьезные объемные тексты (хотел бы сказать книги, но даже термина в сети нету для таких объемных текстов) для сети очень мало кто пишет.
                      • НЛО прилетело и опубликовало эту надпись здесь
                          0
                          Вы не считаете что это исключения, которые возможны не благодаря феномену интернета, а благодаря феноменам Кинга и Лукьяненко?
                          • НЛО прилетело и опубликовало эту надпись здесь
                          +1
                          Я написала 2 учебных пособия, издала их, но только за свои деньги. Затраты окупились, но не более. И не потому, что данные учебные пособия никому не нужны - нет, они используются во многих педагогических вузах, только за тиражирование мне никто не платит.

                          Это очень сложный вопрос, не будем оффтопить тут.
                            0
                            Предположим, врач захотел написать книгу. Если он её напечатает, есть шансы, принципиально, есть шансы, что он вернет деньгами тот скажем год, который он потратил на написание.

                            Ни хрена он не вернет. Жить на авторские гонорары можно, только профессионально занимаясь написанием книг. Можете убедиться сами: умножьте цену книги в магазине на тираж и на 0,05 - это и есть примерная величина авторского гонорара. Причем выплатят его не авнсом и не единовременно, а частями по мере реализации тиража.
                              0
                              Хорошо, Вы называете крайний вариант - человек который не смыслит, как заработать с книги (и скорее всего даже не для заработка пишет) - пытается это исполнить. Окей, я тоже называю крайний вариант - Гарри Поттер. :) Вы знаете блоггеров (да кого угодно в сети), кто на тектстах сам зарабатывал столько, сколько люди зарабатывали на написании книг?

                              Не думаю, что это сравнимые механизмы.
                                0
                                В чем крайность-то? Джоан Роулинг — профессиональная писательница. Чтобы жить на авторские гонорары ваш гипотетический врач должен перестать быть врачом и стать писателем. Вот и все. Я знаю таких, поскольку зарабатываю себе на жизнь изданием книг. Блоггеров не знаю. Но я и не утверждал, будто они есть.
              0
              полезная штука, спасибо. видел в оригинале, но русский перевод приятнее. в закладки.
                0
                Оригинал несско полнее... =(
                0
                особенно про размер шрифта очень понравилось :)

                эх такие бы принципы были в начале развития РУнета, небыло бы столько ужасных сайтов!
                  0
                  Вот уж не знал, что Star flashes — это настолько важный элемент.
                    0
                    а про то что стали центрировать чаще - важный элемент? :)
                    имхо такого рода статьи для самооболванивания, и дизайн "веб 2.0" - решение для бедных (визуально)
                    0
                    http://blog.turbomilk.ru/archives/000097…
                    Дизайн в стиле web 2.0

                    http://www.yayhooray.com/thread/90661/yh…
                    redesign famous logos in web 2.0 format (22 pages)
                      0
                      Полезная информация, воспользуюсь, когда буду сайт переписывать...
                        0
                        давно пора было это упорядочить в один список,
                        а то у всех на языке вертелось
                          0
                          Мне кажется, что Хабр отлично подходит под эту статью. И секция заголовка, и две колонки, и шрифта огромного много, и цвета приятные.

                          Действительно, контент - самое важное, а дизайн лишь должен помогать усваивать информацию... =)
                            0
                            Интересно для кого это написано?
                            Если для дизайнеров - то они и так видят, что особенного для "нового веба".
                            Для новичков? Вряд ли. Все равно не получится так сделать.
                            Для пользователей? Зачем им это?
                            В общем...так общее резюме.
                              –1
                              Для любознательных и для общего развития очень помогает :-)
                              0
                              Ерунда полная! Я уверен, что никто из Вас не скажет что такое WEB 2.0? Даже сам автор. Эта статья полная чушь! А Вы все поддерживаете в один голос, что это круто!
                              Простой дизайн? поставте себе front page и рисуйте простые дизайны, тогда дизайнеры скоро вообще не нужны будут, они должны РИСОВАТЬ свои идеи а не по плану, ага, тут 3 колонки, тут большие буквы, тут четкий логотип!.. Большой текст, простое меню, навигация, да это же не веб 2.0, это всего лишь замысел художника, это ЕГО ИДЕИ!!!

                              Вы наверняка работаете в IT сфере, явно в какой нибудь web студии... теперь представте, что я клиент, прихожу и говорю вам, "Здравствуйте, Я хочу себе сайт в стиле web 2.0"!
                              Какой будет ваш ответ вашему потенциальному клиенту? Четкий логотип и 2-3 колонки? :-)
                              Лично я, УЖЕ смеюсь...

                              Ну и раз УЖЕ есть web2.0 то что такое web1.0? И значит должен появиться 3.0.. хотя, может быть 2.1 aльфа ? а может beta? А может сразу релиз выйдет 2.2? вы об этом не думали?

                              p.s. моё личное понимание web 2.0 как модно говорить, это ТОЛЬКО ПРОГРАММИРОВАНИЕ! но ни как не дизайн!

                              Удачи!
                              • НЛО прилетело и опубликовало эту надпись здесь
                                0
                                Да какой там может быть дизайн с тремя линиями и 2мя колонками? смешно просто ;)
                                  0
                                  Да, на мой вопрос так и не ответили. Пришел я в вед студию, захотел сайт на веб2.0, расскажите мне что это? :-)
                                • НЛО прилетело и опубликовало эту надпись здесь
                                    0
                                    Я просматривал на днях эту статью про рисование в стиле Веб 2.0.
                                    Мне понравилось. Для общего развития и в качестве стеба полезно. :)
                                    Конечно, этот стиль это не просто 12 правил, но мне кажется для некоторых закостенелых дизайнеров будет полезно.

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

                                    Самое читаемое