Бизнес Дизайн

Денис Судилковский про бизнес и дизайн для тех, кому пришлось этим заниматься.

RSS

А давайте я научу вас красиво красить

Опубликовано 06.12.2007 - В рубриках: Теория дизайна

Бабочка Сегодняшний пост будет полезен, прежде всего, новичкам в дизайнерском деле, но и «более продвинутые» смогут найти для себя кое-что полезное. А расскажу я вам об уникальных цветовых палитрах.

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

Есть более простой, и не менее продуктивный способ. Обратимся к матушке-природе, она уже давно придумала все «велосипеды» за нас.

Идем на замечательный англоязычный сайт (не бойтесь, нам нужны только картинки от туда), и смотрим представленные палитры. Вот то, что нам нужно — наборы заведомо гармоничных цветов. Выбирайте любой!

Но как же ими пользоваться? Да очень просто, переходим к практике.

Выбираем палитру попроще, что бы быстро со всем разобраться.

Палитра

На большинстве сайтов присутствует 3 группы цветов, которые используются с разными целями.

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

Далее идет группа основных цветов. Зачастую это цвет основного текстового потока на сайте. Думаю тут всем все понятно.

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

Смотрим на выбранную мной палитру:

Палитра цветов

А теперь красим свой блог или сайт в цвета нашей палитры.

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

Основной текст получает у нас красивые основные цвета. Требования к этой группе только одно — достаточный контраст между фоном и текстом, что бы процесс чтения не был затруднительным для посетителя сайта.

Тест текста на контрастность с фоном

И последняя группа — акценты. Раскидываем их по всему тому, на чем хотим сосредоточить внимание. В первую очередь «поперчим» ссылки, на них всегда разумно ставить акцент. Можно еще добавить специй в логотип и название сайта. Главное, как я уже говорил, это не увлечься, иначе ваше «блюдо» будет не возможно съесть. (:

Посмотрим, что у нас получилось с нашей палитрой:

Результат труда дизайнера

Довольно не плохо, можно сказать, что даже хорошо! Так что теперь немного практики, и вы сможете покрасить практически все, что угодно.

Блог, который вы смотрите — тоже подвергся процессу тюнинга. Здесь используется переделанная тема со странным названием Ygoloner. Что-то убрал, что-то добавил, оставил дерево (уж больно прикольно там расстреливать чайники), кое-что перекрасил, и получилось мило и красиво, правда же? (:

Главное слишком не увлекайтесь этим, а то редизайн — дело тонкое, и об этом я обязательно как-нибудь напишу, так что смело подписывайтесь на RSS!

P.S. Когда-то давно хотел занятся бонсаи, но бросил это дело так и не начав, а вот сегодня попал на интересную статью, и, кажеться, кто-то сейчас пойдет в цветочный магазин... (:

Комментарии

Отзывов (10) на «А давайте я научу вас красиво красить»

  1. Открой Интернет для Своего Бизнеса » Разбираем сайт Бедной Йены 07.12.2007 7:31 am

    […] читаю: Денис Судилковский - А давайте я научу вас красиво красить Молочные новости - Компании Google и TomTom представили […]

  2. Сергей Попцов 07.12.2007 7:36 pm

    Всё гениальное просто. Действительно, природа уже все придумала. Просто нужено изменить подход в её понимании. Спасибо за статью.

  3. Nadina 08.12.2007 8:51 am

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

  4. Ольга Иванова 10.12.2007 12:35 pm

    Очень полезный пост! Я даже и не думала, что все настолько просто! Кстати, очень понятно написано! Спасибо!

  5. Olga Strong 11.12.2007 3:02 am

    Вот здесь есть симпатичные палитры для Веб-дизайна, основанные на фотографиях природы:

    ~golovan/file.php?page=1
    ~golovan/file.php?page=2
    ~golovan/file.php?page=3

    Сайт на русском языке. Если кому интересны сами фото, автор когда-то выпускал рассылку в subscribe.ru, не знаю, существует ли она сейчас.

  6. Сливки Интернет-Гурятника: Абрахам И Все-Все-Все « Копирайтинг О Главном 11.12.2007 8:07 am

    […] Да, и еще: я участвую в конкурсе Жуковского и Попова по раскрутке блога. Присоединяйтесь. И отдельное спасибо Денису Судилковскому за небольшой промоушинг. Читайте у него отличную статью по цветовому дизайну для сайтов. […]

  7. Юдж 11.12.2007 1:47 pm

    Ольга Иванова, в CSS это line-height.

    Вот вам хороший сайт: www.htmlbook.ru, там всё есть :)

    Удач!

  8. Юдж 11.12.2007 1:48 pm

    Запятую нужно убрать в URL, да. :)

  9. Nadina 11.12.2007 2:59 pm

    в CSS это line-height.
    Спасибо, Юджин.
    почему-то не помогло изменение этого параметра в css(((

  10. Юдж 11.12.2007 4:26 pm

    Здесь посмотрели?
    Попробуйте поставить !important в этом параметре.

Оставьте отзыв