 |
Розділ 8. Програмування Web-сторінок у мовному середовищі HTML
|
|
|
|
Розділ 8. Програмування Web-сторінок у мовному середовищі HTML
Мова HTML у даний час є базовою при підготовці Web-публікацій. В міру вдоскона-лення Web-сторінок, використання нових комп'ютерних технологій вдосконалюється і мова HTML. На момент написання цього матеріалу випущена версія 4. 0 мови HTML.
Мова HTML використовується як безпосередньо при підготовці електронних видань, так і як база для програмних засобів автоматизованого створення Web-сторінок і Web-серверів.
У даному розділі розглянуті основні принципи створення Web-сторінок мовними засобами HTML.
Цей підхід сьогодні широко застосовується фахівцями в області комп'ютерних технологій, що знають алгоритмічні мови та програмування, наприклад, на обєктно-орієнтованих мовах. Вони вважають, що застосування елементів HTML і представлення Web-сторінки у виді HTML-документа дають змогу більш ефективно використовувати можливості цієї мови і вирішити дуже актуальну проблему програмно-інформаційної сумісності розробленого HTML-документа із сучасними браузерами, що працюють на різних апаратних платформах і в різноманітних операційних системах.
В основі мови лежать елементи (теги) - керуючі коди. Всі елементи HTML починаються з < (символ лівої кутової дужки) і закінчуються символом > (символ правої кутової дужки). Наприклад:
< TITLE> Заголовок документа < /TITLE>
Завершальний елемент виглядає так само, як стартовий, і відрізняється від нього прямим слешем перед текстом усередині кутових дужок. У даному прикладі елемент < TITLE> повідомляє Web-браузеру про використання формату заголовка, а елемент < /TITLE> - про завершення тексту заголовка.
HTML не реагує на регістр символів, що описують керуючі елементи HTML.
|
|
|
8. 1. Структура і форматування HTML-документа
Документ у форматі HTML 4. 0 складається з трьох частин: рядка, що містить інформацію про версію HTML; розділи заголовків (визначених елементом HEAD); тіла, що включають саме вміст документу (BODY).
Нижче наведений приклад обов'язкової структури HTML-документа:
<! DOCTYPE HTML PUBLIC " -//W3C//DTD HTML 3. 2//EN" >
< HTML>
< HEAD>
< TITLE> Заголовок вікна браузера< /TITLE>
Інші заголовки
< /HEAD>
< BODY>
Текстовий матеріал документа
< /BODY>
< /HTML>
У першому рядку прикладу представлений тип документа і версія мови, на якій підготовлений даний документ. ! DOCTYPE - оголошення, що служить визначенням типу документа (document type definition - DTD) у метамові SGML і який при обробці документа зрозумілий типовому браузеру SGML. Задання версії HTML, використане в документі, може бути необхідно браузерам і редакторам WWW.
Весь файл, за винятком першого рядка, являє собою HTML-елемент, що містить заголовок документа (HEAD-елемент), що включає TITLE-елемент, і так зване тіло документа (BODY-елемент), із простим текстом, як вміст.
Ім'я HTML-документа в елементі < TITLE> функціонально використовується браузерами й іншими програмами. Текстовий матеріал, обмежений елементами TITLE, буде візуалізовуватися в назві вікна браузера і служити засобом пошуку.
Формально елемент TITLE є (принаймні, якщо слідувати цьому буквально) частиною елемента < HEAD>, тоді як оголошення! DOCTYPE передує всім конструкціям HTML.
Елемент < HEAD> крім елемента TITLE може містити метадані (<! ELEMENT META> ), що включають інформацію про документ. Набір властивостей метаданих специфікацією HTML не визначений. Початковий тег обов'язковий, кінцевий тег заборонений.
Як використовуються атрибути: name (ім'я властивості), content (значення властивості), scheme (ім'я схеми, використовується для інтерпретації властивості) і ін. Значення властивостей і набір їхніх припустимих значень повинні визначатися у відносному словнику, названому профілем.
|
|
|
Необхідно відзначити, що при відсутності в документі тегів HTML, HEAD чи TITLE браузер самостійно вставить їх у потрібні місця. Тому HTML-документ завжди буде містити заголовок і тіло документа.
Структура документа, що рекомендується. На додаток до обов'язкової структури HTML-документа в нього рекомендується вставляти різні елементи.
Так, кожен HTML-документ повинен містити основну інформацію про його походження. Приватні рекомендації можуть уточнити в деталях форму представлення цієї інформації.
Якщо автор документа прагне до того, щоб люди відшукали його документ по відповідним зв'язках, важливість надання інформації про його походження стає очевидною. Коли користувач знайде документ за допомогою пошукового ресурсу, він, імовірніше всього, захоче довідатися, до якого виду відноситься документ. Тому кожен файл HTML повинен надавати саму основну інформацію (чи зв'язок з інформацією) про його походження і природу. Наприклад, у збірках електронних версій друкованих видань, розділених на файли малих обсягів (розділи, параграфи), кожен файл повинен містити, принаймі, зв'язок з «першою сторінкою» книги (Home page).
Про походження документа може бути представлена наступна інформація: автор документа, що має унікальне ім'я. При цьому повинен бути заданий зв'язок з домашньою сторінкою автора. Якщо в документі кілька авторів, то визначаються всі, а також роль кожного з них; наприклад, що веде автора, редактор, дії спонсора, а також осіб, що формально відповідають за документ.
Дата створення документа чи його останньої модифікації (чи і та й інша інформація). Дата, що представляється, повинна бути зрозуміла в усьому світі; зокрема, назву місяця звичайно пишуть у виді слова, а не цифрами.
Контекст документа і його статус, наприклад: частина офіційної документації компанії про один з її продуктів.
URL-адреса документа. Ця інформація може бути корисною, коли потрібна копія документа, що був знайдений раніше.
Організація змісту: заголовки (headings) і абзаци (paragraphs). Як правило, HTML-документ складається з окремих частин, що, у свою чергу, теж поділяються на частини і т. д. У мові HTML такий поділ робиться з використанням заголовків різного рівня. Частини самого нижнього рівня в цій ієрархії складаються з одного чи декількох абзаців. Внутрішня структура абзаців і подібних їм елементів визначаються елементами текстового рівня, що будуть приведені далі.
|
|
|
Елементи для вираження головних структурних особливостей, так звані елементи блокового рівня, являють собою наступне:
заголовки різних рівнів: < H1>, < H2>, < H3>, < H4>, < H5>, < H6>
елементи рівня абзацу:
простий абзац: < P>
цитування, що представляється як окремий абзац: < BLOCKQUOTE>
адреса автора інформації - окремий абзац: < ADDRESS>
елемент, що зберігає компонування рядків і пробілів попередньо відформатованого тексту, < PRE>
Структурування тексту. Щоб зробити текст HTML більш привабливим, потрібно його структурувати. Користувачі World Wide Web прагнуть мати можливість швидко визначити, чи є в документі потрібна інформація. Щоб полегшити перегляд, автор може розбити HTML-документ на логічні розділи, кожний з який присвячений визначеній темі.
Розбивши документ, можна включити в нього інформативні заголовки до кожного розділу. Це дасть змогу читачу швидко перейти до необхідного матеріалу.
Додавання заголовків. Заголовки в HTML структурують текст, що складає тіло документа. Імовірно, із усіх дескрипторів форматування в документах HTML найчастіше використовуються елементи заголовків.
Елемент заголовка є контейнером і повинен мати відкриваючий (< Н1> ) і закриваючий (< /Н1> ) елементи. У HTML шістьох рівнів заголовків: H1 (верхній рівень), Н2, HЗ, H4, Н5 і Н6 (нижній рівень). Кожний з цих рівнів виглядає певним чином у браузері читача.
Приклад:
< HTML>
< HEAD>
< TITLE> " Робота із структурованим текстом": Приклад < /TITLE>
|
|
|
< /HEAD>
< BODY>
< H1> Заголовок першого рівня< /H1>
< H2> Заголовок другого рівня< /H2>
< H3> Заголовок третього рівня< /H3>
< H4> Заголовок четвертого рівня< /H4>
< H5> Заголовок п'ятого рівня< /H5>
< H6> Заголовок шостого рівня< /H6>
< /BODY>
< /HTML>
На мал. 8. 1 показана візуалізація приведеного прикладу у вікні браузера.
Хоча зовсім не обов'язково використовувати всі рівні заголовків, краще не пропускати деякі з них, оскільки це може викликати проблеми в автоматичних конверторів тексту. Зокрема, розроблювальні зараз алфавітні Web-покажчики зможуть виконувати пошук у Web-документах і структурувати їх. Якщо деякі рівні заголовків пропущені, то орієнтуватися в такій структурі більш складно.
Заголовки є дескрипторами контейнерного типу і вимагають обов'язкового використання відкриваючого і закриваючого дескрипторів. До і після заголовка передбачається обов'язковий розрив абзацу. Заголовок не можна розмістити в середині абзацу для зміни розміру чи шрифту його гарнітури.
При використанні заголовків їх доцільно вважати елементами структури HTML-документа. Рекомендується використовувати новий рівень заголовка в тому випадку, коли існує від двох до чотирьох елементів однакового рівня. Якщо їхня кількість перевищує чотири елементи, рекомендується розбити цей матеріал на два батьківських заголовки.
Попереднє форматування тексту. У HTML є контейнер, у який можна помістити попередньо відформатований текст. Це дає автору набагато більше можливостей керувати відображенням документа. Недолік цього способу полягає у втраті гнучкості.
З усіх дескрипторів попереднього форматування найбільше часто використовується контейнерний елемент < PRE>. Текст у контейнері < PRE> звичайно має довільну форму і використовує порожні рядки, що служать для розриву тексту. Усередині цього контейнера можна застосовувати дескриптори розриву рядків і абзаців. Це дає змогу створювати такі компоненти, як таблиці і стовпчики тексту. Крім того, елемент < PRE> часто використовується для відображення великих блоків програмних кодів, що було б складно прочитати, якби браузер переформовував їх.
Усередині контейнера < PRE> використовуються різні елементи фізичного і логічного форматування тексту. Наприклад, можна створити таблиці з різним шрифтовим і стильовим оформленням. У контейнер < PRE> можна поміщати й елементи прив'язки.
Однак використання в цьому контейнері елементів форматування абзацу (< Address> ) чи елементів заголовка не допускається. Основною особливістю контейнера < PRE> є те, що текст, що знаходиться усередині нього, завжди відображається в браузері читача рівноширо-ким шрифтом. Це приводить до того, що довгі фрагменти тексту візуально зливаються.
|
|
|
Якщо ви хочете представити код HTML у виді попередньо відформатованого тексту або використовувати символи < чи >, рекомендується застосовувати їхній замінники escape -послідовності lt і gt, наприклад, ltPREgt.
Розбивка тексту на абзаци. Щоб розбити текст на абзаци, використовуються елементи абзацу. Якщо помістити відкриваючий елемент абзацу < Р> у початок кожного нового абзацу, то програма перегляду коректно розділить текст на абзаци. Додавання закриваючого елементи < /Р> не обов'язково, оскільки його функцію звичайно виконує наступний початковий елемент абзацу. Однак додавання елемента < /Р> наприкінці абзацу допоможе обробити документ у тих програмах перегляду, що не цілком відповідають стандарту HTML.
Останнім часом для представлення абзаців тексту все частіше використовують стилі, тому коректне вживання елемента абзацу набуває все більшого значення.
У деяких документах HTML елемент початку абзацу < P> використовується повторно для створення додаткового порожнього рядка. Цей підхід не підтримується стандартом HTML, і сучасні браузери ігнорують усі порожні елементи < P>, що випливають за першим.
Організація змісту для структурованого тексту. Поряд з використанням посилань на інші HTML-файли встановлюються й елементи прив'язки для посилань на розділи усередині біжучого документа. Наприклад, у верхній частині Web-сторінки можна помістити зміст, а потім зв'язати його пункти з наступними розділами Web-сторінки. Таким чином, ми отримуємо зміст, при натисканні на кожному з пунктів якого буде здійснюватися автоматичний перехід на зазначений розділ.
Здійснюється це в два етапи. Спочатку в HTML-файлі створюється елемент прив'язки, що вказує, куди переходити по посиланню. Для цього використовуються стандартні елементи < A> з параметром < HREF>. Далі, за допомогою елемента < A> з параметром < NAME> у тексті документа вказується місце, на яке дається посилання.
|
|
|
