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

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

В разделе рассматриваются RGB и HSL как способы описания цвета, а также HEX-коды, используемые в веб-разработке. На конкретных примерах показывается, как цвет задаётся в CSS и как его параметры можно изменить в графическом редакторе. Полученные сведения помогут записывать палитру точно и переносить её между цифровыми инструментами.

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

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

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

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

На заключительном практическом этапе участники показывают макеты и объясняют, почему выбрали именно такие оттенки и распределили их по ролям. Палитры сравниваются по понятным критериям: соответствие теме, гармоничность, читаемость и удобство повторного использования. Обсуждение помогает выявить удачные решения и определить, что можно улучшить в готовом продукте.

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

В список включаются проверяемые источники, использованные для изучения цветовых моделей, CSS и доступности веб-контента. Это могут быть официальные рекомендации W3C по WCAG, справочные материалы MDN Web Docs и документация сервисов проверки контрастности. Для каждого источника указываются автор или организация, название материала и адрес страницы, чтобы читатель мог самостоятельно проверить сведения.