Оптимизация и упрощение работы контент-редактора.
Одним из важных этапов проектирования сайтов является анализ и уточнение того, как с ним должны работать конечные пользователи. Сверстать шаблон, разработать и интегрировать программные модули в него, распределить права доступа и запустить сайт – это только половина дела, причем последняя.
Сайт должен быть спроектирован и организован так, чтобы конечным пользователям было максимально удобно им пользоваться. Если вкратце – то это называется Юзабилити (по-русски – удобство использования и работы (УИР)).
Сейчас речь пойдет об одном из аспектов оптимизации сайта – упрощение и ускорение работы контент-редактора сайта.
Если сайт только разрабатывается, то уже на этапе проектирования дизайна сайта необходимо разбить используемые стили на 2 группы:
Но даже если сайт уже существует, можно рассортировать уже имеющиеся стили.
Для первой группы задаются уникальные имена стилей и, как правило, они недоступны для использования контент-редактором.
Для второй группы переопределяются стили для html-тэгов (параграф, список и т.п.). Если используются не все html-теги заголовков (<h2>, <h3>, <h4>), то их можно использовать для выделения тезисов, примечаний и т.п. Также можно создавать и новые классы, но их должно быть как можно меньше и только тогда, когда без них никак не обойтись. Например, для тех же тезисов, примечаний и др. Также в первой группе не должно быть переопределенных html-тегов, все классы должны быть с уникальными именами, в противном случае стили первой группы могут «поползти», если для html-тегов второй группы стилей будут меняться параметры оформления.
Пример файла CSS-стилей, разбитых на 2 группы:
Далее в качестве примера используем CMS-систему Битрикс. Ниже приводятся основные html-теги, используемые в визуальном редакторе по умолчанию:
1. <h1>, <h2> и т.п. – для заголовка;
2. <p>, <i>< <strong>, <u> – для параграфов анонса и полного текста и выделения текста в них;
3. <a> – для ссылок;
4. <ol>, <ul>, – нумерованый и ненумерованый списки;
5.,
Одним из важных этапов проектирования сайтов является анализ и уточнение того, как с ним должны работать конечные пользователи. Сверстать шаблон, разработать и интегрировать программные модули в него, распределить права доступа и запустить сайт – это только половина дела, причем последняя.
Сайт должен быть спроектирован и организован так, чтобы конечным пользователям было максимально удобно им пользоваться. Если вкратце – то это называется Юзабилити (по-русски – удобство использования и работы (УИР)).
Сейчас речь пойдет об одном из аспектов оптимизации сайта – упрощение и ускорение работы контент-редактора сайта.
Если сайт только разрабатывается, то уже на этапе проектирования дизайна сайта необходимо разбить используемые стили на 2 группы:
- Стили, используемые в дизайне сайта.
Это оформление текста и заголовков страницы, стили рисунков, параметры отступа, позиционирования. Эти элементы постоянны, редко модифицируются (за исключением случаев полного редизайна). Контент-редактор с такими элементами работает очень редко. Здесь можно дать полный простор творческой фантазии дизайнера.
- Стили, используемые для материалов.
Заголовок, анонс, полный текст новости, тезисы, примечания, выделение текста и т.п. То есть, то, с чем постоянно работает контент-редактор. Здесь ко всем дизайнерским изыскам надо подходить очень критично: использовать стандартные шрифты, отказаться от спецэффектов, которые работают не во всех браузерах и т.п.
Но даже если сайт уже существует, можно рассортировать уже имеющиеся стили.
Для первой группы задаются уникальные имена стилей и, как правило, они недоступны для использования контент-редактором.
Для второй группы переопределяются стили для html-тэгов (параграф, список и т.п.). Если используются не все html-теги заголовков (<h2>, <h3>, <h4>), то их можно использовать для выделения тезисов, примечаний и т.п. Также можно создавать и новые классы, но их должно быть как можно меньше и только тогда, когда без них никак не обойтись. Например, для тех же тезисов, примечаний и др. Также в первой группе не должно быть переопределенных html-тегов, все классы должны быть с уникальными именами, в противном случае стили первой группы могут «поползти», если для html-тегов второй группы стилей будут меняться параметры оформления.
Пример файла CSS-стилей, разбитых на 2 группы:
------------------------------------------------------------------/* Стили, использованные в дизайне */ .headline { padding-left: 20px; padding-right: 20px; } …………………. .menu { margin-left: 30px; margin-top: 30px; } /* Обратите внимание, что здесь все классы имеют свои уникальные имена. Html-теги в этой секции не переопределяются. */ /* Стили, для контент-редактора */ p { font-family: Verdana, Arial, Helvetica; font-size: large; } …………………. ol { font-weight: bold; color: #CCFF00; } …………………. .attention { color: #FF0000; font-weight: bold; } /* Обратите внимание, что здесь переопределяются html-теги. */ ------------------------------------------------------------------ |
Далее в качестве примера используем CMS-систему Битрикс. Ниже приводятся основные html-теги, используемые в визуальном редакторе по умолчанию:
1. <h1>, <h2> и т.п. – для заголовка;
2. <p>, <i>< <strong>, <u> – для параграфов анонса и полного текста и выделения текста в них;
3. <a> – для ссылок;
4. <ol>, <ul>,
5.
- при использовании таблиц; 6. И т.д. Вначале переопределяем стили для этих html-тегов в соответствии с дизайном сайта. Также подключаем (предполагается, что вы прошли основные учебные курсы по «1С-Битрикс») новые стили 2 группы для примечаний, тезисов и прочего к выпадающему списку стилей визуального редактора. Итог: работа контент-редактора сильно упрощается. Ему достаточно будет вставить из буфера обмена текст, почистив его от «Word-мусора», или набрать его с «нуля». Далее пройтись по тексту, проставить кое-где заново списки, ссылки, выделить примечания или тезисы с применением подключенных стилей. Форматирование будет применяться автоматически. При таком подходе мы на выходе получаем относительно «чистый» контент, который содержит стандартные html-теги, минимально «замусорен» дополнительными стилями и почти всегда без «чистки» может быть интегрирован в новый дизайн или перенесен на другой движок CMS. Действуя по аналогии, все вышенаписанное можно применять и для других CMS-систем. Надо только проверить, какие html-теги там используются в имеющемся визуальном редакторе, переопределить их в файле css-стилей CMS и уточнить, как в нем можно подключить дополнительные стили для контент-редактора. Пожелания и комментарии приветствуются. ICQ: 778818 E-Mail: jalart@vladsun.com URL проекта "Путем проб и ошибок 1С-Битрикс": Владимир. |