[Ad_1]

В Интернете мало вещей хуже, чем Веб-сайт мягкий. Конечно, некоторые веб-сайты намеренно выбирают бруталистский или минималистский вид (смотрим на Craigslist), но даже они не такие. выцветать. Наличие сплошной цветовой палитры — верный способ сделать ваш Веб-сайт бежевые массы, эти скучные однотонные шопы, которые deнадавить Je Suisнажимать. К счастью, Divi предлагает вам комбинацию нашей системы Magic Color и функции Global Colors. Вы можете легко применять цветовые палитры к своему Веб-сайт Диви. Результаты обязательно поразят вас посетителей.

Общие советы по цветовым палитрам

Независимо от того, насколько легко добавить цветовую палитру на ваш веб-сайт Divi, совершенно необходимо, чтобы вы использовали правильный тип палитры для вашей отрасли и бренда. Если у вас уже есть фирменные цвета, это очевидный выбор. Помимо углубления в теорию цвета (что, кстати, очень интересно), у нас есть несколько советов, которые помогут вам понять, с чего начать с новой цветовой палитрой.

1. Выберите темный или светлый веб-сайт.

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

Теперь это сразу же подводит нас к первому вопросу, который вы должны задать себе, когда хотите применить цветовую схему к своему веб-сайту; Вы хотите создать сайт темного или светлого цвета? Тот факт, что вы выбираете один из них, не означает, что вы не можете их комбинировать, но наличие выбора облегчает выбор цветовой схемы.

2. Выбор цвета

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

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

Цвет фона

цветовые палитры

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

цвет шрифта

цветовая палитра меняется

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

Цвет гиперссылки и CTA

цветовая палитра меняется

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

Цвет для последних штрихов

цветовая палитра меняется

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

3. Убедитесь, что контраст достаточно.

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

4. Найдите правильный баланс использования цвета.

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

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

Как добавить цветовую палитру на свой сайт Divi

Имея все это в виду, пора углубиться в Divi и применить новую цветовую схему вашего сайта!

Палитра Divi по умолчанию

Сначала перейдите в свою панель управления WordPress и перейдите к Divi - Параметры темы. Под общий вкладка, вы увидите запись под названием Палитра выбора цвета по умолчанию. Это позволяет вам выбирать 8 цветов, к которым вы хотите быстро получить доступ каждый раз, когда вы открываете параметры цвета в конструкторе Divi. По умолчанию это яркие цвета, которые используют многие люди, но это не полная палитра, которую следует использовать на одном веб-сайте.

цветовая палитра по умолчанию

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

Войдите в конструктор Divi

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

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

Под текущим выбранным цветом для любого элемента вы увидите значок значок с многоточием (три точки). Когда вы нажимаете на нее, вы вызываете инструмент Magic Color из Divi. Конструктор учитывает ваши недавно использованные цвета и цвета на самой странице, чтобы предоставить вам серию нескольких палитр, состоящих из дополнительных цветов, которые должны хорошо работать вместе.

Определите цвета как глобальные

После того, как вы определились, какие цвета хотите использовать, самое время сделать их глобальными. Глобальные цвета можно настроить для изменения на всей странице независимо от модуля или элемента.. Это означает, что если вы хотите поменять местами 5 разных цветов, вам не придется делать это более 100 раз, индивидуально для экземпляров этого цвета. Вы сделаете это 5 раз.

Для начала перейдите в любой модуль с палитрой цветов. Ниже вы увидите ссылку под названием Глобальный. Щелкните по нему, и глобальная палитра исчезнет. Оттуда вы определите цвета, которые хотите сделать доступными глобально, нажав кнопку плюс + икона.

Глобальный

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

глобальные цвета

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

капля означает общий цвет

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

Global Divi конвертировать

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

Применить глобальные цвета

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

найти и заменить

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

найти и заменить на глобальный

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

выбрать цвета

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

редактирование цвета

После этого просто повторите этот процесс для каждого цвета в новой палитре. Только одно изменение для каждого цвета в вашей палитре. Не обмен каждого конкретного предмета определенного цвета.

пак

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

Получайте удовольствие!

Лучшее изображение статьи ART.ICON / shutterstock.com



[Ad_2]

Ссылка на источник