Файл: «Языки гипертекстовой разметки» (Языки гипертекстовой разметки).pdf

Этот метод также подходит для структурирования страниц, при условии, что линии таблиц скрыты [5, 419] [10].

Рисунок 5. Пример описания табличных данных

С помощью разнообразных атрибутов для тега <table>, можно управлять параметрами таблиц.

Так, для определения ширины таблицы используется атрибут «width», единицей измерения ширины в таком случае может стать количество пикселей, или пропорция от ширины окна браузера в процентах. Выглядит это следующим образом: <table width=”200”> [6, c.47] [4, c.27].

Высоту таблицы обозначают с помощью атрибута «height». Единицы измерения для «height» аналогичны атрибуту «width». Пример: <table height=”400”> [4, c.27].

Атрибут «border» регулирует толщину рамки. В том случае, если значение атрибута равно нулю, то таблица строится со скрытой координатной сеткой. Пример: <table border=”0”> [6, c.43-44].

Саму же рамку вокруг таблицы определяет атрибут «frame» ( он актуален, начиная с версии HTML 4.0).

Существует ряд значений, которые используются для данного атрибута. Их состав следующий:

- Void – рамка отсутствует;

- Above – линия рамки располагается сверху таблицы;

- Below – линия рамки располагается снизу таблицы;

- Hsides – линия рамки располагается сверху и снизу таблицы;

- LHS – линия границы слева;

- RHS – линия границы справа;

- Vsides – линия границы слева и справа;

- Box – линия полностью окружает таблицу.

Пример использования атрибута «frame»: <table frame=”Void”> [6, c.45] [5, c.420-421].

Параметры оформления ячеек определяет атрибут «rules». Он обладает следующими значениями:

- none – видимые границы отсутствуют;

- all – линии отображаются вокруг каждой отдельной ячейки;

- groups – линии отображаются между группами ячеек;

- cols – границы отображаются между столбцами;

- rows – границы отображаются между строками.

Использование атрибута «rules» может выглядеть так: <table rules=”None”> [6, c.45] [5, c.420-421].

И, наконец, атрибут «cellpadding». Он определяет расстояние между содержимым и границами ячейки. Пример: <table cellpadding =”6”> [6, c.69].

Расширяемый язык разметки XML

XML (eXtensible Markup Language) – расширяемый язык разметки, который применяется для хранения, передачи и обмена данными между системами. Документ, размеченный при помощи XML, называется XML-документом (рисунок 6). XML-язык, в сущности является подмножеством, или иначе, производной языка SGML. Целью разработки его разработки XML было упрощение машинного анализа документов [10].

---

Данный язык представляет собой последовательный набор символов, которые интегрируются в текст, и передают в итоге информацию о его строении и выводе. Текстовый документ, построенный по принципам языка XML, содержит и информационное наполнение, и дополнительные данные о своей структуре. Подобные документы могут включать интерактивные элементы, и иные документы [7, c.6].

Выделяют три разновидности разметки:

• стилистическая;
• семантическая;
• структурная.

Стилистическая разметка создает внешний вид документа, структурная – структуру, семантическая разметка отвечает за содержание данных, а также описывает логику их представления [7, c.6].

Рисунок 6. Пример синтаксиса XML

Язык XML основан на элементах. Это составные части структуры, обработка которых происходит при помощи таблиц стилей. Основой элемента являются теги разметки. Они описывают, начало и конец элемента. Также элементы могут встраиваться друг в друга, в данном случае, расположенный на верхнем уровне элемент, называется корневым (рисунок 7) [7, c.9] [10].

Рисунок 7. Пример вложенных элементов XML

XML-документ состоит из разделов приведенных ниже:

- XML-декларация;

- Пролог;

- Элементы;

- Атрибуты;

- Комментарии [7, c.10].

Объявление (декларация) документа XML, расположено в первой строке. Оно не является обязательным условием для создания документа. Предусмотрены следующие элементы XML-декларации:

• Номер версии – обязательный аргумент. После декларации номера версии следует декларация кодировки, содержащая значение кодировки символов. Декларация кодировки же не является обязательным аргументом. После располагается декларация автономности. Но она также не является обязательной.

Строчка ниже является примером декларации XML-документа:

«<?xml version="1.0" encoding="UTF-8" standalone="yes"?>» [7, c.10].

Пролог XML-документа – это набор данных, расположенных после корневого тега или элемента документа. В нем содержатся данные о параметрах документа: кодировка символов, таблицы стилей, структура XML-документа, возможность или невозможность включения в документ инструкций по его обработке для сторонних приложений и т.д. Данные инструкции создают, используя следующую конструкцию: «<? Приложение Содержимое ?>». В первой ее части определена система или приложение, вторая же часть описывает содержимое инструкции [7, c.11] [10].

---

Элементы XML-документа оформлены тегами, устанавливающими границы содержимого (при его наличии). Имена, содержащиеся в элементах, присваиваются по определенным правилам. В частности они должны содержать буквенно-цифровые и прочие символы. При этом имена не должны:

- начинаться со знака препинания или цифры;

- начинаться с ключевого слова «xml»;

- содержать пробелов;

- содержать пробелы у кавычек;

Также важно, что все имена элементов зависят от регистра, а наличие закрывающего тега обязательно.

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

В качестве примера для оформления элемента можно использовать строчку <ElementName> Некоторое содержимое элемента </ElementName > [7, с.12].

Дополнительные параметры элементов предоставляются при помощи атрибутов XML-документа. Они оформляются через пару «имя-значение»: < myElement attribute="value" ></myElement>.

Для атрибутов в XML используются следующие правила синтаксиса:

- атрибут должен декларироваться в открывающем теге;

- количество атрибутов может быть неограниченным;

- атрибуты разделяются при помощи пробелов;

- в состав атрибута должны входить имя и значение;

- имя должно быть уникальным в рамках одного элемента;

- пробелы в имени запрещены;

- значение атрибута должно быть закавычено [7, c.13].

Комментарии XML-документа позволяют добавлять содержимое, не предназначенное для синтаксического анализа.

Существует возможность расположить комментарии:

• в прологе;
• тексте (содержимом документа);
• после документа.

Нельзя допускать комментарии:

• внутри тегов;
• внутри значений атрибутов.

Также не допускается использование двух символов « - » подряд в тексте комментария и использование символа в конце комментария. [7, c.14].

Примером оформления элемента приведен далее: <!—какой-либо текст комментария -->.

Расширяемый язык гипертекстовой разметки XHTML

XHTML (eXtensible Hypertext Markup language) – расширяемый язык разметки гипертекста. Он как и XML, является подмножеством метаязыка SGML (рисунок 8) [3, c.15] [10].

Рисунок 8. Эволюция языков разметки

XHTML действительно довольно сильно похож на HTML, но при этом находится в зависимости от синтаксических правил XML. Этот язык используют для отображения корректно оформленных данных в браузере [3, c.17].

---

Структуру XHTML-документа составляет корневой HTML-документ с объявлением doctype (тип описываемого документа). Он в свою очередь разделяется на головную (head) и основную (body) части. Первая из названных частей содержит информацию, для поисковых систем и браузера. Такая информация, обычно, не отображается на дисплее. Основная же часть содержит контент web-ресурса. Он как раз предназначен для вывода на дисплей (рисунок 9) [3, c.18].

Рисунок 9. Структура XHTML-документа

Головную и основную части разделяют при помощи соответствующих тегов. Так, тег Title обязателен и указывается в головной части документа. Заголовки, обозначенные тегом Title отображаются в закладках браузера, а также выдаются поисковыми системами в результатах поиска [3, c.17].

Также головная часть документа может содержать необязательный тег meta. Он служит для описания кодировки web-страницы. В документах типа Frameset (содержащих фреймы) основную часть вполне можно опустить, поскольку ее полностью заменит фреймовая структура. Иллюстрация ниже как раз представляет собой пример минимального документа XHTML (рисунок 10) [3, c.19].

Рисунок 10. Пример описания минимального XHTML-документа и его отображения в браузере Google Chrome

Чтоб отформатировать текст и разделить его на блоки необходимо использовать теги форматирования. Они подразделяются на два уровня: уровень блока и текста [3, c.19].

Теги уровня блока:

• <p> - форматирует абзац, отделенный от основного текста при помощи пустых строк;
• <div> - служит для описания абзаца, но, в отличие от <p>, не имеет дополнительного форматирования. Его также используют для группировки блоков [10].
• теги шести уровней заголовков от <h1> до <h6> визуально отображаются шрифтом определенного размера, в зависимости от уровня (h1 – самый крупный, а h6 – самый мелкий) [10];
• <blockquote> отвечает за форматирование блока с дополнительным отступом и выделяется аналогично тегу <p>;
• <pre> используют для переформатированного текста, который разбивают на табуляции, строки и пробелы;
• <br> служит для окончания текущей строки;
• <hr> вставляет горизонтальной линии [3, c.19].

ЗАКЛЮЧЕНИЕ

Существование Интернета в том виде, каким мы знаем его теперь, стало возможно благодаря внедрению технологии гипертекста в области IT. И на сегодняшний день существует множество инструментов для создания полнофункциональных web-приложений. При этом web-технологии постоянно развиваются и совершенствуются, а глобальная сеть не перестает расти и усложняться. В данный момент, для web-разработчика, использование гипертекстовой технологии облегчено тем, что существует множество программных решений автоматической верстки web-страниц. Это возможно, даже несмотря на простоту web-дизайна и низкого порога вхождения в данную отрасль IT.

---

Исследуемая нами технология имеет ряд преимуществ. Так, например, время усвоения информации значительно сокращается, когда данные представлены в электронном виде, структура документа определена гиперссылками, а текст содержит необходимые комментарии, которые при этом не нарушают его структуру. Более того, гипертекст не ограничен исключительно текстовой информацией. Он может получить расширение за счет применения графики и мультимедиа.

Главной же сложностью в Интернете, на данный момент остается вопрос безопасности и обеспечения ее для web-приложений. Облачные технологии для хранения персональных данных, растущие объемы информации на персональных компьютерах, подключенных к глобальной сети - все это небезопасно с точки зрения защиты данных. Параллельно с развитием систем защиты и других разработок в данной области, свои инструменты совершенствуют и злоумышленники. Более того, рядовые пользователи могут столкнуться с определенными проблемами восприятия многомерных документов, требующих специальных навыков и дополнительной умственной нагрузки. И это отличает цифровые, нелинейные документы, от бумажных аналогов.

СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ

1. ГОСТ Р 52872-2012 Интернет ресурсы. Требования доступности для инвалидов по зрению. Дата введения 01.01.2014. // Опубликован: М.: Стандартинформ, 2014 год. Официальное издание.
2. ГОСТ Р ИСО 9241-151-2014 Эргономика взаимодействия человек – система. Дата введения 01.12.2015. // Опубликован: М.: Стандартинформ, 2015 год. Официальное издание.
3. Васильева И.Н. Web-технологии: учебное пособие / И.Н. Васильева, Д.Ю. Федоров. – СПб.: Изд-во СПбГЭУ, 2014. – 67с.
4. Зудилова Т.В. Web-программирование HTML / Т.В. Зудилова, М.Л. Буркова. – СПб: НИУ ИТМО, 2012. – 70 с.
5. Льюис, Д. Самоучитель Java 7: Пер. с. нем. / Д. Льюис, П. Мюллер. – СПБ.: БХВ-Петербург, 2016. – 464 с.
6. Наместников С.М. Основы языка гипертекстовой разметки HTML и CSS: Учебное пособие / С. М. Наместников. – Ульяновск: УлГТУ, 2014. – с.
7. Одиночкина, С.В. Основы технологий XML: учебное пособие / С.В Одиночкина, СПб: НИУ ИТМО, 2013. – 56 с.
8. Синица С.Г. Веб-программирование и веб-сервисы: учебное пособие / С.Г. Синица. Краснодар: Кубанский гос. ун-т, 2013. 158с.
9. Официальный сайт «ФБГОУ ВПО "Новосибирский государственный технический университет» // Онлайн-учебник [Электронный ресурс]. URL: http://optic.cs.nstu.ru/files/CC/C/Lit/Informatica/info/annotation.html (Дата обращения: 24.12.2018г.)
10. Официальный сайт «Консорциума Всемирной Паутины» // A vocabulary and associated APIs for HTML and XHTML [Электронный ресурс]. URL: https://www.w3.org/TR/html50 (Дата обращения: 24.12.2018г.)

---