Когда вы вручную кодируете дизайн своей веб-страницы, во многих случаях вам понадобятся коды генератора цветов для HTML- функций вашей страницы. Эти функции включают шрифт, фон, затенение и многое другое.
Поиск кодов генератора цвета для HTML-элементов
Очень просто определить простые цвета в вашем HTML-коде, используя обычные английские слова для таких цветов, как «синий», «зеленый» или «красный». Это не так просто, когда вы хотите использовать нестандартные цвета. Благодаря числовым кодам HEX у вас есть очень широкий выбор цветов для вашего сайта. Чтобы определить правильный цветовой код для нужного цвета, лучше всего использовать генератор цветов для кодов в формате HTML HEX, который можно просто вырезать и вставить в сценарий веб-страницы.
Как и где использовать цветовые коды
Когда вы разрабатываете макет своего веб-сайта, во многих случаях вы можете вставить коды из генератора цветов, чтобы определить точный цвет, который вы хотите. Следующие примеры представляют собой несколько наиболее распространенных способов использования этих цветовых кодов.
Изменение цвета шрифта
В течение многих лет веб-дизайнеры использовали общий код <FONT COLOR> для определения цвета шрифта на веб-странице. Однако более распространенные методы сегодня включают использование более нового тега «span», как показано здесь.
| <p>Если вы хотите <span style=»color:#2F1BC8″>изменить цвет шрифта</span>, просто используйте правильный цветовой код. <span style=»background-color:yellow»>другой цвет фона</span></p> |
В приведенном выше коде используется шестнадцатеричный код для очень специфического оттенка синего, не слишком темного и не слишком яркого. Используя точный код цвета, вам не нужно беспокоиться о том, будет ли определение цвета как «синего» правильным оттенком синего, который вы хотите. Использование кодов генератора цвета для определений шрифтов HTML позволит получить именно тот цвет, который вы ищете.
Определение цвета фона
Подобно шрифтам, техника определения цвета фона менялась со временем. Раньше веб-дизайнеры использовали атрибут bgcolor для тега BODY, чтобы определить цвет фона для веб-страницы.
| <p><BODY bgcolor=»#F0C4EF» text=»black» link=»blue»> …здесь находится тело страницы. </ТЕЛО> </p> |
Шестнадцатеричный код, использованный в приведенном выше примере, придает веб-странице очень светло-фиолетовый фон. В наши дни веб-дизайнеры предпочитают использовать подход с таблицами стилей, как показано здесь.
| <STYLE type=»text/css»> BODY { background: #F0C4EF; цвет: черный} A: ссылка { цвет: синий } </STYLE> |
Существует ряд других атрибутов, которые вы можете использовать для определения того, как будут отображаться различные элементы страницы, поэтому убедитесь, что вы понимаете коды CSS и то, как работают эти атрибуты, чтобы вы могли лучше настроить внешний вид своей страницы.
Поиск генераторов цвета для HTML HEX-кодов
Самый простой способ выбрать нужный оттенок цвета для шрифта, фона или любого другого элемента вашего веб-сайта — использовать онлайн-генераторы кода. В следующем списке приведены несколько лучших онлайн-генераторов, которые вы можете использовать в любое время, чтобы определить правильный шестнадцатеричный код для вашего HTML-скрипта.
- Free-Webmaster-Tools предоставляет этот очень полезный инструмент, который позволяет вам либо выбирать из длинного списка распространенных цветов, либо выбирать нужный оттенок цвета из карты оттенков-насыщенностей в нижней части страницы. Вы можете увидеть, как выглядит цвет фона веб-страницы, нажав «Проверить» или «Цвет дисплея».
- Color Schemer на самом деле является загрузкой приложения для ПК, но по этой ссылке функция цветовой схемы предоставляется онлайн. В отличие от большинства других генераторов цветовых кодов, это онлайн-приложение позволяет вам найти нужный оттенок, нажимая «Схема осветления» или «Схема затемнения», пока не будет получен именно тот цвет, который вы ищете.
- Hypergurl предоставляет этот очень полезный генератор цветов, который обеспечивает хорошее отображение, чтобы вы могли видеть, как цвета фона, текста и текста ссылки выглядят вместе.
- 2 Create a Website предоставляет этот очень полезный инструмент, который включает в себя инструмент выбора оттенка и сетку насыщенности, а также цветовой круг внизу, который поможет вам создать красивую цветовую схему для вашего сайта.
Цвета делают сайт
Бесчисленные психологические исследования доказывают, что цвета вызывают у людей эмоции. Неудивительно, что цвета могут сильно влиять на то, как люди реагируют на ваш сайт и нравится им это или нет. Итак, не забудьте тщательно продумать цвета вашего веб-сайта, когда вы начинаете этап проектирования своей новой веб-страницы.