Вопрос по веб-дизайну

less смотрите

dimavik, я не просил пинков в сторону других методов и библиотек, Sass и Less по мне уже динозавры, я о них знаю и как там сделано, те подходы меня не устраивают поэтому разрабатываю свой. Мне нужны мысли по поводу как удобнее сделать если применять переменные самого css, чтобы при создании разметки и стилей не думать о дизайне(настраивая цвета и тд) а просто указывать переменные. А для этого нужен определённый стандарт который я сейчас и продумываю. Хотелось бы мнения дизайнеров о описанном моём способе и как возможно стандартизировать переменные для фона, текста, ссылок, кнопок.

ЗЫ. Предполагаю, что зря создал тему.

А чего так, не в теме про свой хренворк?

Учти, что переменные не всеми браузерами поддерживаются. Хотя за время разработки хренворка, может быть, старые браузеры совсем умрут.

---------- Добавлено 26.12.2019 в 15:17 ----------

Не знаю, что такое "стандартизировать", но определяются переменные именно через классы.

Sitealert, современные браузеры все поддерживают, мне этого достаточно.

Стандартизировать это что-то типа такого

.gamma1 {
    --c0:#201F23;/* текст */
    --c1:#413736;/* цвет заголовков */
    --c2:#56584B;/* */
    --c3:#7B6161;/* фон заголовка блоков */
    --c4:#763E4B;/* бордюр */
    --c5:#8F7F7A;/* цвет ссылки посещённой */
    --c6:#A0636C;/* цвет ссылки */
    --c7:#737E6B;/* цвет ссылки при наведении */
    --c8:#8F7F7A;/* фон кнопки */
    --c9:#AB9388;/* */
    --cA:#C1B5AA;/* */
    --cB:#C3B1B3;/* фон заголовка таблицы */
    --cC:#CFCCCD;/* чередующий фон таблицы 1 */
    --cD:#E6E2DC;/* чередующий фон таблицы 2 */
    --cE:#f2fccdb4;/* маркер */
    --cF:#FFFFFF;/* */
}

То есть определить назначение переменных.

Переменные могут задаваться не только в классе, в основном их задают в селекторах :root или * В классе это я экспериментальным путём выявил, что при изменении класса через js значения переменных меняется на значения таких же переменных заменяемого класса.

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

напиши задачу - будет шанс что помогу(т) составить лучший алгоритм. пусть не 100 % а намеки, а это бывает тоже ценно чтобы раскупорить стопор.

да я тоже не понимаю зачем прописывать все варианты

мне по душе такой вариант - диалоговое окно с формой, где элементами формы выбираем варианты дизайна (элементов или чего там).... - по отправке формы из переменных формируется файл стиля css. (перезаписывается).

по структуре сss cорян мне такой способ неизвестен

я использую: тип элемента - свой класс,

такое кучкование вижу первый раз

хочется спрасить - а чо так можно ?

но вижу в перпективе применения уже кучу минусов (для себя) и неудобств (вижу в таком подходе страшное ограничение в свободе действий пользователю и универсальности) и пока что не вижу преимуществ, и не спрашиваю.

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

это для наглядности, там видны какие цвета

Во-вторых в гамме же указываются цвета от тёмного к светлому, поэтому можно приблизительно ориентироваться по названию переменной. Если с1 значит тёмный цвет, сF светлый. Возможно загоняюсь с стандартизацией(определением назначения для переменной).

Короче застопорился на этом вот. Хочется пообщаться по этому поводу с дизайнерами. Как они подбирают цвета и тд.

Я бы переменным дал осмысленные имена.

livetv, у меня был такой вариант до этого

:root {
    --paint: #211E25;/* текст */
    --canvas: #dad2ce;/* фон */
    --border: black;/* бордюр */
    --marker: #e7fcc0;/* маркер */
    --link: #385c15;/* цвет ссылки */
    --linkvisited: #772d51;/* ссылка посещённая */
    --linkhover: #d85b56;/* ссылка при наведении */
    --buttonpaint1: #D6D4D7;/* текст кнопки */
    --buttoncanvas1: #dad2ce;/* фон кнопки */
    --buttonpaint2: #536052;/* текст кнопки при наведении */
    --buttoncanvas2: #e0e5f5;/* фон кнопки при наведении */
    --tableheader: #9ab44a;/* цвет заголовка таблицы */
    --tablezebra1: #e3f1e8;/* 1 чередующий цвет линии таблицы */
    --tablezebra2: #f5f5e0;/* 2 чередующий цвет линии таблицы */
}

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

я тебе так отвечу..

инженер когда разрабатывает проект стула на 3 ножках ведет разработку стула на 3 ножках..

программист когда разрабатывает программу по расчету формы стула на 3 ножках разрабатывает что программа может рассчитать стул со 101 ножкой..

по сему совет капай в вариант - полная динамика.. "16 000" цветов. - (ну весь спектр rgb) . статикой решить не реально.

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

по моему я понял суть вопроса в теме

если не ошибаюсь то он не решаемый.