Управление и оптимизация / Osnovi informatsionnikh i komputernikh tekhnologiy 2011

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

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

Web-сайты. Основы создания HTML документов

Интернет - глобальная компьютерная сеть, которая базируется на общей системе адресов и протоколов делающей возможным обмен информацией. Она появилась в конце 60-х годов, как сеть, связывающая научно-исследовательские центры США. В дальнейшем ее развитию способствовало министерство обороны США, именно тогда был разработан протокол TCP/IP, который положен в основу построения данной сети. Сам термин «Internet» стал употребляться с 1983 года для обозначения концепции взаимнокоммутируемых сетей.

Интернет достаточно быстро стал доступным рядовым пользователям, особенно, с 1993 года, когда появилась система WWW (англ. World Wide Web, всемирная паутина), основанная на технологии гипертекстовых документов. WWW это система представления и обмена информацией. Данная технология дала возможность графического представления информации в сети. Для обмена HTML документами используется протокол http (hypertext transfer protocol).

Важно отметить, что Internet и www это не одно и тоже. World Wide Web – это часть глобальной сети Internet, написанная на языке гипертекстовой разметки.

61

В основе Интернет лежит специальная система клиент-сервер. Информация в сети расположена на специальных компьютерах – серверах, соединенных между собой различными линиями связи. Для обращения к ним и просмотра информации используются специальные программы клиенты – браузеры. Например: Internet Explorer, Opera, Firefox и др.

Серверы, как правило, принадлежат крупным фирмам, информационным агентствам, органам власти, клубам по интересам, учебным заведениям и т.д. Каждый сервер имеет ip адрес, а так же может обладать соответствующим ему доменным адресом, называемым так, поскольку он состоят из названий доменов (англ. domain-область, регион) - совокупности компьютеров, к которым принадлежит данный компьютер. Доменная система имен введена для удобства пользователей компьютерной сети.

Доменное имя - это уникальное имя, которое каждая организация избирает для идентификации своего сервера в Интернет.

Имена доменов состоят из сегментов (уровней), названия которых записываются справа налево и разделяются точками, т.е. слева находится имя компьютера, справа имя домена первого уровня, соответствующего стране или, реже, какой-либо другой большой группе серверов. Крайняя правая часть доменного имени называется индексом, который указывает либо на тематическую зону интернета, либо на его географическую зону. Например, имя домена ru означает Россия, ua - Украина, au - Австралия, eduобразовательные учреждения, com-коммерческие организации. У доменного имени hosting.education.ru есть три составных части:

−ru — доменное имя 1 уровня;

−education.ru — доменное имя 2 уровня ( домен второго уровня в зоне ru);

−hosting.education.ru — доменное имя 3 уровня (домен третьего уровня в зоне education.ru).

Так как не возможно «знать» все доменные адреса, то они хранятся на

специальных DNS-серверах (Domain Name Service-служба доменных имен), распределенных по всему миру, каждый из которых отвечает за какую-то часть сети. Компьютер, подключенный к Интернету, при необходимости найти какой-то другой компьютер связывается с одним из DNS-серверов.

Другим важным понятием является адрес ресурса (URL-адрес, Uniform Resource Locator) – используется для задания местоположения файлов на серверах сети. URL содержит: метод доступа к ресурсу - имя протокола по которому нужно обращаться к требуемой информации, адрес сервера и полное имя файла на этом сервере, например:

Перейдем теперь к рассмотрению технологии, которая сделала сеть Интернет такой популярной – гипертекстовая технология.

62

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

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

Существует несколько языков гипертекстовых разметок.

HTML (Hypertext Markup Language — «язык разметки гипертекста») —

является стандартным языком разметки документов во всемирной паутине (World Wide Web — WWW). Этот язык используется для создания документов, которые в дальнейшем планируется публиковать на сайтах. Для просмотра таких страниц необходимо специализированное программное обеспечение – браузер, которое интерпретирует код страницы и отображает ее в виде документа, удобного для чтения.

Язык гипертекстовой разметки HTML был разработан британским учёным Тимом Бернерсом-Ли в начале 90-х годов в стенах Европейского совета по ядерным исследованиям в Женеве (Швейцария). Изначально он создавался для обмена научной и технической документацией. С течением времени язык развивался, расширялся, в него добавлялись дополнительные возможности. Все стандарты и возможности используемого на данный момент языка описаны в спецификации и одним из требований, предъявляемых к браузерам – поддержка спецификации HTML, для корректного отображения web-страницы. Одной из первых спецификаций была HTML 1, затем появились HTML 2.0, HTML 3.2, HTML 4.0, 4.01, и

последняя, недавно вышедшая спецификация - HTML 5.

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

Язык гипертекстовой разметки XML - расширяемый язык разметки. Использует структуру тегов и определяет содержание гипертекстового документа. XML позволяет автоматизировать обмен данными.

XML может быть использован для решения следующих основных задач:

−создание web второго поколения – где контент создается пользователями;

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

63

−интеграция неоднородных информационных ресурсов, различных технологий управления данными и приложений;

−создание новой ветви технологий баз данных, называемых XMLориентированными базами данных;

−обеспечение инструментария для новых сфер применения web, таких как электронные библиотеки, электронные издания, электронный бизнес, и

другое.

XHTML - расширяемый язык разметки гипертекста веб-страниц на основе XML, повторяющих и расширяющих возможности HTML.

AJAX (Asynchronous JavaScript And XML — «асинхронный JavaScript и XML») — технология позволяющая веб-страницам производить обмен данными с веб-сервером в фоновом режиме без полной перезагрузки страницы. Использование данной технологии позволяет добиться большего визуального быстродействия веб-приложений.

Каскадные таблицы стилей — CSS (Cascading Style Sheets) —

технология описания внешнего вида документа, созданного языком разметки (HTML, XHTML, XML и др.). CSS используется в основном для оформления веб-страниц, HTML- и XHTML-документов, но иногда и для других структурированных документов. При использовании данной технологии визуальное оформление веб-страницы отделяется от структурного кода страницы, что заметно упрощает оформление большого количества документов в одном стиле.

CSS может использоваться на странице тремя различными способами. Внешние таблицы стилей - отдельный файл (обычно имеет расширение css), на который в самом документе устанавливается ссылка. Встроенные стили - блоки CSS, прописанные внутри документа. Inline-стили - стили,

прописываемые в атрибуте style элементов HTML (XHML).

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

Язык гипертекстовой разметки WML - язык, предназначенный для отображения информации на экране мобильного телефона в соответствии с протоколом WAP (протокол беспроводного доступа). Для разработки приложений WML позволяет использовать языки XML и HTML.

Рассмотрим более подробно HTML.

Структура HTML документа

HTML-документ – это текстовый файл с расширением *.html или *.htm. В Unix системах файл может быть с расширением *.htmll.

Документ HTML содержит следующие части.

1. Строка, содержащая информацию о версии HTML (подобная строка содержится в xml документах). То есть здесь указывается, какая из спецификаций использовалась при создании документа.

64

2.Раздел заголовка.

3.Тело, которое включает содержимое документа.

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

Пример.

Документ может начинаться со следующей необязательной (но желательной строки):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">

Элемент <!DOCTYPE> предназначен для указания типа текущего документа — DTD (document type definition, описание типа документа). Здесь указывается спецификация используемого языка гипертекстовой разметки. Это необходимо, чтобы браузер понимал, в соответствии с каким стандартом следует интерпретировать текущую веб-страницу, поскольку HTML существует в нескольких версиях, кроме того, имеется XHTML (EXtensible HyperText Markup Language, расширенный язык разметки гипертекста), похожий на HTML, но различающийся с ним по синтаксису.

Синтаксис: <!DOCTYPE [Элемент верхнего уровня] [Публичность] "[Регистрация]//[Организация]//[Тип] [Имя]//[Язык]" "[URL]">

Параметры.

¾Элемент верхнего уровня — указывает элемент верхнего уровня в документе, для HTML это тег <html>.

¾Публичность — объект является публичным (значение PUBLIC) или системным ресурсом (значение SYSTEM), например, таким как локальный файл. Для HTML/XHTML указывается значение

PUBLIC.

¾Регистрация — сообщает, что разработчик DTD зарегистрирован в международной организации по стандартизации

(International Organization for Standardization, ISO). Принимает одно из двух значений: плюс (+) — разработчик зарегистрирован в ISO и - (минус) — разработчик не зарегистрирован. Для W3C значение ставится «-».

¾Организация — уникальное название организации, разработавшей DTD. Официально HTML/XHTML публикует W3C, это название и пишется в <!DOCTYPE>.

¾Тип — тип описываемого документа. Для HTML/XHTML значение указывается DTD.

¾Имя — уникальное имя документа для описания DTD.

¾Язык — язык, на котором написан текст для описания объекта. Содержит две буквы, пишется в верхнем регистре. Для документа HTML/XHTML указывается английский язык (EN).

¾URL — адрес документа с DTD.

Далее идет описание непосредственно самого HTML документа. При описании документа мы будем использовать комментарии: <!--….--> - текст, который при интерпретации страницы не отображается, и служит для разъяснения действий, которые выполняются в том или ином разделе.

65

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

В общем виде теги записываются следующем образом: <*>. Парные теги: <*> – открывающий тег, </*> – закрывающий тег. Область действия парного тега распространяется на все содержимое, заключенное между открывающим и закрывающим тегами.

Регистр не влияет на значение тегов. <HTML>

<!-- Данный элемент является самым внешним, так как между его начальным и конечным тегами должна находиться вся Web-страница.-->

<HEAD> <!--Область заголовка Web-страницы. Иными словами, ее первая часть. Так же, как предыдущий элемент, HEAD служит только для формирования общей структуры документа. -->

<TITLE> Заголовок документа </TITLE> <!--Элемент для размещения заголовка Web-страницы. Строка текста, расположенная внутри этого элемента, отображается не в документе, а в заголовке окна браузера. Эта строка часто используется при организации поиска в WWW. Поэтому данная строка не должна быть не слишком длинной и достаточно точно отражать содержание документа. Поиск информации реализован несколькими способами: по ключевым словам элемента МЕТА, по тексту, размещенному на странице, и по строке заголовка внутри элемента TITLE.

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

< STYLE > H2 {fontfamily: Arbat;} CODE {fontfamily: Times new roman;} </ STYLE >

<!-- Элемент разметки STYLE предназначен для размещения описателей стилей. При этом описание стиля из данного элемента разметки, если оно совпадает по имени (идентификатору) со стилем, описанным во внешнем файле, является приоритетным и заменяет описание стиля из внешнего файла. Для каждого элемента существует стилевое оформление по умолчанию,

66

поэтому употребление элемента STYLE не обязательно, но желательно.

Если оформление находится во внешнем документе, то ссылка на такой файл находится в элементе LINK.

STYLE обладает атрибутом TYPE, который задает тип описателя стиля. Это может быть либо text/css , либо text/javascript.

В общем виде запись элемента STYLE выглядит так: <STYLE TYPE=тип_описания_стилей> </STYLE>-->

<LINK REL=stylesheet href="../css/style.css" TYPE="text/css">

<!—При таком описании стили загружаются из внешнего файла style.css. Атрибут REL определяет тип гипертекстовой связи, HREF (Нуреrtехt REFerence) указывает адрес документа, идентифицирующего связь, а атрибут TYPE определяет тип содержания этого документа.

В общем случае контейнер LINK имеет следующий вид: <LINK [REL=тип_отношения] [HREF=URL]

[TYPE=тип_содержания]> Элемент LINK определяет:

¾тип соединения: "stylesheet".

¾местонахождение таблицы стилей через атрибут "ref".

¾тип присоединяемой таблицы стилей: "text/css".--> <META httpequiv="ContentType" content="text/html;

charset=windows1251">

<!—Для отображения информации используются различные типы кодировок. Что бы информация отображалась корректно необходимо указать используемую кодировку. (В данном случае это windows-1251). В этом случае перекодировка информации происходит на стороне клиента-->

<META name="Author" content="Alexei Bulgakov"> <МЕТА name="Keywords" content="WWW, HTML,

document, element">

<!-- Этот элемент содержит служебную информацию, которая не отражается при просмотре Web-страницы. Внутри него нет текста в обычном понимании, поэтому нет и конечного тега. Каждый элемент МЕТА содержит два основных атрибута, первый из которых определяет тип данных, а второй — содержание. Атрибут name используется приложением клиентом для получения дополнительной информации о Web-страницах и их упорядочения. Этот атрибут часто заменяют атрибутом httpequiv. Он используется сервером для создания дополнительных полей при

документа и заданных в неполной (частичной) форме. Кроме того, BASE позволяет определить в каком окне будет отображаться загружаемая информация по умолчанию. -->]

<SCRIPT TYPE="text/javascript" SRC=script.code>

<!-- Элемент разметки SCRIPT служит для размещения кода

JavaScript, VBScript или JScript. Элемент SCRIPT можно использовать не только в заголовке документа, но и в его теле. В отличие от контейнера STYLE, ему не требуется дополнительный контейнер LINK для загрузки внешних файлов кодов. <SCRIPT [TYPE=тип_языка_программирования] [SRC=URL]> </SCRIPT> Существует несколько скриптовых языков: JavaScript, VBScript, JScript. По умолчанию подразумевается JavaScript.-->

</HEAD>

<BODY>

Тело документа <!--Этот элемент заключает в себе гипертекст, который формирует

Web-страницу. Это та произвольная часть документа, которую разрабатывает автор страницы и которая отображается браузером. Закрывающий тег этого элемента находится в конце документа. Внутри элемента BODY можно использовать все элементы, предназначенные для дизайна Web-страницы. Данный тег обладает атрибутами, которые устанавливают способ отображения всей страницы целиком. --> </BODY>

</HTML>

Для задания стиля документа используется CSS Cascading Style Sheets (Таблицы Каскадных Стилей) - это язык, содержащий набор свойств для описания внешнего вида любых HTML документов. С его помощью дизайнер имеет полный контроль над стилем и расположением каждого элемента Webстраницы, что проще и гораздо функциональнее использования обычного набора HTML тегов.

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

<STYLE > .

Рассмотри теперь основные теги более подробно.

Параметры поля BODY

Для задания общего вида документов используются следующие атрибуты. BАСКGROUND определяет фон, на котором отображается текст документа. Так, если источником для фона HTMLдокумента является графический файл image.gif, то в открывающем теге тела BODY появляется соответствующий атрибут:

<ВОDY ВАСКGROUND="image.gif">

Определение цвета фона, текста, ссылок:

68

Цвета задаются тремя двухразрядными шестнадцатеричными числами, которые определяют интенсивность красного, зеленого и синего цветов соответственно. Для удобства разработчиков существуют таблицы цветов с указанием их кода.

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

Заметим, что атрибуты тегов используемых внутри тега BODY «перекрывают» действие данного тега.

Форматирование текста

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

Параграф <P>…</P>. Параграфы отделены друг от друга пустыми строками. Для каждого параграфа возможно задавать свои параметры форматирования при помощи атрибутов, которые указываются в открывающем теге <p «атрибуты»>

<br> – перенос текста на другую строку <b> Полужирный текст </b>

<i> Наклонный текст (курсив) </i> <tt> моноширинный шрифт </tt> <u> Подчеркнутый текст </u>

69

<s> Перечеркнутый </s> <small> Малый </small>

Нормальный текст

<big> Большой </big>

Верхний индекс ^sup Нижний индекс _sub

<NOBR> </NOBR>

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

<BLOCKQUOTE> </ BLOCKQUOTE >

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

Данный тег обладает атрибутом, который позволяет указать источник цитирования: cite=" Адрес документа первоисточника"

Предполагается, что адрес задается в виде URL.

<Q></ Q >

Элемент, похожий на предыдущий. Но если BLOCKQUOTE позволяет создать отдельный абзац с отступом, то Q используется для выделения цитаты внутри абзаца (или строки).

<CITE> </ CITE >

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

<STRONG> </ STRONG>

Элемент, отвечающий за выделение текста. Обычно его применение равносильно использованию элемента <В> для выделения текста полужирным начертанием.

Для отображения служебных символов, которые не видимы в обычном режиме просмотра или используются в специальном значении, используются специальные команды. Например, это escape – последовательности (последовательности символов, которые теряют индивидуальное значение с приобретением группой нового значения). В таблице приведены некоторые из них.

70