Форумы / National / Russian / Скины и дизайн / Скины: делаем грамотно

1234>>>

medar
#1 20.02.2009 23:00
Предлагаю начать здесь, потом переместить выжимку в Идеас.

Я давно задумываюсь над тем, что нужно изменить в скин-подсистеме движка.

Первое, что бросается в глаза - это то, что у нас в core движка иконки из img/system выводятся явно как img , поэтому для того, чтобы их поменять под свой дизайн, надо редактировать gif-файлы напрямую. Понятно, что никто этого не делает, поэтому мы на большинстве seditio-сайтов видим это серое убожество.

Я (пока не в svn, а у себя) в core заменил все эти вызовы на конструкцию <span> с background image. Т.е.
<img src="skins/$skin/img/system/arrow-up.gif" />
заменил на
<span class="arrow-up">&nbsp;</span>
а в css прописал:
.arrow-up { background: url(img/system/up.png) no-repeat; padding-left: 16px; text-decoration: none; }
Теперь стрелку вверх можно рисовать любой иконкой, какой нравится.
Минус - так как IE не понимает пустой <span> , пришлось вставить в него неразрывной пробел, поэтому ширина конструкции увеличилась - они теперь не 16 пикселей, а где-то 18. Впрочем, решение есть - надо заменить padding-left на padding-right и 16 на 14, но в таком случае мы лишаемся возможности в этом <span> писать текст, чтобы он был рядом с иконкой. В общем, все решается индивидуально для каждой иконки.

Прошелся поиском по ядру, заменил все что увидел, вроде бы все работает. Результат можно посмотреть здесь: http://exampler.net/cotnewskin. Там же можно видеть базовый скин, который я начал рисовать.
Сначала попробовал взять за основу css-фреймворки, но после нескольких дней экспериментов понял, что это будет все-таки не очень универсальное решение.

На сайте пока промежуточный вариант, просто захотелось выложить его для обратной связи, вдруг я что-то не то делаю.
rangjungyeshe.ru
esclkm
#2 21.02.2009 00:00
Самая большая идея - это логика в шаблонизаторе. тогда иожно будет нормально заговорить о скинах
littledev.ru - мой маленький зарождающийся блог о котонти.
снижение стоимости программирования и снижение стоимости производства разные вещи. Первое можно скорее сравнить с раздачей работникам дешевых инструментов, чем со снижением зарплаты
medar
#3 21.02.2009 00:01
Да, кстати, плюс логика. Тоже скоро будет.
rangjungyeshe.ru
esclkm
#4 21.02.2009 00:06
медар) как будет логика - так сразу обыпим идеями...
точнее сразу же можно будет 50% движка перевернуть.... обезвредить его от злостного HTML
гору опций можно будет отлючить и убрать... короче - можно будет делать черное
littledev.ru - мой маленький зарождающийся блог о котонти.
снижение стоимости программирования и снижение стоимости производства разные вещи. Первое можно скорее сравнить с раздачей работникам дешевых инструментов, чем со снижением зарплаты
medar
#5 21.02.2009 00:29
А представь, что она уже есть. Что, например, можно будет сделать ?
rangjungyeshe.ru
esclkm
#6 21.02.2009 01:16
Целиком вынести весь хтмл из движка... весь хтмл и все изображения - в папку скинс.
еще - скин маркит апа - тоже должен выносится в скины, а также конфигфайл маркит апа - поясняю - допустим мне не нравится разбиение на миниэдитор и эдитор - я хочу сборную солянку.а когда буду обновлять движок - мне только ручкой помахают все мои чудо настройки.

Далее папка скина давайте упорядочим:
\ИМЯ СКИНА
дескрипшн
lang
css
\форумы\
\страницы\
\админка\ (но админка не целиком - а домустип админка форумов - лежит с форумами и тд)
\прочее\ (класса комменты поллы и др малые модули)
\плагины\
\js\ - папка js условная папка для хранения пользовательских скриптов
\images\ - изображения - но их привести в больший порядок чем есть сейчас.
littledev.ru - мой маленький зарождающийся блог о котонти.
снижение стоимости программирования и снижение стоимости производства разные вещи. Первое можно скорее сравнить с раздачей работникам дешевых инструментов, чем со снижением зарплаты
Отредактировано: esclkm (21.02.2009 01:23, 15 лет назад)
Ratibor
#7 21.02.2009 01:47
# medar : Я (пока не в svn, а у себя) в core заменил все эти вызовы на конструкцию <span> с background image.
Ну это тот же, только в профиль.
Может чем то лучше, чем то хуже, но все равно тот же.
Не задавай глупых вопросов, не услышишь вранья.
Отредактировано: Ratibor (21.02.2009 01:58, 15 лет назад)
esclkm
#8 21.02.2009 01:55
а ратибор, кстати, прав.
Мы получим опять теже яица только в профиль.
А вот если мы придумаем логику и вынесем весь хтмл - тогда юзер сам будет выбирать как и что ему делать - что есть наиболее оптимально.
А текущий вариант и твой вариант имеют временную привязку - так зачем заменять временное на временное
littledev.ru - мой маленький зарождающийся блог о котонти.
снижение стоимости программирования и снижение стоимости производства разные вещи. Первое можно скорее сравнить с раздачей работникам дешевых инструментов, чем со снижением зарплаты
Ratibor
#9 21.02.2009 01:58
К примеру можно в папке скина создать файлик, типа ланг файла,
а в нем все картинки вписать, т.е. одна переменная одна строка,
а в самом движке вместо html кода картинки вписывать переменную,
тогда каждый сможет издеваться над картинками как сможет.
Не задавай глупых вопросов, не услышишь вранья.
esclkm
#10 21.02.2009 02:05
нет. не согласен.

imagine.
сейчас допустим наш движок при определенных условиях выдает такую строку только для зарегеных пользователей
<a href="http://weather.yandex.ru/26781/"><img src="http://img.yandex.net/i/12.gif"alt=""></a>
появляется логика... и движку будет достаточно отправить в шаблон такую строку
http://weather.yandex.ru/26781/
дальше же шаблонизатор проверит пуста ли это строка, если нет то сформирует все в лучших традициях.
littledev.ru - мой маленький зарождающийся блог о котонти.
снижение стоимости программирования и снижение стоимости производства разные вещи. Первое можно скорее сравнить с раздачей работникам дешевых инструментов, чем со снижением зарплаты
Aristei
#11 21.02.2009 02:19
# esclkm : нет. не согласен.

imagine.
сейчас допустим наш движок при определенных условиях выдает такую строку только для зарегеных пользователей
<a href="http://weather.yandex.ru/26781/"><img src="http://img.yandex.net/i/12.gif"alt=""></a>
появляется логика... и движку будет достаточно отправить в шаблон такую строку
http://weather.yandex.ru/26781/
дальше же шаблонизатор проверит пуста ли это строка, если нет то сформирует все в лучших традициях.

Вопрос а не отразится ли это на скорости я не особо в программированиии разбираюсь но если мыслить логически что в перовм варианте чистый html из шаблона отдается браузеру, а тут дополнительная работа для шаблонизаьтора, или я гоню?
Sorry for my English
Ratibor
#12 21.02.2009 02:25
# esclkm : дальше же шаблонизатор проверит пуста ли это строка, если нет то сформирует все в лучших традициях.
Вот только у каждого народа свои традиции :-)
Плюс того что я предложил в предыдущем посте,
в движке останутся тольк опеременные,
а html код этим переменным каждый напишет сам.
Не задавай глупых вопросов, не услышишь вранья.
esclkm
#13 21.02.2009 02:26
в первом случае php - отдает в шаблон готовую ссылку... вместе с картинкой... Во вотором уже шаблонизатор частично думает. На скорости - чуть снизит - но как модно говорить "экономия на спичках"

===
ratibor - смотри сам - я тоже самое предложил только более рационально
littledev.ru - мой маленький зарождающийся блог о котонти.
снижение стоимости программирования и снижение стоимости производства разные вещи. Первое можно скорее сравнить с раздачей работникам дешевых инструментов, чем со снижением зарплаты
Отредактировано: esclkm (21.02.2009 02:27, 15 лет назад)
Dayver
#14 21.02.2009 03:12
Как писали класики.....трудности в достижении высокой скорости из-за использования мускля(бутылочное горлышко)......пхп (шаблонизатор) мож и станет работать медленее но этого всеравно никто не заметит.....ибо все тормоза из-за мускля
Pavlo Tkachenko aka Dayver
Aristei
#15 21.02.2009 03:59
Ну может и экономия на спичка а с другой стороны тут не стали экономить, в другом месте не стали, и из мелочей общая производительность падает, все таки ИМХО если есть возможность хоть маленькая быть еще быстрее то лучше ей воспользоваться, а то так и до медленного друпала докатимся.
Sorry for my English

1234>>>