Прежде чем углубиться в обсуждение конкретно шаблона давайте еще раз попробуем разобраться что же такое шаблон в joomla. В понимании большинства пользователей шаблон отвечает за внешнее оформление страниц вашего сайта. Однако, шаблон это не только дизайн.
В него также входят механизмы определяющие размещение данных, способы и интервалы отображения различных модулей данных, языковые параметры и т.д.
В предыдущих версиях Joomla использовался базовый шаблон Beez. В последних версиях шаблоны построенные на его основе (Beez5, Beez_20) претерпели существенные изменения в сравнении с ним. Создавая шаблон Beez разработчики вкладывали в него возможные варианты приспосабливания под нужны любого владельца сайта. Исходный код шаблона можно было легко изменить. Внесение изменений в каскадные таблицы стилей позволяло с легкостью создать совершенно новый шаблон оформления не затрачивая значительных усилий. Но в процессе работы дизайнеры старались не пользоваться данным шаблоном, а разрабатывали свои собственные с нуля.
В результате были разработаны два совершенно новых шаблона для версии Joomla 2.5. В обоих шаблонах используется язык JavaScript, в шаблоне beez5 используется язык HTML5, в шаблоне beez_20 не требуются переопределения. При верстке нет необходимости использовать таблицы. Были изменены названия классов каскадных таблиц.
Свойства шаблонов
Новые шаблоны стали широко доступны, появилась возможность выбирать местоположение блока навигации на странице, добавлены функциональные метки WAI-ARIA, модули во вкладках могут выводиться в автоматическом режиме, добавлены сворачиваемые позиции для модулей и для колонок, в шаблоне beez_20 встроены две формы оформления: natural и human, добавлена поддержка языка HTML5 в шаблоне beez5.
Ни для кого не секрет что существуют люди, у которых ослаблены возможности восприятия окружающего мира. Кто-то не способен к зрительному восприятию, кто-то ограничен к восприятию звука. Однако эти люди тоже пользуются информационными ресурсами сети Интернет. И все создаваемые интернет-порталы должны быть рассчитаны и на данную категорию пользователей. Шаблоны Joomla обладают всеми необходимыми инструментами для того чтобы обеспечить людей с ограниченными возможностями возможностью пользования сетью Интернет.
При создании шаблонов необходимо придерживаться основных требований: материалы сайта не должны пересекаться с оформлением этих материалов, структура сайта не должна быть перегружена, переходы по страницам сайта должны поддерживаться командами с клавиатуры, цветовое оформление контента должно быть контрастным.
Наиболее важным моментом с точки зрения разработчика является разделение контента от оформления. Для этого необходимо избавиться от табличного оформления материала на странице. При форматировании используется только CSS. Материал необходимо выстраивать линейно сверху вниз.
Семантическое оформление позволяет осуществлять переход между страницами сайта основываясь на заголовках, списках и т.д., а также складывать общее представление о материале документа.
Однако, при линейном оформлении содержимого страницы существует недостаток – чтобы добраться до необходимой информации может понадобиться время (если информация содержится внизу страницы). Для исправления этой проблемы можно использовать закладки HTML для ускорения перемещения по странице. В этом случае предполагается создание дополнительного меню для перемещения по странице. Для тех кто уже знаком со структурой сайта данное меню можно скрывать.
Например:
<ul class="skiplinks"><li><a href="#main" class="u2">Перейти к основному тексту.</a></li><li><a href="#nav" class="u2">Перейти к основному блоку навигации и войти в систему.</a></li>
</ul>
При создании сайта необходимо уделить внимание цветовой гамме в оформлении. Если для обычного пользователя существенной разницы в контрасте цветов не существует, то для людей с ограниченными возможностями контраст имеет особое значение. В этом случае цвета фона и текста должны быть контрастными. Максимальная контрастность возможна в случае черного текста на белом фоне. Но для избежания проблем с оптическими искажениями фон страницы следует слегка окрасить.
Дизайн на шаблоне Beez_20
Данный шаблон предлагает два варианта оформления: personal и nature. Параметры этих вариантов хранятся в файлах personal.css и nature.css. для переключения используется специальная структура файлов и интерфейс шаблона.
Выбор варианта шаблона
Файлы position.css и layout.css отвечают за расположение элементов страницы и отступы на странице. При оформлении шаблона достаточно заменить файл personal.css на nature.css для изменения цветовой схемы.
Все эти варианты можно изменять на свой вкус.