Таблицы данных и таблицы форматирования

Печать статьи

Читать журнал

Скачать журнал

Автор статьи: Наталья Щеголева ©

Сайт Автора: www.seo.su

E-mail Автора: natasha@regioninfo.ru

Дата публикации: 25.04.2006

Сверхсложные таблицы данных

Следующая таблица «Цены на вишню и абрикосы» состоит из трех уровней заголовков столбцов и двух уровней заголовков строк, при ее разметке применялись атрибуты ‘id’ и ‘headers’

Цены на ввозимые и отечественные вишню и абрикосы в Перте и Аделаиде
	Ввозимые			Отечественные
	Персики	Вишня		Персики	Вишня
		A сорт	Б сорт		A сорт	Б сорт
Перт
Опт	1.00 у.е.	9.00 у.е.	6.00 у.е.	1.20 у.е.	13.00 у.е.	9.00 у.е.
Розница	2.00 у.е.	12.00 у.е.	8.00 у.е.	1.80 у.е.	16.00 у.е.	12.50 у.е.
Аделаида
Опт	1.20 у.е.	-	7.00 у.е.	1.00 у.е.	11.00 у.е.	6.00 у.е.
Розница	1.60 у.е.	-	11.00 у.е.	2.00 у.е.	13.00 у.е.	10.00 у.е.

ВОПРОС: Сколько условных единиц составляет оптовая цена на ввозимую сливу А сорта в городе Перте?

В фрагменте разметки таблицы элементы ‘id ’и ‘headers’ выделены жирным шрифтом:

<thead>
    <tr>
       <td></td>
       <th id ="ввоз" colspan ="3">Ввозимые</th>
       <th id ="отеч" colspan ="3">Отечественные</th>
    </tr>
    <tr>
       <td></td>
       <th headers ="ввоз" id =" imp -абр">Абрикосы</th>
       <th headers =" ввоз" id =" ввоз -виш" colspan ="2">Вишня</th>
       <th headers ="отеч" id ="отеч- apr ">Абрикосы</th>
       <th headers ="отеч" id ="отеч- che " colspan ="2">Вишня</th>
    </tr>
    <tr>
       <td></td>
       <td></td>
       <th headers =" ввоз ввоз-виш" id =" ввоз -виш- a сорт" > A сорт</th>
       <th headers =" ввоз ввоз-виш" id =" ввоз-виш-бсорт">Б сорт</th>
       <td></td>
       <th headers ="отеч отеч-виш" id ="отеч-виш- a сорт"> A сорт</th>
       <th headers ="отеч отеч-виш" id ="отеч-виш-бсорт">Б сорт</ th>
    </tr>
</thead>
... продолжение разметки...

<tbody>
    <tr>
       < th id ="перт" colspan ="7">Перт</th>
       </tr><tr>
       <th headers ="перт" id ="перт-опт" >Опт</th>
       <td headers ="ввоз ввоз-абр перт перт-опт">1.00 у.е.</td>
       <td headers =" ввоз ввоз -виш ввоз -виш- a сорт перт перт-опт">9.00 у.е.</td>
       < td headers ="ввоз ввоз-виш ввоз-виш- b сорт перт перт-опт"> 6.00 у.е.</td>
       <td headers ="отеч отеч-абр перт перт-опт">1.20 у.е.</td>
... продолжение разметки...

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

Если искомой ячейкой является ячейка «9 у.е.», JAWS «прочтет информацию данной ячейки» так:

«пятая строка, третий столбец, ввозимые Перт опт вишня А сорт, девять условных единиц».

Отдавайте предпочтение простым таблицам

Как уже отмечалось, многоуровневые заголовки столбцов могут дезориентировать пользователей «скрин ридеров». Например, выше приведенную таблицу JAWS прочтет следующим образом:

«таблица из 7 столбцов и 9 строк (далее общая содержание таблицы и т.п.)»

Строки с заголовочными ячейками будут представлены так:

Три столбца строка первая…

Пять столбцов строка вторая…

Семь столбцов строка третья…

Нет указания на то, какие строки содержат заголовочные ячейки. Также не совсем понятно, из скольких столбцов состоит таблица. Применение атрибута ‘ headers ’ в разметке таблицы позволит вспомогательной программе различать заголовочные ячейки при прочтении информации.

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

Список похожих статей