Продажа CSS шаблоны

Продажа CSS-шаблонов как готового продукта

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

Структура, которая выдерживает повторное использование

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

Рецензенты платной таблицы стилей обычно ищут одно и то же:

1. Блок переменных, достаточно маленький, чтобы его можно было просмотреть на одном экране;

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

3. Состояния при наведении курсора, фокусе и ошибке для каждого интерактивного элемента;

4. Адаптивные правила сгруппированы по точкам останова, а не разбросаны по всему файлу.

Настройка без переписывания всего

Заранее определите, какие части, как ожидается, будут касаться покупателя, и сделайте эти части очевидными. Названия играют здесь ключевую роль. Класс с именем card хорошо работает; класс с именем promo-block-2 ничего не говорит следующему пользователю и всё равно будет скопирован.

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

Четко обозначьте настраиваемую поверхность, и вопросы в службу поддержки в основном исчезнут:

1. Фирменные цвета и интервалы берутся из переменных, а не из отдельных селекторов;

2. Стек шрифтов определяется один раз, с резервным вариантом, который работает, если основной шрифт не загружается;

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

Признаки шаблонов, которые никто не хочет поддерживать

Вы знаете, о чём я говорю: когда вы открываете шаблон, сорок селекторов, привязанных к одному конкретному макету, с конфликтующими друг с другом переопределениями и восклицательными знаками "!" повсюду, где каскад становится неудобным. Покупатель не находит способа изменить цвет кнопки, не нарушая работу карточек, и запрос на возврат средств приходит в тот же вечер.

Вес файла тоже имеет значение. Отправляйте только те правила, которые действительно используются в проекте; опция Экспорт минимального CSS на страницу в Nicepage создаёт более компактный результат, что позволяет максимально приблизить предоставляемый вами продукт к потребностям покупателя.

Честный тест перед тем, как выставлять что-либо на продажу: дайте таблицу стилей тому, кто её никогда не видел, попросите изменить цвет и создать новый вариант карточки, и засеките время. Менее чем за десять минут у вас будет товар; за час — элемент портфолио.