Комментарии 38
Шикарная статья!!!
Можно так же немного побаловаться и с php, то есть если клиент вводит в визуальный редактор движка ненужные теги, то при выводе контента эти теги просто режутся.
Буду использовать!!!
З.Ы.: Где-то видел в сети CSS-фреймворк на подобную тему. Нужно бы найти и выложить на Хабре.
Можно так же немного побаловаться и с php, то есть если клиент вводит в визуальный редактор движка ненужные теги, то при выводе контента эти теги просто режутся.
Буду использовать!!!
З.Ы.: Где-то видел в сети CSS-фреймворк на подобную тему. Нужно бы найти и выложить на Хабре.
Описание некоторых CSS Frameworks и CSS Reset http://www.smashingmagazine.com/2007/09/…
Сам нераз использовал Tripoli http://monc.se/tripoli/ ... для кроссбраузерности очень хорошая вещь
Сам нераз использовал Tripoli http://monc.se/tripoli/ ... для кроссбраузерности очень хорошая вещь
- Ало, здравствуйте! А вот не работает! А в дизайне от другого дизайнера работало!
Приблизительно так и будет. И убеждать клиента, что не надо так делать, как делает он почти бессмысленно. За редким исключением. Для себя я нашел выход. В своей CMS я просто не даю заказчику лишних инструментов для коверкания сайта. Только самый необходимый минимум + выбор предустановленных стилей для блоков текста.
Да, такое случится скорее всего, но лучше так, чем не делать ничего.
Мне кажется, что лучше приложить усилия и надавить на тех, кто может сделать чистку кода на сервере.
Ага.
Легче и правильнее всё, задаваемое в визуальных редакторах при сохранении менять по определенным правилам, визуальные теги менять на семантические, фонты на дивы с инлайн стилями (хотя бы так) и всё прочее в том же духе.
Ну и сам визуальный редактор хорошо бы подкорректировать, если там неправильные теги присутствуют.
CSS для этого, действительно, не катит.
Легче и правильнее всё, задаваемое в визуальных редакторах при сохранении менять по определенным правилам, визуальные теги менять на семантические, фонты на дивы с инлайн стилями (хотя бы так) и всё прочее в том же духе.
Ну и сам визуальный редактор хорошо бы подкорректировать, если там неправильные теги присутствуют.
CSS для этого, действительно, не катит.
К сожалению это не всегда возможно и не всегда оптимально.
CSS чтобы скрыть то, что можно еще на сервере вырезать.
А в чем плюсы вообще?
А в чем плюсы вообще?
клиенту не позавидую :-|
по-моему предупреждения во всех отношениях лучше — и цель достигнута, и понятно будет «откуда ноги» растут у отказа привычного кода работать
по-моему предупреждения во всех отношениях лучше — и цель достигнута, и понятно будет «откуда ноги» растут у отказа привычного кода работать
Мне кажется, что лучше удалаять ненужные теги прямо в редакторе - тогда сразу видно, как меняется текст. Я сделал просто - высякие теги типа FONT и SPAN вырезаю. А чтобы можно было оставлять форматирование - разрешаю классы внутри разрешенных тегов. Как отличить разрешенный класс от ненужного? Все свои классы для сайта начинаю с префикса, например, r4_div - и проверяю - можно ли этот класс оставить.
Может, кому и пригодится. Вот некоторые куски кода:
var allowTags=Array('P','B','I','UL','LI','OL','DIV','H1','H2','H3','TABLE','TBODY','TR','TD','A','CENTER','INPUT','TEXTAREA','FORM','IMG','OBJECT','EMBED','PARAM');
var clearTags=Array('SPAN','O:P','FONT','COL','COLGROUP','U','O','font','small');
var allowClaPrefix='r4_';
function ieClearStyles(coll,count)
{
if(count>860)
return;
var coll=coll.children;
if (coll!=null)
{
for (var i=0; i coll.length; i++)
{
//alert("Tag: "+coll[i].tagName+", Count: "+count);
var claName=coll[i].className;
if(allowClaPrefix==claName.substring(0,3))
{
coll[i].style.cssText="";
}
else if(coll[i].tagName=='OBJECT' || coll[i].tagName=='EMBED' || coll[i].tagName=='PARAM')
{
// do nothing width video
}
else
{
if(coll[i].tagName=='A')
{
coll[i].style.cssText="";
coll[i].className='';
}
else if(coll[i].tagName=='TD' || coll[i].tagName=='TH')
{
coll[i].style.cssText="";
if(coll[i].className && allowClaPrefix!=claName.substring(0,3))
coll[i].className="";
else
var cla=coll[i].className;
var rows=coll[i].getAttribute('rowspan');
var cols=coll[i].getAttribute('colspan');
coll[i].clearAttributes();
coll[i].setAttribute('colspan',cols);
coll[i].setAttribute('rowspan',rows);
}
else if(coll[i].tagName=='IMG')
{
coll[i].style.cssText="";
coll[i].className='';
}
else
{
coll[i].clearAttributes();
coll[i].style.cssText="";
}
if(coll[i].tagName=='TABLE')
coll[i].className=allowClaPrefix+"tab_1";
}
ieClearStyles(coll[i],count+1);
}
}
}
Может, кому и пригодится. Вот некоторые куски кода:
var allowTags=Array('P','B','I','UL','LI','OL','DIV','H1','H2','H3','TABLE','TBODY','TR','TD','A','CENTER','INPUT','TEXTAREA','FORM','IMG','OBJECT','EMBED','PARAM');
var clearTags=Array('SPAN','O:P','FONT','COL','COLGROUP','U','O','font','small');
var allowClaPrefix='r4_';
function ieClearStyles(coll,count)
{
if(count>860)
return;
var coll=coll.children;
if (coll!=null)
{
for (var i=0; i coll.length; i++)
{
//alert("Tag: "+coll[i].tagName+", Count: "+count);
var claName=coll[i].className;
if(allowClaPrefix==claName.substring(0,3))
{
coll[i].style.cssText="";
}
else if(coll[i].tagName=='OBJECT' || coll[i].tagName=='EMBED' || coll[i].tagName=='PARAM')
{
// do nothing width video
}
else
{
if(coll[i].tagName=='A')
{
coll[i].style.cssText="";
coll[i].className='';
}
else if(coll[i].tagName=='TD' || coll[i].tagName=='TH')
{
coll[i].style.cssText="";
if(coll[i].className && allowClaPrefix!=claName.substring(0,3))
coll[i].className="";
else
var cla=coll[i].className;
var rows=coll[i].getAttribute('rowspan');
var cols=coll[i].getAttribute('colspan');
coll[i].clearAttributes();
coll[i].setAttribute('colspan',cols);
coll[i].setAttribute('rowspan',rows);
}
else if(coll[i].tagName=='IMG')
{
coll[i].style.cssText="";
coll[i].className='';
}
else
{
coll[i].clearAttributes();
coll[i].style.cssText="";
}
if(coll[i].tagName=='TABLE')
coll[i].className=allowClaPrefix+"tab_1";
}
ieClearStyles(coll[i],count+1);
}
}
}
простите, а чем SPAN не угодил?
Просто при переносе из ворда очень много лишних стилей переносится именно чере SPAN. И когда их на 1 предложение до 12 штук разной степени вложенности - очень сложно автоматом вычистить то, что нужно. А так можно и SPAN оставить - я против него лично ничего не имею :). Но мне в 99% этот тег не нужен.
Классно. Респект.
Однако, клиент может оказаться еще более «продвинутым» доберется какой-нибудь «программист» до этого нехитрого ресета, обнаружив в нем корень всех своих проблем, и сделает ему кильдык. Отрапортует потом менеджеру, что всё, мол, можно дальше работать, теперь ваша разметка заработает.
По статистике (я работал в двух компаниях) 100% сайтов, ушедших на сопровождение к самим клиентам (с любыми админками, висивигами, базами данных, цэ-эм-эсами), возвращаются через короткий срок неоперабельными после плодотворных усилий «спецов», по дешевке решающих подобные «проблемы», стройная система разрушается и сайт перестает работать в привычном смысле этого слова. Беда зачастую состоит еще и в том, что в стремлении «сэкономить» (а именно им обусловлен отказ от профессиональной поддержки) такие клиенты продолжают обращаться к «спасителю», а не к авторам оригинальной системы. «Веб-мастер» сдельно создает новые страницы и правит старые пользуясь обычно статическим HTML или иногда жесткими конструкциями
То есть я что хочу сказать предложенный метод весьма хорош, если клиенту иногда самому надо что-то добавить на сайт, а у исполнителя системы нет времени контролировать каждое изменение. Но полностью защитить систему от дурака такое нововведение не сможет, увы.
Однако, клиент может оказаться еще более «продвинутым» доберется какой-нибудь «программист» до этого нехитрого ресета, обнаружив в нем корень всех своих проблем, и сделает ему кильдык. Отрапортует потом менеджеру, что всё, мол, можно дальше работать, теперь ваша разметка заработает.
По статистике (я работал в двух компаниях) 100% сайтов, ушедших на сопровождение к самим клиентам (с любыми админками, висивигами, базами данных, цэ-эм-эсами), возвращаются через короткий срок неоперабельными после плодотворных усилий «спецов», по дешевке решающих подобные «проблемы», стройная система разрушается и сайт перестает работать в привычном смысле этого слова. Беда зачастую состоит еще и в том, что в стремлении «сэкономить» (а именно им обусловлен отказ от профессиональной поддержки) такие клиенты продолжают обращаться к «спасителю», а не к авторам оригинальной системы. «Веб-мастер» сдельно создает новые страницы и правит старые пользуясь обычно статическим HTML или иногда жесткими конструкциями
if(), вписываемыми прямо в исполняемый файл движка (безотносительно от его архитектуры). Когда клиент возопит, что сайт окончательно перестал работать, вернется к авторам и бросит им в лицо требование сделать всё «как было», исправлять что-то уже бывает поздно гораздо быстрее можно воссоздать сайт с нуля, чем откатить неизвестное количество неизвестных изменений.То есть я что хочу сказать предложенный метод весьма хорош, если клиенту иногда самому надо что-то добавить на сайт, а у исполнителя системы нет времени контролировать каждое изменение. Но полностью защитить систему от дурака такое нововведение не сможет, увы.
Да и, кстати же, первое изменение, которое захочет внести клиент (без шуток) - это в новостях написать «СКИДКИ!!!» жирным красным Comic Sans, и чтоб по центру. Без этого не менее половины из них свой сайт не ценят.
Да, конечно захотят. Но это задача дизайнера сразу предусмотреть несколько информационных блоков. Кликаешь на кнопку - сразу вставляется нужный код, что-то вроде div class=r4_attention Здесь важное сообщение /div и в классе прописаны и размер шрифта, и его цвет и т.д. То что у пользователя нет возможности сделать какие-то вещи - это значит не понял исполнитель заказчика. А таких блоком модет быть много:
1. 2 колонки
2. небуллетированные списки
3. специальное форматирование (фото+имя+e-mail) для списка сотрудников
Вобщем, надо придусматривать изначально действия.
1. 2 колонки
2. небуллетированные списки
3. специальное форматирование (фото+имя+e-mail) для списка сотрудников
Вобщем, надо придусматривать изначально действия.
Просто до получения контроля над сайтом клиент стучал *чем-то* по столу и требовал соблюдения фирменного стиля. Что позволено Юпитеру, как водится...
... быку, собственно, не положено! Безусловно. При должном упорстве сломать и испортить можно все. Но когда есть возможность дать готовые шаблоны, которые помогут "не навредить".
Проблема у клиентов одна - у него нет человека с чувством вкуса. Ну не может серетарь писать нормальные тексты и обрабатывать картинки - если бы могла - уж давно бы работала на другом месте.
Я к тому, что лучше сайт поддерживать. Уж клиенту выгоднее платить студии 6000р. в месяц за 2 новости и 3 позиции в каталоге, чем нанимать отдельного человека. И сайт хороший, и у студии есть постоянные деньги - всем хорошо.
Проблема у клиентов одна - у него нет человека с чувством вкуса. Ну не может серетарь писать нормальные тексты и обрабатывать картинки - если бы могла - уж давно бы работала на другом месте.
Я к тому, что лучше сайт поддерживать. Уж клиенту выгоднее платить студии 6000р. в месяц за 2 новости и 3 позиции в каталоге, чем нанимать отдельного человека. И сайт хороший, и у студии есть постоянные деньги - всем хорошо.
Яркий пример http://kld-m.ru/
Не знаю, по-моему, клиент в праве делать что хочет со своим сайтом. Это как запрещать изменять wallpaper, или, скажем панели — можно-то оно можно, вот только нужно ли. Пусть делают, что хотят — лишь бы им самим было хорошо. А не вывешивать лишних инструментов здесь, пожалуй, уже правильный способ. Хотят сделать «красиво» — пусть учат HTML/CSS и вбивают ручками.
Да и, кстати, не убьёт ли «font-family:expression (this.parentNode.currentStyle['fontFamily']);» валидность CSS?
Да и, кстати, не убьёт ли «font-family:expression (this.parentNode.currentStyle['fontFamily']);» валидность CSS?
Любой expression убьет валидность CSS. Я всегда выношу стили для IE в отдельный файл с помощью Conditional Comments.
Тут палка о двух концах. С одной стороны имеет. А с другой - у меня есть некоторые кол-во работ, которые я не рискну показать потенциальному заказчику. Именно по причине того, что они были испорчены в процессе эксплуатации.
В обсуждаемой в статье подходе, имхо, есть одна принципиальная ошибка. Клиент делает большой красный текст, но потом его не видит. Что он думает? Правильно. Не работает. И начинает трясти разработчика на предмет "какого фига". И, по большому счету, правильно делает. Поэтому я считаю, что не надо такие возможности вообще предусматривать. Минимальные возможности типа выделения жирным + готовые шаблоны. И все. О чем вы, собственно и сказали :)
В обсуждаемой в статье подходе, имхо, есть одна принципиальная ошибка. Клиент делает большой красный текст, но потом его не видит. Что он думает? Правильно. Не работает. И начинает трясти разработчика на предмет "какого фига". И, по большому счету, правильно делает. Поэтому я считаю, что не надо такие возможности вообще предусматривать. Минимальные возможности типа выделения жирным + готовые шаблоны. И все. О чем вы, собственно и сказали :)
Если у клиента элементарно отсутствует вкус, то бороться с этим только себе дороже. Это один из тех случаев, когда дураку уже проще дать, что он хочет, забрать деньги и жить счастливо.
Представте, если бы производители боролись с тем, что они считают неуместным применительно к их продукции? Хочешь закачать рингтон, а вот нет! Исполнитель не тот. Обои на рабочий стол? Нееет, сильно откровенная барышня. Литые диски на авто? Сильно дерзкие, не сочетаются с имиджем нашей марки.
Я в таком мире жить не хочу.
Лично я на убогий сайт второй раз не зайду. И человек, который его испортил, потеряет потенциального клиента.
Сугубо личное мнение.
Представте, если бы производители боролись с тем, что они считают неуместным применительно к их продукции? Хочешь закачать рингтон, а вот нет! Исполнитель не тот. Обои на рабочий стол? Нееет, сильно откровенная барышня. Литые диски на авто? Сильно дерзкие, не сочетаются с имиджем нашей марки.
Я в таком мире жить не хочу.
Лично я на убогий сайт второй раз не зайду. И человек, который его испортил, потеряет потенциального клиента.
Сугубо личное мнение.
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Отключаем нежелательные HTML-элементы с помощью CSS