Справочник курса

Язык веб-дизайна

Термины нужны не для солидности. Они помогают точно назвать проблему и не заставлять ИИ угадывать, что значит «как-то некрасиво».

Формула: термин + место на странице + наблюдаемый симптом + нужное изменение.

Задача

Цель страницы: Что должно измениться после посещения страницы: заявка, покупка, понимание, регистрация.
Аудитория: Люди с конкретной ситуацией, знаниями, ожиданиями и сомнениями.
Сценарий: Последовательность шагов пользователя от входа до результата.
CTA: Главный призыв к действию: кнопка или ссылка, двигающая пользователя дальше.

Внимание

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

Композиция

Близость: Близкие элементы воспринимаются как одна группа.
Выравнивание: Общие невидимые линии, связывающие элементы в порядок.
Сетка: Система колонок и направляющих для размещения контента.
Ритм: Повторяющийся рисунок отступов, размеров и блоков.
Воздух: Свободное пространство, которое разделяет, группирует и усиливает смысл.

Визуальная система

Типографическая роль: Назначение текста: главный заголовок, подзаголовок, основной текст, подпись, кнопка.
Палитра: Ограниченный набор цветов с понятными функциями.
Компонент: Повторяемый элемент с правилами: кнопка, карточка, поле, меню.
Дизайн-токен: Согласованное значение цвета, размера, отступа или радиуса, используемое повторно.
Дизайн-система: Набор общих правил, токенов и компонентов, удерживающий продукт целостным.

Поведение веб-страницы

Состояние: Как элемент выглядит и ведет себя в покое, при наведении, загрузке, успехе или ошибке.
Понятность действия: Способность элемента подсказать, что с ним можно сделать.
Адаптивность: Осмысленное изменение компоновки под разные размеры экрана.
Точка перелома: Ширина экрана, на которой компоновка меняется.
Доступность: Возможность пользоваться страницей при разных особенностях зрения, моторики и восприятия.

Команды для ИИ

Бриф: Описание задачи, аудитории, контента, ограничений и критериев приемки.
Референс: Пример с объяснением, какой принцип из него нужно взять.
Ограничение: Граница решения: не менять структуру, использовать два цвета, сохранить текст.
Критерий приемки: Наблюдаемое условие, по которому понятно, что правка выполнена.
Итерация: Один управляемый цикл изменения и проверки.