Выбрать главу

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

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

Начинайте с простого.

Соответствует ли Joomla! требованиям доступности

Если кратко: нет.

Однако, в Joomla! версии 1.5.0 уже заложен фундамент, который в следующих версиях разовьется в полноценную поддержку всех аспектов, необходимых для создания доступного сайта.

Можно ли привести Joomla! в соответствие с требованиями доступности?

Если кратко: да!

Технология

Joomla! до версии 1.5.0 все еще использует разметку в виде XHTML таблиц. Однако, при построении сайта со «свободной» конфигурацией элементов использование тегов таблиц недопустимо. Таким образом, программный код Joomla!, отвечающий за вывод информации необходимо изменить. Сделать это можно с помощью системы видов, описанной в подразделе Изменение отображения HTML без изменения базовых файлов.

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

Проверить функциональность сайта можно с помощью массы различных инструментов. В поисках подходящего инструмента рекомендуем посетить сайт Яна Эрика Хеллбуша (Jan Eric Hellbusch).

Люди

Теперь перейдем к людям, которые наполняют сайт содержимым – редакторам. В первую очередь необходимо пробудить в них чувство ответственности.

Вот пример корректного и семантически правильного оформления текста:

<h1>заголовок первого уровня</h1>

<p>первый параграф</p>

<p>второй параграф</p>

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

<span class="heading">заголовок первого уровня</span>

Корректная же версия команды будет выглядеть так:

<h1 class="heading">заголовок первого уровня</h1>

Как научить этому редактора?

Существуют две программы, являющиеся стандартом для обработки текста: OpenOffice.org и MicrosoftWord. Редакторы должны иметь аналогичный инструмент с такими же возможностями для создании контента веб страниц. WYSIWYG редактор, встроенный в Joomla! реализует лишь малую часть этих возможностей. Вот еще один пример корректного размещения графики с использованием атрибутов title и longdesc:

<img src="companylogo.png" width="100" height="130" border="0" alt="companylogo" title="This is our company logo" />

<img src="companylogo.png" width="100" height="130" border="0" alt="companylogo" longdesc="companylogo.txt" />

Атрибут longdesc служит для размещения расширенного описания изображения

При наполнении сайта необходимо учесть еще массу таких «трюков». WYSIWYG редактор Joomla! не совсем подходит для таких целей.

Также очень важным является и корректное построение фраз. Язык текста должен быть легко понятен целевой аудитории. Журналистский талант может прийтись очень к стати!

Доступный сайт с Joomla!

Вот пример сайта Joomla!, отвечающего критериям веб доступности (www.3tc4u.co.uk):

Рис. 28: Доступный веб сайт

На этом же ресурсе можно найти примеры и других подобных сайтов.

Итог

Надеемся, что эта статья поможет вам в создании собственных шаблонов. Также мы постарались прояснить для вас понятие Web Accessibility (веб доступности) сайтов для различных групп пользователей. Дерзайте и у вас все получится!

Дополнение

Структура шаблона (файла index.php)

Элементы <jdoc> позволяют обращаться к динамическим секциям шаблона без использования PHP команд

Код шаблона:

<jdoc:tmpl name="loadcss" varscope="document"

type="condition" conditionvar="LANG_DIR">

<jdoc:sub condition="rtl">

<link href="templates/{TEMPLATE}/css/template_rtl.css"

rel="stylesheet" type="text/css" />

</jdoc:sub>

</jdoc:tmpl>

Эффект - Установка CSS поддержки для языков с письмом справа налево.

-----------------------

BODY

<jdoc:include type="message" />

<jdoc:include type="modules" name="[position]"style="[Style]" />

<jdoc:exists type="modules" condition="left" >

<jdoc:include type="modules" name="left" style="-3" />

</jdoc:exists>

<jdoc:include type="component" />

Отображение системных сообщений Joomla!

Загрузить модуль в позиции [position]. Стиль [style]: 0 – модуль отображается в табличной колонке (<td>…</td>)

    1 – горизонтальное меню

   -1 – отдельная строка

   -2 – позиционирование с помощью XHTML тегов (<div>…</div>)

   -3 – опция для форматирования «закругленных» углов.

Условная инструкция: если имеется модуль для отображения слева, загрузить его в шаблон

Отображение компонента. Имя компонента извлекается из URL.

Как заменить изображение (логотип) в шаблоне?

Чтобы заменить логотип в уже существующем шаблоне, необходимо просмотреть его исходный код. Графика и изображения могут быть определены как в HTML так и в CSS структурах. Размер графических изображений, обычно, оптимизируется под конкретный шаблон.

Заменить изображение в шаблоне можно одним из следующих методов:

Метод 1

  1. Создайте графический объект с таким же размером и разрешением, как и у заменяемого.

  2. Загрузите новый объект в Медиа Менеджер (MediaManager) joomla!

  3. Нажмите на графический файл, чтобы получить ссылку на него.

  4. Замените соответствующий атрибут тега img (<img src=) в исходном коде шаблона.

Метод 2

  1. Создайте новый графический объект и присвойте ему имя, аналогичное имени заменяемого.

  2. Просто замените старый графический объект новым.

Перевод и публикация:Copyright© 2007WWW.JOOMLAUA.COM