Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
2 курс ИТУ Учебные материалы / Informatsionnie-tehnologii-upravleniya-uchebnoe-posobie.pdf
Скачиваний:
104
Добавлен:
07.06.2015
Размер:
18.76 Mб
Скачать

10.2. гипертекстовые технологии

Гипертекстовая технология — эта технология на базе средств обработки больших, хорошо структурированных, глубоко вложен- ных, связанных семантически и понятийно текстов и графической информации, которые организованы в виде фрагментов (текста). Они предоставляют возможность при машинной реализации быстро вы- зывать и поместить в нужное место фрагменты гипертекста, т. е. тексты, «привязанные» к выделенным по цвету ключевым словам или словосочетаниям.

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

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

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

язык гипертекстовой разметки документов HTML (HyperText Markup Language);

универсальный способ адресации ресурсов в сети URL (Universal Resource Locator);

протокол обмена гипертекстовой информацией HTTP (HyperText Transfer Protocol).

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

171

SaveStud.Su

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

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

Одним из важнейших в идее гипертекстовых документов явля- ется понятие универсального указателя ресурса — URL (Universal Resource Locator). Без наличия этой спецификации вся мощь HTML оказалась бы бесполезной. URL используется в гипертекстовых ссыл- ках и обеспечивает доступ к распределенным ресурсам сети. В URL можно адресовать как другие гипертекстовые документы формата HTML, так и ресурсы других служб (например, e-mail, ftp).

Вторым в списке стоит протокол обмена данными в Интернет

HTTP — HyperText Transfer Protocol. Данный протокол предназна-

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

WWW построена по хорошо известной схеме «клиент–сервер». Программа–клиент выполняет функции интерфейса пользователя и обеспечивает доступ практически ко всем информационным ре- сурсам Internet. Программы, выступающие в роли клиента называ-

ют обозревателями (например, Microsoft Internet Explorer, Mozilla Firefox).

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

172

SaveStud.Su

разов. При анализе URL-спецификации или по командам сервера клиент запускает дополнительные внешние программы для работы с документами в форматах, отличных от HTML, например GIF, JPEG и т. п.

Другую часть программного комплекса WWW составляет сер- вер протокола HTTP, базы данных документов в формате HTML, управляемые сервером, и программное обеспечение, разработанное в стандарте спецификации CGI. База данных HTML-документов — это часть файловой системы, которая содержит текстовые файлы в формате HTML и связанные с ними графику и другие ресурсы.

Гипертекстовая технология определяет концепцию предоставле- ния информационных услуг потребителям — концепцию публика- ции информации. Она отличается следующими особенностями:

публикация может объединять информационные источники различной природы (текст, графика, и пр.);

изменения в информационных источниках мгновенно отра- жаются в публикациях;

в публикациях могут содержаться ссылки на другие публи- кации (гипертекстовые ссылки);

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

Применение Web-технологии как средства публикации инфор- мации (в отличие от бумажных) имеет следующие отличительные черты:

«издатель» не заботится о процессе доставки информации к потребителю и «тираже» публикации;

неограниченное количество потенциальных потребителей информации;

публикации отражают актуальную информацию, время запаз - дывания не зависит от времени доставки материала потребителю;

информация легко усваивается в связи с широким спектром изобразительных возможностей.

Качества гипертекстовых технологий оказываются исключитель- но важными для применения в корпоративных сетях: они предостав- ляют возможность интеграции данных различных типов в сочетании

смеханизмами связывания информации, расположенной в разных узлах компьютерной сети.

173

SaveStud.Su

10.3. Основы языка гипертекстовой разметки HTML

Текстовыйформатявляетсяосновнымдля представленияинформа

-

ции на Web-страницах.То, что отображаетсяна Web-странице,записы

-

вается (кодируются) в специальном формате — на языке HTML — язы- ке гипертекстовой разметки. Формат HTML стал очень популярным,

впервую очередь потому, что он предоставляет возможности:

организации системы гипертекстовых ссылок для перехода от одного электронного документа к другому;

публикацииструктурированныхэлектронныхдокументовс за - головками, текстом, таблицами, списками и т. д.;

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

Основными инструментами создания Web-страниц являются:

текстовый редактор (например, Блокнот), если осуществляет- ся непосредственное HTML-кодирование;

специализированный редактор, позволяющий создавать Webстраницы в визуальном режиме (например, Microsoft FrontPage).

Мы будем рассматривать непосредственное HTML-кодирование, поэтому предложенные примеры необходимо набирать в текстовом редакторе Блокнот.

Определим термины. HTML-документ, Web-страница — тексто- вые документы в кодировке HTML. Web-сайт — набор связанных (тематически и гиперссылками) страниц. HTML-документы — фай- лы с расширением htm или html.

HTML-файл содержит отображаемый на Web-странице текст и управляющие конструкции — теги, с помощью которых осуществля - ется описание выводимых на экран элементов. Большинство тегов — парные. Общий вид инструкций в HTML документе имеет вид:

<Тег>

элемент

</Тег>

 

 

 

открывающий тег

 

закрывающий тег

 

 

 

Конструкцию, которая включает управляющие теги и элемент называют контейнером.

Открывающий тег имеет вид:

<Имя параметр1=''значение1'' ...>

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

174

SaveStud.Su

Мы рассмотрим только небольшое число тегов. Структура HTML документа обычно имеет вид:

Теги и элементы

<HTML>

<HEAD>

<TITLE> Пример 1 </TITLE>

</HEAD> <BODY>

Пример Web-страницы

</BODY> </HTML>

Комментарии Начало HTML документа

Начало описания документа — заголовка.

В нем сообщается обозревателю и поисковым машинам служебная информация Тег определяет текст, который должен отобра-

жаться обозревателем в заголовке окна обо- зревателя.

Конец заголовка Начало тела документа

Конец тела документа Конец HTML документа

Если в редакторе Блокнот набрать текст, расположенный в пер- вом столбце, сохранить его под именем «Пример.htm» и открыть обозревателем, то увидим окно, представленное на рис. 10.1.

Рис. 10.1. Первый пример

Рассмотрим более внимательно тег <BODY>, который определя- ет тело документа — содержание страницы. Тег может иметь пара- метры, которые определяют:

BGCOLOR='' ''

цвет фона страницы;

TEXT='' ''

цвет текста;

LINK='' ''

цвет не просмотренной ссылки;

VLINK='' ''

цвет активной ссылки;

ALINK='' ''>

цвет просмотренной ссылки;

BACKGROUND='' '' URL адрес фонового рисунка.

175

SaveStud.Su

Цвет задается его именем (например, red) или в формате RGB шестью шестнадцатеричными цифрами в виде:

#rrggbb, где rr, gg и bb шестнадцатеричные числа (от 00 до FF): rr — насыщенность красным цветом, gg — насыщенность зеле-

ным цветом, bb — насыщенность синим цветом.

Если нашем примере, вместо тега <BODY> написать

<BODY BGCOLOR=''#00FFFF'' TEXT=''#FF0000»>,

то цвет фона страницы будет бирюзовым (смешанный синий и зеле- ный), а цвет текста — красный.

Теги форматирования

Теги форматирования предназначены для символов и абзацев.

Заголовок:

<Hn> </Hn>

Тег определяет заголовок уровня n, n может принимать значение от 1 до 6. В теге может быть задан параметр выравнивания абзаца (влево, по центру, вправо) в виде:

ALIGN= ''LEFT'' | ''CENTER'' |''RIGHT''

Полужирный шрифт:

<B> </B>

Курсив:

<I> </I>

Например, если тело документа будет иметь следующий вид:

<BODY>

<H1 ALIGN=''CENTER''>Пример Web-страницы</H1> <H2>Пример Web-страницы</H2>

Пример <B>Web-<I>страницы</I></>

Пример Web-страницы

</BODY>

то получим страницу, представленную на рис. 10.2.

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

Рассмотрим еще один тег — определение шрифта:

<FONT> </FONT>

Параметры:

FACE=''***''

*** — название шрифта (например: Arial);

SIZE=n

n — размер, n= 1, 2, ...7;

COLOR=''цвет'' определяет цвет символов (имя или в формате RGB).

176

SaveStud.Su

Рис. 10.2. Пример форматирования текста

Теги разделители

Абзац:

<P> </P>

Определяет абзац. Закрывать тег не обязательно. Может быть указан параметр выравнивания абзаца:

ALIGN= ''LEFT'' или ''CENTER'' или ''RIGHT''

Новая строка

<BR>

Новая строка, (абзац продолжается). Закрывающего тега нет.

Вставка изображения

Вставка изображения осуществляется тегом

<IMG SRC=''URL'' WIDTH=? HEIGHT=? ALT=''***''>

Параметры определяют:

SRC=''URL''

URL-адрес файла изображения. В случае, если изображе-

 

ние хранится в той же папке, что и сама страница — это

 

имя файла.

WIDTH=? HEIGHT=?

Размер изображения в пикселах.

 

 

ALT=''текст''

Определяет текст, который выводится, если установлен ре-

 

жим, при котором рисунки не отображаются. Этот текст

 

появляется также при наведении на изображение курсора.

Все параметры, кроме параметра SRC являются необязательными. Например, если тело документа имеет следующий вид (предпо- лагается, что изображение хранится в той же папке, что и документ,

файл — «Comp.jpg»):

177

SaveStud.Su

<BODY>

<H1 ALIGN=''CENTER''>Пример Web-страницы</H1> <P ALIGN=''CENTER''>

<IMG SRC=''Comp.jpg'' ALT=''Компьютер''> </BODY>

то получим Web-страницу, представленную на рис. 10.3.

Рис. 10.3. Пример вставки изображения

Вставка гиперссылки

Гиперссылка в документе создается с помощью тега:

<A HREF=''URL''> Указатель</A>

Обязательный параметр HREF задает URL — адрес ресурса, ко- торый должен быть загружен по данной гиперссылке (например, имя файла Web-страницы). Указатель — это текст или изображение, щелчок по которому вызовет загрузку данного ресурса.

Гиперссылка может быть задана в виде:

HREF=''URL-адрес»/

на другой ресурс (файл);

HREF=''#имя_закладки»

на закладку в данном документе;

HREF=«URL-адрес#имя_закладки»/

на закладку в другом документе.

Закладка в документе определяется тегом

<A NAME=«имя_закладки»></A>.

178

SaveStud.Su