Списки принадлежат к наиболее употребительным формам, как в электронных, так и в печатных изданиях. Возможность представления списковых структур предусмотрена практически во всех текстовых редакторах, в частности, развитая система для списковых структур имеется в MS Word, весьма популярном редакторе в нашей стране. В HTML-документах наряду с обычными маркированным и нумерованным списками предусмотрен отдельный список определений. Оформление этих списков посредством специальных тэгов составит предмет этого раздела.
2.3.1. Маркированные списки
Маркированные списки создаются с помощью тэга-контейнера <UL> (Unordered List – ненумерованный список). В тэге могут использоваться два параметра: COMPACT (сжатый, компактный), который изначально предназначался для вывода элементов списка в компактной форме (уменьшенным кеглем и расстоянием между строками) и TYPE (тип), который используется для принудительного задания вида маркера. Параметр COMPACT не имеет значений. Современными браузерами он игнорируется. Параметр TYPE может принимать одно из трех значений: disc (круг), circle (окружность) и square (квадрат). В первом случае маркеры (bullets) имеют вид закрашенного круга, во втором – окружности малого диаметра, в третьем – закрашенного квадрата. По умолчанию значение TYPE=disk.
Каждому элементу списка предшествует тэг <LI> (List Item – элемент списка), который необязательно должен быть контейнером. В качестве параметра этого тэга также используется TYPE, который может принимать те же самые 3 значения. Таким образом, в списке принципиально могут использоваться и различные маркеры для представления отдельных элементов.
2.3.2. Создание нумерованных списков
Нумерованный список организуется с помощью тэга-контейнера <OL> (Ordered List – нумерованный список), внутри которого размещаются все элементы списка. Открывающий и закрывающий тэги обеспечивают пропуски строк до и после списка, выделяя его таким образом в документе. В составе тэга могут использоваться 3 параметра: COMPACT, TYPE и START (начало). Смысл первого параметра тот же самый, что и в тэге <UL>. Параметр TYPE по-прежнему определяет тип маркера, причем TYPE=1 определяет маркеры в виде арабских цифр, TYPE=A задает маркеры в виде прописных букв латинского алфавита, TYPE=a – в виде строчных латинских букв, наконец, TYPE=I и TYPE=i определяют маркеры в виде римских цифр, больших и малых соответственно. Параметр TYPE, заданный в форме конкретного числа определяет начало отсчета для первого элемента списка. Начальный номер элемента может быть задан и путем задания значения параметра START.
Каждый элемент нумерованного списка предваряется тэгом <LI>, причем в этом случае в составе тэга может содержаться параметр VALUE (значение), который позволяет изменять номер очередного элемента списка, в результате чего соответственно изменяются и все последующие номера. В качестве примера можно привести фрагмент спортивных новостей, в которых содержатся результаты какого-либо соревнования:
<HTML> <HEAD> <TITLE> Пример нумерованного списка </TITLE> </HEAD>
<BODY> <OL> <B> Результаты чемпионата мира по гандболу 2001 </B>
<LI> Франция
<LI>Румыния
<LI>Германия <BR>
…
<LI VALUE=6> Россия
<LI> Украина
</OL> </BODY> </HTML>
При выводе в окне браузера документа, HTML-код которого представлен выше, мы увидим изображение, показанное на рис. 2.4. Название документа, размещенное в тэге-контейнере <TITLE> в заголовочной части документа, выведено в строке заголовка браузера. Название списка в теле документа показано полужирным шрифтов перед собственно списком. Нумерация списка по умолчанию производится арабскими цифрами, так как параметр TYPE в тэге <OL> отсутствует. Нумерация списка начинается по умолчанию с первого номера, так как и параметр START в тэге <OL> отсутствует. С помощью параметра VALUE=6 в одном из тэгов <LI> изменен номер очередного элемента списка, а дальнейшая нумерация продолжается с нового номера. Для создания строки, в которой содержится любое заданное количество точек использован тэг принудительного перевода строки <BR>.
Рис. 2.4. Пример отображения в браузере MS Internet Explorer нумерованного списка
2.3.3. Списки определений
В научно-технических и учебных изданиях нередко используют списки или словари определений, которые в зарубежных книгах называют глоссариями. В качестве примеров можно сослаться на [32] и [24]. Каждый элемент такого списка начинается с определяемого термина, после которого следует его определение. Для создания списка определений служит тэг-контейнер <DL> (Definition List список определений), внутри которого тэг <DT> (Definition Term определяемое слово, термин) задает определяемый термин в форме единственной строки, а тэг <DD> (Definition Description описание определяемого термина) предшествует абзацу с определением этого термина. В качестве примера приведем фрагмент списка определений для компьютерной графики.
<html><head> <title>Cписок терминов и определений</title> </head>
<body bgcolor=#d5d5d5>
<DL> <DT>Пиксел
<DD>Наименьший элемент изображения, который характеризуется постоянством параметров по всей своей поверхности
<DT>Разрешение монитора
<DD>Разрешение монитора определяется количеством пикселов на единицу длины и составляет около 96 пикселей на дюйм
<DT>Линиатура растра
<DD> Частота размещения растровых точек в плоскости изображения, измеряется числом линий на дюйм
</DL> </body> </html>
Отображение этого файла в окне просмотра браузера показано на рис. 2.5. Как следует из записи исходного HTML-документа никаких попыток выравнивания текста и формирования отступов не производилось. Сами тэги <DT> и <DD> так форматируют текст, что обеспечивают оптимальное его восприятие пользователем. Фон документа задается определенным уровнем серого, в соответствии со значением параметра BGCOLOR в тэге <BODY>. Кстати, язык HTML, как следует из представленного выше фрагмента HTMLкода, нечувствителен к регистру.
Рис. 2.5. Пример отображения в браузере документа – списка определений
2.3.4. Многоуровневые списковые структуры
Многоуровневые списки в HTML-документах могут создаваться путем вложения одного типа списка внутрь другого. Например, фрагменты нумерованного списка могут быть вложены внутрь маркированного или наоборот. Сказанное иллюстрируется простым примером, в котором перечисляются спутники некоторых планет нашей солнечной системы.
<HTML>
<HEAD>
<TITLE>Пример двухуровневого списка</TITLE> </HEAD>
<BODY> <UL> <B> Спутники планет </B>
<BR>....
<LI> ЗЕМЛЯ
<OL> <LI> Луна </OL>
<LI>МАРС
<OL> <LI> Фобос
<LI>Деймос </OL>
<BR>....
</UL> </BODY> </HTML>
Отображение двухуровневого списка в окне браузера показано на рис. 2.6. Внутри тэга-контейнера маркированного списка <UL> размещены 2 контейнера нумерованного списка <OL> и </OL> со своими тэгами <LI> каждый. Дополнительный отступ слева обеспечивает хорошую читаемость текста. По этой схеме можно создавать и многоуровневые списки.
Рис. 2.6. Пример отображения в браузере двухуровневого списка
2.4. Использование графики при оформлении электронного издания
Известно, что с помощью графики можно точнее передать идеи и назначение любого издания, в том числе и электронного. Без иллюстрации полосы набора выглядят однообразными, а хорошо подобранная и умело размещенная графика делает издание гораздо более привлекательным. Ограничения в использовании графики с позиций эстетики связано с опасностью загромождения документа изображениями, в том числе и фоновыми, и навязчивой анимацией, зачастую не связанной непосредственно с тематикой издания.
С технической точки зрения изображения требуют значительно большего объема информации, чем простой текст, поэтому может возникнуть информационная перегрузка, особенно при использовании сетевых технологий с каналами недостаточной пропускной способности. Известно, что многие пользователи сети Интернет отключают загрузку графических файлов, чтобы быстрее загрузить документ и ознакомиться с ним. Несколько улучшило положение применение компактных форматов графических файлов, таких как JPEG (с частичной потерей информации), GIF и PNG. В качестве иллюстрации сказанного можно привести данные по размеру файлов различного формата, в каждом из которых хранятся одни и те же графические данные, представленные на рис.2.7, а именно TIFF – 46 Кбайт, JPEG – 31 Кбайт, PNG – 8 Кбайт и GIF – около 5 Кбайт.