Инструментальные средства Internet-технологий

Москва  2018

МИНИСТЕРСТВО ОБРАЗОВАНИЯ И НАУКИ РФ

ФЕДЕРАЛЬНОЕ ГОСУДАРСТВЕННОЕ АВТОНОМНОЕ ОБРАЗОВАТЕЛЬНОЕ УЧРЕЖДЕНИЕ 
ВЫСШЕГО ОБРАЗОВАНИЯ 
«НАЦИОНАЛЬНЫЙ ИССЛЕДОВАТЕЛЬСКИЙ ТЕХНОЛОГИЧЕСКИЙ УНИВЕРСИТЕТ «МИСиС»

ИНСТИТУТ ИНФОРМАЦИОННЫХ ТЕХНОЛОГИЙ  
И АВТОМАТИЗИРОВАННЫХ СИСТЕМ УПРАВЛЕНИЯ

Кафедра автоматизации

Л.В. Маркарян

ИНСТРУМЕНТАЛЬНЫЕ СРЕДСТВА 
INTERNET-ТЕХНОЛОГИЙ

Лабораторный практикум

Рекомендовано редакционно-издательским 
советом университета

УДК 004.4 
 
М25

Р е ц е н з е н т ы: 
канд. техн. наук, доц. И.В. Баранникова; 
д-р физ.-мат. наук, ведущий науч. сотр О.В. Сенько 
(Вычислительный центр им. А.А. Дородницына РАН)

Маркарян Л.В.
М25  
Инструментальные средства Internet-технологий : лаб. практикум / Л.В. Маркарян. – М. : Изд. Дом НИТУ «МИСиС», 2018. – 
92 с.
ISBN 978-5-907061-76-7

Учебное пособие предназначено для студентов направления 220400.68 
«Управление в технических системах», изучающих дисциплину «Инструментальные средства Internet-технологий», и может быть использовано при самостоятельной работе студентов и проведении практических и лабораторных 
работ.
Описание каждой темы содержит: краткую теоретическую справку, основные требования к освоению материала, варианты заданий для самостоятельной проработки студентами  и лабораторный практикум.
Наличие в пособии конспектов практических занятий позволяет студентам на практике закрепить полученные на лекциях знания и использовать в 
дальнейшем полученные навыки, а варианты заданий лабораторных работ позволяют работать самостоятельно.

УДК 004.4

 Л.В. Маркарян, 2018
ISBN 978-5-907061-76-7
 НИТУ «МИСиС», 2018

СОДЕРЖАНИЕ

Знакомство с Интернет и World Wide Web ............................................ 4
Язык гипертекстовой разметки   HTML ................................................ 9
XML (eXtensibleMarkupLanguage)  ................................................. 10
WML (WirelessMarkupLanguage)  .................................................... 10
Обзор дескрипторов HTML .............................................................. 13
Форматирование текста ..................................................................... 19
Таблицы ............................................................................................... 24
Списки ................................................................................................. 32
Фреймы HTML ................................................................................... 40
Формы HTML и ввод данных ........................................................... 43
Цвета в HTML .................................................................................... 56
Изображения в HTML ....................................................................... 59
Использование  стилей ...................................................................... 60
Графические форматы ....................................................................... 61
Лабораторная работа № 1. Форматирование текста 
на Web-странице ..................................................................................... 80
Лабораторная работа № 2. Создание и форматирование таблиц ..... 81
Лабораторная работа № 3. Создание  наборов рамок 
и связывание их с источниками данных .............................................. 83
Лабораторная работа № 4. Фреймовая структура 
и форматирование текста на Web-странице ........................................ 84
Лабораторная работа № 5. Запись html кода на Web-странице 
по образцу рисунка  ............................................................................... 86
Лабораторная работа № 6. Создание гиперссылок ............................ 88
Лабораторная работа № 7. Разметка  Web-страницы 
при помощи таблиц и графических гиперссылок .............................. 90
Литература .............................................................................................. 91

Знакомство с Интернет и World Wide Web

Значение Интернет-технологии как для разработчиков программного обеспечения, так и для обычных пользователей во многом определяется тем, что это прежде всего – интеграционная технология. 
Интернет-технологии – технологии создания и поддержки различных 
информационных ресурсов в компьютерной сети Интернет . И трудно 
найти более удачный пример того, как можно интегрировать различные источники информации и различные ее типы. Информационные 
технологии включающие в себя методы пре образования информации 
по заданному свойству в заданном на правлении, реализуемые соответствующими средствами, называемые инструментальными. Интернет-технологии позволяют создавать простые для освоения, легкодоступные, быстро обновляемые информационные, диалоговые, 
справочные системы. Интернет-технологии, на сегодняшний день 
так же как и промышленные или финансовые технологии, определяют средства и форму, в которых реализуется совместная деятельность 
людей ради достижения определенных целей.
World Wide Web (WWW) представляет собой глобальный мировой 
ресурс информации, доступ к которой открыт для всех пользователей Интернет. Крупнейшие библиотеки мира не могут сравниться с 
WWW ни по объему источников данных, ни по эффективности поиска и исполь зования этих данных пользователями.

Место World Wide Web в мировой сети Интернет

World Wide Web – это множество компьютеров по всему миру, 
состав ляющих единую сеть Интернет, по которой осуществляется обмен текстовой, графической и мультимедийной информацией с 
использовани ем стандартного протокола передачи данных. 
Идея создания единого пользовательского интерфейса для совместной работы над научными проектами по сети принадлежит Тиму 
Бернерсу-Ли (Tim Berners-Lee), сотруднику Европейского центра ядерных исследований (CERN). Группе под его руководством впервые удалось реализовать эти идеи, в результате чего и возник прообраз мировой 
паутины WWW. Механизмы обмена данными по сети затем неоднократно дорабатывались, а объемы сети росли лавинообразно, но неизменными оставались следующие базовые принципы работы WWW.
1. Отсутствие каких-либо централизованных органов управления 
и контроля. WWW никому не принадлежит. Каждый имеет право ис

пользовать информацию, представленную в Web, и публиковать свои 
данные. Тем не менее авторы Web-страниц должны соблюдать определенные этические и уголовно-процессуальные нормы.
2. Универсальность, стандартность и аппаратная независимость 
про токолов обмена данными.
• HTTP (Hypertext Transfer Protocol). Протокол изначально  был 
задуман для  передачи гипертекстовых документов в формате HTML, 
в настоящий момент используется для передачи произвольных данных. Протокол уровня приложений для распределенных информационных систем гиперме диа, позволяющий общаться системам с различной архи тектурой. 
• URL (Universal Resource Locator). Унифицированный указатель 
информационного ресурса, представляющий собой стандартизованную строку символов, которая указывает местонахождение документа 
в сети Интернет.
• HTML (HyperText Markup Language). Стандартный язык, используемый для создания Web-страниц и поддерживаемый всеми 
приложениями обозревателей.
3. Динамическое согласование форматов документов. Программы 
клиентов в запросе к Web-серверам указывают поддерживаемые форматы, что позволяет программному обеспечению Web-сервера возвратить запрашиваемую информацию в наиболее приемлемом формате.
Интернет представляет собой иерархическую мультидоменную 
структуру, состоящую из множества локальных сетей, контролируемых государственными и частными организациями. Каждый компьютер, подключенный к Интернет, имеет свой уникальный IP-адрес. Подключение к Интернет осуществляется через локального провайдера 
услуг Интернет, предоставляющего вашему компьютеру постоянный 
или динамический IP-адрес. Локальный провайдер, в свою очередь, 
является клиентом провайдера услуг Интернет более высокого уровня. Иерархия провайдеров отражена в IP-адресе компьютера, подключенного к Интернет. IР-адрес состоит из четырех чисел от 0 до 255, 
разделенных точками, например: 193.192.15.128. Номера, находящиеся 
в левой части адреса, распределяются провай дерами более высокого 
уровня, как показано на рисунке.

Схема распределения адресов IP провайдера Интернет

Подключение к Интернет

Для подключения компьютера к Интернет-провайдеру используются учетные записи РРР. Протокол РРР (Point-to-Point Protocol–протокол точка-точка) обеспечивает подсоединение компьютера или локальной сети к внешней сети Интернет через провайдера. При этом 
ваша машина становится частью этой сети и использует ее ресурсы. 
Существует несколько технологий подключения к Интернет:
• Аналоговый модем. Домашние компьютеры подключаются к 
провайдерам Интернет через обычные телефонные линии с помощью 
аналоговых модемов.
• Кабельный модем. Обеспечивает высокоскоростное широкополосное подключение к Интернет, позволяющее производить обмен 
данными в несколько раз быстрее, чем с помощью аналоговых модемов. Другое преимущество кабельных модемов состоит в том, что 
подключение осуществляется по линиям кабельного телевидения. Не 
занята телефонная линия, и работа в Интернет не мешает просмотру 
телевизионных программ.

• ISDN (Integrated Services Digital Network). Технология цифровой связи по сети с комплексными услугами изначально создавалась 
для международной телефонной связи. Данная технология объединяет голосовые и цифровые сети в единой среде, обеспечивает высокоскоростную передачу по цифровой линии различных типов данных – текстовых, цифровых, звуковых, видео и др. Стандарты для 
ISDN утверждаются в CCITT (Comite Consultatif Internationale de 
Telegraphique et Telephonique – Международный консультативный комитет по телеграфии и телефонии, МККТТ). При подключении к Интернет по ISDN передача данных происходит со скоростью от 64 до 
128 Кбит/с.
• DSL (Digital Subscriber Line). Все больше провайдеров Интернет предлагают выделенное подключение по цифровым абонентским 
линиям. Выделенное подключение к Интернет – это соединение, при 
котором осуществляется постоянное подключение  компьютера или 
локальной сети к сети Интернет. Выделенное подключение обеспечивает более высокое качество связи и более высокую скорость обмена информацией по сравнению с коммутируемым доступом. Такой 
вариант подключения позволит при желании любое оборудование 
Вашей локальной сети сделать общедоступным ресурсом глобальной 
сети Интернет. Высокоскоростная передача данных на скорости до 
8 Мбит/с в направлении к абоненту и до 1 Мбит/с от абонента к сети. 
Благодаря использованию технологий DSL скорость передачи данных – в десятки и сотни раз выше коммутируемого Dial-Up доступа.
• Подключение по оптико-волоконным каналам. Наиболее 
надежный и качественный вариант подключения локальной сети 
или офиса к Интернет. При данном типе подключения организуется 
цифровой выделенный канал передачи данных на основе опто-волоконных линий связи. Такой тип подключения к Интернет выгоден 
клиентам, использующим Интернет как инструмент бизнес-процесса. Основным преимуществом технологии MetroEthernet по сравнению с xDSL и беспроводным доступом является возможность предоставить связь высокой пропускной способности. Использование 
Ethernet в сочетании с опто-волокном в качестве среды передачи позволяет обеспечить гигабитный доступ по сети непосредственно из 
помещений клиента. Высокая пропускная способность такой сети 
от 100 Кбит/с до 100 Мбит/с, обеспечивает надежную работу любых 
современных мультимедийных приложений и высокие гарантии надежности.

World Wide Web представляет собой обширнейшую коллекцию 
Web-страниц, сохраненных на компьютерах по всему миру. Webстраница – это документ, предназначенный для просмотра в сети 
Интернет. На Web-страницах может быть представлена информация в виде текста, рисунков, звуков и фильмов. Для просмотра Webстраниц используются специаль ные программы-обозреватели. Наиболее популярными обозревателя ми являются Google Chrome, Mozilla 
Firefox, Microsoft Internet Explorer, Opera, Safari. Каждый  производитель браузера может добавлять в свои продукты как поддержку вебстандартов, так и дополнительные функции для удобства, такие как 
панель быстрого набора, работу с закладками, различные расширения 
и т.п.
Чтобы открыть доступ к Web-странице для пользователей во всем 
мире, достаточно сохранить документ в формате, распознаваемом 
обозре вателями, на Web-cepвepe в папке активного Web-узла. Webсервером мо жет служить любой компьютер, подключенный к Интернет, на котором установлено специальное программное обеспечение, например Apache (http://www.apache.org). Во время инсталляции 
программы Web-cepвера происходит выбор и установка папки Webузла. Это может быть корпоративный сервер вашей компании или 
обществен ный сервер, предоставляющий хостинговые услуги.
Хостингом называется платное или бесплатное предо ставление 
пользователям места на дисках Web-cepвepa для размещения персональных или корпоративных Web-страниц. 
Web-сервер, как и все другие компьютеры, подключенные к Интернет, имеет свой уникальный IP-адрес. Поскольку IP адрес не очень 
удобен для пользователей, Web-серверы имеют еще и адреса DNS, 
которые намного проще запоминаются и могут выглядеть, на пример, 
так: www.mail.ru. Так же, как и цифровой IP-адрес, имя сервера разделено точками для удобства построения иерархии в домене на основе имен. Иерархия зада ется справа налево. При вводе DNS-адрес, он 
сначала направляется в так называемый сервер имен, который преобразует его в 32-битный IP-адрес для машинного считывания. 
Доменные имена (DNS-адрес) обычно имеет три составляющие 
(хотя их может быть сколько угодно): 
 – Первая – имя компьютера, подключенного к сети Интернет (или 
как его еще называют, узловое имя). Имя дает организация, владеющая данным компьютером. В приведенном выше примере компьютер 
имеет имя www, так как он работает как Web-сервер. Можно исполь

зовать или уже существующие в Интернет узловые имена, или придумать свои.
 – Вторая часть – домен компании. 
 – Последняя составляющая доменного имени говорит либо о 
типе организации, владеющей компьютером, либо о стране, где размещен компьютер. 
По DNS-адресу можно определить местоположение и профиль организации. Вот несколько доменов высшего уровня:
• gov – правительственные организации;
• mil – военные организации;
• edu – образовательные организации;
• com – коммерческие организации;
• org – общественные организации;
• net – организации, предоставляющие сетевые услуги.
Адрес Web-страницы состоит из DNS-адреса Web-сервера и пути к 
файлу Web-страницы в папке Web-узла, разделенных символами слеша. 
Например, адрес документа в Web может иметь такой вид:
http: / /www.MyServer.com/MySite/MyPage/default. htm
Разберем составные части этого адреса:
• http – указывает, что запрос на Web-сервер отправляется по протоколу HTTP.
• www.MyServer.com – DNS-адрес Web-cepвepa, соответствующий определенному IP-адресу этого компьютера. DNS-адрес и IРадрес взаимозаменимы. Например, если IP-адрес узла 193.192.15.128, 
то запрос к серверу http://193.192.15.128/MySite/MyPages/ default.
htm  будет работать так же, как и приведенный выше URL-адрес Webстраницы.
• MySite/MyPage – имена двух папок, вложенных в корневую 
пап ку Web-узла, заданную при установке программного обеспечения 
Web-сервера.
• default .htm – имя файла документа в формате HTML.

Язык гипертекстовой разметки   HTML

В основе Интернет и Интернет-технологий лежат гипертексты и 
сайты, размещаемые в глобальной сети Интернет либо в локальных 
сетях ЭВМ.
Одним из компонентов технологии создания распределенной гипертекстовой системы World Wide Web стал язык гипертекстовой 

разметки HTML, разработанный Тимом Бернерсом – Ли на основе 
стандарта языка разметки печатных документов – SGML (Standard 
Generalised Markup Language, стандартный обобщенный язык разметки). 
Язык HTML является международным стандартом, поэтому все 
гипертексты, единым образом воспринимаются и единым образом 
отображаются на всех персональных компьютерах во всем мире. 
Язык HTLM – это коллекция управляющих символов – дескрипторов, 
с помощью которых можно добавлять и форматировать элементы документа. Для настройки внешнего вида и функционирования элемента страницы устанавливаются его атрибуты. Последняя версия языка 
HTML называется HTML5. 

XML (eXtensibleMarkupLanguage) 

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

WML (WirelessMarkupLanguage) 

WML (беспроводной язык разметки) применяется для создания 
информационных ресурсов, предназначенных для владельцев сотовых телефонов. 
Кроме перечисленных выше языков разметки, для каждой предметной области существуют специализированные языки (MathML – 
для описания математических формул, VRML – для создания трехмерных объектов и т. д.).
Гипертекст – информационная структура, позволяющая устанавливать смысловые связи между элементами текста на экране компьютера таким образом, чтобы можно было легко осуществлять переходы 
от одного эле мента к другому. На практике в гипертексте некоторые 
слова выделяют пу тем подчеркивания или окрашивания в другой 
цвет (гиперссылки). Выделе ние слова говорит о наличии связи этого 
слова с некоторым документом, в котором тема, связанная с выделенным словом, рассматривается более подробно.
Отдельный документ, выполненный в формате HTML, называется:
• HTML-документом;

• Web-документом;
• Web-страницей.
Такие страницы, как правило, имеют расширение НТМ или HTML.
Гиперссылка – фрагмент текста, который является указателем на 
другой файл или объект. Гиперссылки необходимы для того, чтобы 
обеспечить возможность перехода от одного документа к другому.
Группа Web-страниц, принадлежащих одному автору или одному издателю и взаимосвязанных общими гиперссылками, образует 
структуру, которая называется Web-узлом, или Web-сайтом.
Каждая HTML-страница имеет свой уникальный URL-адрес в Интернете.
Фрейм (Frame) – этот термин имеет два значения. Первое – область доку мента со своими полосами прокрутки. Второе значение – 
одиночное изо бражение в анимационном графическом файле (кадр).
Апплет (Applet) – программа, передаваемая на компьютер клиента 
в виде отдельного файла и запускаемая при просмотре Web-страницы.
Скрипт, или сценарий (Script), – программа, включенная в состав 
Web- страницы для расширения ее возможностей. Браузер Internet 
Explorer в оп ределенных ситуациях выводит сообщение: «Разрешить 
выполнение сцена риев на странице?» В этом случае имеются в виду 
скрипты.
CGI (Common Gateway Interface) – общее название программ, которые, рабо тая на сервере, позволяют расширять возможности Webстраниц. Например, без таких программ невозможно создание интерактивных Web-страниц.
Браузер (Browser) – программа для просмотра Web-страниц.
Элемент – конструкция языка HTML. Можно представить его себе 
как контейнер, содержащий данные и позволяющий отформатировать 
их оп ределенным образом. Любая Web-страница представляет собой 
набор эле ментов. Одна из основных идей гипертекста – возможность 
вложения элементов.
Дескрипторы – это управляющие символы, с помощью которых 
можно добавлять и форматировать элементы документа. 
Пример
<Начало элемента> Содержание элемента, данные, которые форматирует эле мент </Конец элемента>
Тэг – начальный или конечный маркеры элемента. Тэги определяют грани цы действия элементов и отделяют элементы друг от друга.