Статья для «продвинутых» пользователей:) Представляем Вашему вниманию палитру цветов с кодами для web-сайтов. С помощью такой палитры очень удобно просматривать цвета, выбирать подходящие, и копировать код цвета в стили CSS, либо в другие настройки сайтов. Для настройки стиля какого либо элемента на сайте достаточно прописать в файле CSS следующие строки, зная класс элемента страницы. К примеру, на странице заголовок страницы чаще всего указывается тегами <h1>Заголовок</h1>. Тогда можно в файле CSS указать цвет заголовка таких образом. <style> h1 { color: #000033; } </style> Результат: Заголовок Таблица цветов:
| 000000 | 000033 | 000066 | 000099 | 0000CC | 0000FF | | 003300 | 003333 | 003366 | 003399 | 0033CC | 0033FF | | 006600 | 006633 | 006666 | 006699 | 0066CC | 0066FF | | 009900 | 009933 | 009966 | 009999 | 0099CC | 0099FF | | 00CC00 | 00CC33 | 00CC66 | 00CC99 | 00CCCC | 00CCFF | | 00FF00 | 00FF33 | 00FF66 | 00FF99 | 00FFCC | 00FFFF | | 330000 | 330033 | 330066 | 330099 | 3300CC | 3300FF | | 333300 | 333333 | 333366 | 333399 | 3333CC | 3333FF | | 336600 | 336633 | 336666 | 336699 | 3366CC | 3366FF | | 339900 | 339933 | 339966 | 339999 | 3399CC | 3399FF | | 33CC00 | 33CC33 | 33CC66 | 33CC99 | 33CCCC | 33CCFF | | 33FF00 | 33FF33 | 33FF66 | 33FF99 | 33FFCC | 33FFFF | | 660000 | 660033 | 660066 | 660099 | 6600CC | 6600FF | | 663300 | 663333 | 663366 | 663399 | 6633CC | 6633FF | | 666600 | 666633 | 666666 | 666699 | 6666CC | 6666FF | | 669900 | 669933 | 669966 | 669999 | 6699CC | 6699FF | | 66CC00 | 66CC33 | 66CC66 | 66CC99 | 66CCCC | 66CCFF | | 66FF00 | 66FF33 | 66FF66 | 66FF99 | 66FFCC | 66FFFF | | 990000 | 990033 | 990066 | 990099 | 9900CC | 9900FF | | 993300 | 993333 | 993366 | 993399 | 9933CC | 9933FF | | 996600 | 996633 | 996666 | 996699 | 9966CC | 9966FF | | 999900 | 999933 | 999966 | 999999 | 9999CC | 9999FF | | 99CC00 | 99CC33 | 99CC66 | 99CC99 | 99CCCC | 99CCFF | | 99FF00 | 99FF33 | 99FF66 | 99FF99 | 99FFCC | 99FFFF | | CC0000 | CC0033 | CC0066 | CC0099 | CC00CC | CC00FF | | CC3300 | CC3333 | CC3366 | CC3399 | CC33CC | CC33FF | | CC6600 | CC6633 | CC6666 | CC6699 | CC66CC | CC66FF | | CC9900 | CC9933 | CC9966 | CC9999 | CC99CC | CC99FF | | CCCC00 | CCCC33 | CCCC66 | CCCC99 | CCCCCC | CCCCFF | | CCFF00 | CCFF33 | CCFF66 | CCFF99 | CCFFCC | CCFFFF | | FF0000 | FF0033 | FF0066 | FF0099 | FF00CC | FF00FF | | FF3300 | FF3333 | FF3366 | FF3399 | FF33CC | FF33FF | | FF6600 | FF6633 | FF6666 | FF6699 | FF66CC | FF66FF | | FF9900 | FF9933 | FF9966 | FF9999 | FF99CC | FF99FF | | FFCC00 | FFCC33 | FFCC66 | FFCC99 | FFCCCC | FFCCFF | | FFFF00 | FFFF33 | FFFF66 | FFFF99 | FFFFCC | FFFFFF | Таблица цветов
Использование такой таблицы будет удобно не только для Web-дизайнеров, занимающихся созданием сайтов с нуля, но и для тех, кто занимается наполнением и редактированием содержимого своих сайтов. Используя данную таблицу цветов, редактору сайта будет легче представить как раскрасить те или иные элементы содержимого страниц. Для редактирования страниц чаще всего используется система администрирования сайтом (CMS), в которой встроен визуальный редактор для более удобного форматирования текстов на страницах. Чтобы текст не отталкивал Ваших посетителей (в том числе потенциальных клиентов), нужно грамотно оформить сайт. Нужно позаботится не только о содержимом страниц, о формулировке тектов, чтобы посетителям было интересно на вашем сайте, но также нужно помнить о форматировании текстов. Цветовое оформление страниц не должно «бить» по глазам посетителей. Элементы страниц должны привлекать пользователя, особенно самые важные — спецпредложения, цены на товары и т. п. Для этого нужно выбрать «правильный» цвет соответствующего информационного блока, чтобы этот цвет и сочетался с основным стилем сайта (фирменным стилем) и выгодно выделялся на фоне других блоков.
Чтобы красиво и ярко оформить текст страницы необязательно использовать только чистый красный или синий цвет. Нужно подобрать сочетающиеся с дизайном цвета, оформить блоки. И напоследок критично посмотреть на оформленную страницу сайта — все ли там нормально. Только тогда измененную страницу можно публиковать на всеобщее обозрение.
Гармония цвета Зачастую встречается мнение о том, что чувство цвета — это что-то врожденное, бывает только у талантов, и этому невозможно научиться, либо учиться нужно очень долго. На самом деле, при использовании соответствующих инструментов, а также пережив некоторое количество «ударов электротоком», практически любой дальтоник может научиться подбирать цветовые схемы, которые смогут радовать глаз. Для начала, давайте разберемся в терминологии теории и гармонии цвета, чтобы понять дальнейшую суть рассуждений. Многие уже знают, что первичными (primary) цветами являются красный, желтый и синий. Чтобы получить вторичные (secondary) цвета, нужно смешать один первичный цвет с другим. Желтый и красный цвета дадут нам оранжевый, красный и синий — пурпурный (или лиловый), а синий и желтый — зеленый цвет. Есть еще третичные (tetriary) цвета. Что это такое? Просто берем первичный цвет и к нему добавляем соседний вторичный. Из таких простых комбинаций мы видим, что существует шесть третичных цветов (по два цвета от каждого первичного). Рис. 1 демонстрирует все описанные цвета во всей их красоте.  Рис.1 Для того, чтобы лучше понять, как все эти цвета взаимодействуют друг с другом, расположим все цвета по кругу. И получим цветовой круг (рис. 2). Получается красивая картина. Но что на самом деле больше всего впечатляет, что данный круг поможет вам подобрать цвета для вашего Web-сайта.  Рис.2 Самый простой способ подобрать цвета в таком цветовом круге — мысленно нарисовать над кругом равнобедренный треугольник. Цвета в круге, которые окажутся под вершинами — это будут потенциальные кандидаты на использование в оформлении вашего сайта. Данный способ подбора цветов называется «триадной схемой». См.рис. 3.  Рис.3 Но одними триадами не стоит ограничиваться в выборе цветов. Есть так называемые комплиментарные (complementary) цвета, т. е. те цвета, которые распологаются в круге прямо друг напротив друга — к примеру, красный и зеленый. Такие цвета называются комплиментарными (или дополняющими) потому, что будучи размещенными рядом, делают друг друга живее и ярче (контрастнее), см. рис. 4.  Рис.4 Есть и другие, более сложные комбинации (см. рис. 5). Однако о теории цвета можно рассуждать бесконечно. Тема интересная и неисчерпаемая.   Рис.5 После просмотра данного материала, следует помнить, что приведенные здесь цветовые схемы — это лишь отправная точка, а никак не вершина мастерства дизайнерского искусства. В конечном счете решающим фактором станет удобство и читаемость текста на вашем Web-сайте, а также его внешний вид. Желаем удачи в выборе цвета!
По вопросам создания сайтов любого уровня сложности обращайтесь в нашу компанию. Проконсультируем бесплатно!
|