Файл: Языки гипертекстовой разметки (Веб-страница как гипертекстовый инструмент).pdf

На сегодняшний день Интернет и одна из его служб, Всемирная Паутина, являются неотъемлемой частью нашей жизни. Всего лишь пятнадцать лет назад для того, чтобы, например, узнать телефон ближайшей закусочной с доставкой пиццы, большинство из нас стало бы звонить в справочную службу по телефону, либо смотреть в справочнике “желтые страницы”.

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

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

Понятие о гипертекстовой разметке и гипертекстовом документе должен иметь любой современный грамотный человек.

Цель написания курсовой работы — рассмотреть основные технологии создания веб-страниц, основанные на использовании языков гипертекстовой разметки.

Объектом исследования являются языки гипертекстовой разметки. Предметом исследования являются особенности применения различных технологий создания веб-страниц с использованием языков гипертекстовой разметки.

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

В курсовой работе решаются следующие задачи:

Определить основные понятия, связанные с языками гипертекстовой разметки
Описать синтаксис и область применения языка HTML
Описать область применения и синтаксис составляющих DHTML
Сравнить возможности применения различных технологий создания веб-страниц.

Глава 1. Понятие и назначения языков гипертекстовой разметки

1.1 Веб-страница как гипертекстовый инструмент

В начале определим основные понятия, используемые в работе.

Гипертекст представляет собой специальным образом размеченный текст, который может содержать гиперссылки.

HTTP – протокол передачи гипертекста. Именно по этому протоколу передаются веб-страницы, которые затем обрабатываются браузером (специальной программой для просмотра документов, передаваемых по протоколу HTTP и еще некоторым другим протоколам).

Интернет – всемирная компьютерная сеть, объединяющая пользователей, использующих различные технологии передачи данных, по всему миру. Часто можно услышать, как люди отождествляют понятия Интернет и WWW. На самом деле, это различные понятия. WWW является одной из служб Интернет, скажем, как электронная почта, телеконференции и др [1].

Появившись как система обмена научной информацией, система WWW сейчас, в основном, используется для других целей. Современный веб-сайт имеет, как правило, большой объем мультимедийного наполнения (видео, музыка) [2]. Сайты являются интерактивными и, зачастую, содержат различные веб-приложения, т.е. программы, сходные по способу взаимодействия с традиционными программами, требующими установки на персональный компьютер.

Отметим, что вся совокупность гипертекстовых документов образует семантическую сеть, то есть документы одной предметной области оказываются связанными друг с другом[4]. Иными словами, гипертекстовая система WWW является информационно-поисковой системой, а основным инструментом поиска информации являются гиперссылки.

Любой веб-сайт представляет собой совокупность связанных веб-страниц, объединенных одной тематикой и расположенных на одном сервере. Каждый веб-сайт должен иметь уникальное имя (оно называется доменным именем). Точнее, каждому веб-сайту может принадлежать одно или несколько доменных имен[1].

Доменное имя состоит из отдельных частей называемых доменами. Каждый домен относится к определенному уровню и указывает на географическую принадлежность сайта или на принадлежность к определенному тематическому направлению[2]. Такой способ присваивания сайту определенного адреса и система адресации в Интернете с помощью доменных имен получила название DNS, служба доменных имен, рисунок 1.

Рисунок 1 — Иерархическая структура службы доменных имен

Примером доменного имени может быть имя www.foxford.ru.

Любой ресурс в Интернете, то есть сайт или программа должны иметь уникальное имя[4]. Это имя называется URL, или единообразный указатель ресурса.

Например, рассмотрим URL:

http://www.ivanov-petrov.com/company/about.html

Данный URL указывает, что файл about.html находится в директории company на сайте с доменным именем www.ivanov-petrov.com. Первая часть URL указывает, что передача данных происходит по протоколу http.

Таким образом, структуру URL можно записать следующим образом:

протокол://доменное имя/путь к файлу на сервере/имя файла.расширение

С помощью URL задается не только адрес веб-страниц, как в указанном примере, но и адреса изображений, текстовых документов и вообще любых файлов, размещенных в сети Интернет (не только во Всемирной паутине)[1].

Уникальный адрес в сети Интернет, похож на полное имя файла на компьютере (оно тоже уникально). Под полным именем файла понимается путь к файлу начиная от логического диска, с учетом всех вложенных директорий до имени файла с расширением.

Основное отличие адреса веб-страниц от адреса других типов файлов заключается в том, что часто этот адрес определяется программой на сервере, созданной с помощью одного из серверных языков (часто такую программу называют сценарием). Веб-страницы часто формируются динамически, то есть в момент обращения к ним. Страницы собираются под управлением сценариев на сервере на основе шаблонов и данных из баз данных (БД). Таким образом, например, веб-страница товара в интернет-магазине формируется на основе ответа программы на запрос пользователя, шаблона товара и данных о конкретном товаре из БД[2].

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

Отметим, что обмен данными в сети Интернет осуществляется с указанием адресов компьютеров отправителя и получателя. Эти адреса называются ip-адреса. IP-адрес представляет собой 32-битный двоичный адрес. Для удобства записи IP-адрес обычно записывают в десятичном представлении, с помощью 4 десятичных чисел, разделенных точкой[4].

Каждое из таких чисел должно находиться в диапазоне от 0 до 255, например:

12.0.1.255

Назначение доменной системы имен состоит в замене неудобного для человека цифрового адреса на осмысленное буквенное обозначение.

1.2. Язык HTML

Язык гипертекстовой разметки HTML (HyperText Markup Language) был предложен группой ученых из Европейского Центра ядерных Исследований (CERN) под руководством Тима Бернерсом-Ли в 1989 году в качестве одного из компонентов технологии разработки распределенной гипертекстовой системы World Wide Web [3]. Система WWW (World Wide Web, всемирная паутина) разрабатывалась как система обмена научным иданными.

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

Язык HTML, как и XHTML представляет собой набор элементов. Для задания большинства элементов необходимо использовать открывающий и закрывающий теги, между которыми может находится содержимое[1].

1.3 Понятие XHTML

Язык гипертекстовой разметки XHTML (extensible hypertext markup language) является расширением возможностей языка HTML версии 4.0. В данный момент разработка стандарта приостановлена. Несмотря на то, что HTML является самым популярным языком гипертекстовой разметки в мире, ему присущи ряд недостатков, которые было решено ликвидировать с помощью XHTML и расширив его функциональность[2]. Например, добавлена поддержка языков MathML, SMIL, SVG . Последняя версия XHTML 2.0. Разработка данной версии прекратилась в 2010 году. Использование данной версии не рекомендовано консорциумом Всемирной Паутины (W3C) [3].

Предыдущие версии XHTML 1.0 и XHTML 1.1 имеют рекомендации W3C.

Основне отличие между HTML и XHTML состоит в правилах обработки документов[4].

Стандарт XML предполагает более строгие правила обработки документов. Браузеры HTML работают с любыми входными данными, коректными и некоректными, и пытаются их интерпретировать. Схема обработки ошибок очень усложняет разработку программ, особенно если учесть, что предполагается, что реакция всех браузеров на некоректные данные должна быть одинаковой [5]. Кроме того, это означает, что огромное число документов HTML содержат ошибки, но нормально отображаются браузерами, и авторы не подозревают о том, что код HTML некорректен. Вот почему необычайно сложно создать новый пользовательский агент, пока документы, выдаваемые за HTML, часто очень плохи.

Таким образом, документ, написанный на языке XHTML, в случае если он содержит ошибку, не будет показан. Встретив ошибку, браузеры должны выдавать сообщения об ошибке и не отображать его содержимое , по крайней мере такие рекомендации дает консорциум W3C[5].

В случае обработки HTML документа браузер должен отобразить содержимое даже в случае наличия ошибок в синтаксисе.

Основные различия синтаксиса языка XHTML в сравнении с HTML :

все элементы должны быть закрыты. Теги, отвечающие пустым элементам, должны иметь на конце знак «/» (например, элемент означающий конце строки, <br /> или разделительная черта <hr/>);
логические атрибуты всегда должны быть записаны в развёрнутой форме. Например, следует писать <option selected="selected"> или <td nowrap="nowrap">;
имена тегов и атрибутов должны быть записаны только строчными буквами, в то время как стандарт HTML допускает применения как строчных, так и заглавных букв[4].

1.4 Понятие DHTML

Под DHTML (Dynamic HTML, динамический HTML) понимается методика создания веб-страниц с помощью совокупности технологий статического языка веб-разметки (HTML или XHTML), модели документов DOM, каскадных таблиц стилей CSS, скриптовых языков программирования (например, JavaScript). [6]

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

DHTML позволяет сделать веб-страницы интерактивными[4] . Он построен на объектной модели документа (Document Object Model, DOM), которая расширяет традиционный статический HTML документ. DOM обеспечивает динамический доступ к содержимому документа, его структуре и стилям. В DOM каждый элемент Web страницы является объектом, который можно изменять. DOM не определяет новых тэгов и атрибутов, а просто обеспечивает возможность программного управления всеми тэгами, атрибутами и каскадными таблицами стилей (CSS).

Каскадные таблицы стилей позволяют задавать внешний вид элемента DOM с помощью селекторов, свойств объектов и значений свойств[2].

Каждой гиперссылке, заголовку или текстовому параграфу можно присвоить имя, атрибуты стиля или цвета текста и указать это имя в сценарии, имеющемся на данной странице. Сценарий может быть написан на любом существующем скриптовом языке, чаще всего используется JavaScript. Элементы страницы впоследствии могут изменяться в результате определенного события, например при наведении курсора мыши, при щелчке, нажатии клавиши на клавиатуре либо после истечения заданного промежутка времени. Изменяться может не только стиль и цвет текста, но и весь объект, текст или рисунок.

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