lab9_интернет

Лабораторная работа №9
Тема: Интернет. Основные понятия (сайт, IP-адрес, порт, модель OSI,
сервер, клиент).
Цель работы: Приобрести практические навыки работы в Интернете,
изучить основные понятия и основные службы, научиться создавать webстраницы с помощью языка HTML.
Краткие сведения из теории
Интернет (internet) - это всемирное объединение сетей, шлюзов,
серверов и клиентских компьютеров, использующих для связи единый
набор протоколов TCP/IP.
Протокол - это набор соглашений, который определяет обмен данными
между различными программами.
Сетевые протоколы предписывают правила работы компьютерам,
которые подключены к сети. Они строятся по многоуровневому принципу. В
настоящее время для сетевых протоколов используется модель OSI.
Модель OSI– это семиуровневая логическая модель работы сети.
На физическом уровне этой модели определяются физические
(механические, электрические, оптические) характеристики линий связи.
На канальном уровне определяются правила использования
физического уровня узлами сети.
Сетевой уровень отвечает за адресацию и доставку сообщений.
Транспортный уровень контролирует очередность прохождения
компонент сообщения.
Задача сеансового уровня - координация связи между двумя
прикладными программами, работающими на разных рабочих станциях.
Уровень представления служит для преобразования данных из
внутреннего формата компьютера в формат передачи.
Прикладной уровень обеспечивает удобный интерфейс связи сетевых
программ пользователя.
Протокол TCP/IP - это два протокола нижнего уровня, являющиеся
основой связи в Интернет. Протокол TCP (Transmission Control Protocol)
разбивает передаваемую информацию на порции и нумерует все порции. С
помощью протокола IP (Internet Protocol) все части передаются получателю.
Далее с помощью протокола TCP проверяется, все ли части получены. При
получении всех порций TCP располагает их в нужном порядке и собирает в
единое целое.
Каждый компьютер в сети TCP/IP имеет адреса трех уровней:

физический (MAC-адрес),

сетевой (IP-адрес)

символьный (DNS-имя)
3
Для компьютеров, входящих в локальные сети МАС-адрес - это адрес
сетевого адаптера или порта маршрутизатора, например, 11-А0-17-3D-BC-01.
Эти адреса назначаются производителями оборудования и являются
уникальными адресами, так как управляются централизовано.
IP-адрес - это уникальный идентификатор, записываемый тетрадой
вида, например, 109.26.17.100. Этот номер может быть постоянно закреплен за
компьютером или же присваиваться динамически - в тот момент, когда
пользователь соединился с провайдером, но в любой момент времени в
Интернет не существует двух компьютеров с одинаковыми IP-адресами. Этот
адрес используется на сетевом уровне.
Символьный адрес или DNS-имя назначается администратором и
состоит из нескольких частей, например, имени машины, имени организации,
имени домена SERV1.IBM.COM . Такой адрес используется на прикладном
уровне, например, в протоколах FTP или Тelnet.
IР - адрес позволяет точно идентифицировать компьютер, но
этого недостаточно. Дело в том, что на каждом узле могут быть запущены
самые разные службы Internet - обеспечивающие передачу электронной почты,
файлов, гипертекстовой информации и т.п. Каждая служба использует в своей
работе тот или иной протокол прикладного уровня. Для передачи файлов - это
протокол FTP (File Transfer Protocol), передачи web-страниц - протокол
передачи гипертекстовой информации HTTP(HyperText Transfer Protocol), для
работы с электронной почтой - протоколы SMTP, POP3, IMAP и т.д.
Для каждой службы отведен отдельный порт, представляющий собой
число от 0 до 65534. Для наиболее популярных служб зарезервированы
стандартные номера портов. Так, для FTP это 21, для HTTP - 80, SMTP - 25,
POP3 - 110.
Таким образом, при соединении в сеть любой канал связи в TCP
определяется двумя числами: IP- адресом ЭВМ и номером порта. Эта
комбинация называется сокетом (конечная абонентская точка).
Для доступа к информации в Интернете используются не просто
доменные имена, а универсальные указатели ресурсов URL (Universal Resource
Locator).
URL включает в себя:

метод доступа к ресурсу, т.е. протокол доступа (http, gopher, WAIS,
ftp, file, telnet и др.);

сетевой адрес ресурса (имя хост-машины и домена);

полный путь к файлу на сервере.
Пример: http://support.vrn.ru/archive/index.html.
Ниже приведены некоторые наиболее часто встречающиеся термины сети
Интернет.
WWW (World Wide Web - всемирная паутина) – это служба,
предоставляющая доступ к различным ресурсам Интернет – документам,
графике, аудио и видеозаписям, использующая протокол HTTP и язык HTML.
4
Поисковая система – это комплекс программ и мощных компьютеров,
автоматически просматривающих ресурсы Интернет, которые они могут найти,
и индексирующих их содержание.
Сервер в сети Интернет - это компьютер, обеспечивающий обслуживание
пользователей сети: разделяемый доступ к дискам, файлам, принтеру, системе
электронной почты. Обычно сервер - это совокупность аппаратного и
программного обеспечения.
Любой компьютер, имеющий доступ к услугам сервера называют
клиентом сети или рабочей станцией.
Сайт - обобщенное название совокупности документов в Интернет,
связанных между собой ссылками.
Шлюз (gateway)- это компьютер или система компьютеров со
специальным программным обеспечением, позволяющая связываться двум
сетям с разными протоколами.
Провайдер (ISP -Internet Service Provider) – это поставщик услуг
Интернет, организация, которая предоставляет возможность подключения к
сети Интернет. Он предоставляет необходимое программное обеспечение,
адрес электронной почты и доступ к другим возможностям Интернет.
Язык гипертекстовой разметки документа (HyperText Markup
Language (HTML)) предназначен для создания гипертекстовых документов в
среде WEB. HTML-документы могут просматриваться различными типами
web-браузеров. Все что необходимо, чтобы прочитать HTML-документ – это
web-браузер, который интерпретирует тэги HTML и воспроизводит на экране
документ в виде, который ему придает автор.
HTML-документы могут быть созданы при помощи любого текстового
редактора или специализированных HTML-редакторов.
Все тэги HTML начинаются с "<" и заканчиваются символом ">". Как
правило, существует стартовый тэг и завершающий тэг.
Некоторые тэги, такие, как <P> (тэг, определяющий абзац), не требуют
завершающего тэга, но его использование придает исходному тексту документа
улучшенную читаемость и структурированность.
HTML не реагирует на регистр символов, описывающих тэг, и
приведенный ранее пример может выглядеть следующим образом:
<title> Заголовок документа </title>
Структура документа
Когда WEB-браузер получает документ, он определяет, как документ
должен быть интерпретирован. Самый первый тэг, который встречается в
документе, должен быть тэгом <HTML>. Данный тэг сообщает WEB-браузеру,
что документ написан с использованием HTML. Минимальный HTMLдокумент будет выглядеть так:
<HTML> ...тело документа... </HTML>
Заголовочная часть документа <HEAD>
Тэг заголовочной части документа должен быть использован сразу после
тэга <HTML> и более нигде в теле документа. Данный тэг представляет из себя
5
общее описание документа. Избегайте размещать какой-либо текст внутри тэга
<HEAD>. Стартовый тэг <HEAD> помещается непосредственно перед тэгом
<TITLE> и другими тэгами, описывающими документ, а завершающий тэг
</HEAD> размещается сразу после окончания описания документа. Например:
<HTML>
<HEAD>
<TITLE> Список сотрудников </TITLE>
</HEAD>
...
Заголовок документа <TITLE>
Большинство WEB-браузеров отображают содержимое тэга <TITLE> в
заголовке окна, содержащего документ и в файле закладок, если он
поддерживается WEB-браузером. Заголовок, ограниченный тэгами <TITLE> и
</TITLE>, размещается внутри <HEAD>-тэгов, как показано выше на примере.
Заголовок документа не появляется при отображении самого документа в окне.
Тело документа <BODY>
Тэги тела документа идентифицируют отображаемые в окне компоненты
HTML-документа. Тело документа может содержать ссылки на другие
документы, текст и другую форматированную информацию.
Тело документа должно находиться между тэгами <BODY> и </BODY>.
Уровни заголовков <Hx>
Первый уровень заголовков (самый большой) обозначается цифрой 1,
следующий - 2, и т.д. Большинство браузеров поддерживает интерпретацию
шести уровней заголовков, определяя каждому из них собственный стиль.
Синтаксис заголовка уровня 1 следующий:
<H1> Заголовок первого уровня </H1>
Заголовки другого уровня могут быть представлены в общем случае так:
<Hx> Заголовок x-го уровня </Hx>, где x - цифра от 1 до 6, определяющая
уровень заголовка.
Тэг абзаца <P>
Физический разрыв абзаца может находиться в любом месте исходного
текста документа. Однако браузер разделяет абзацы только при наличии тэга
<P>. Дополнительные параметры тэга <P>:
<P ALIGN=left|center|right>
позволяют выравнивать абзац по левому краю, центру и правому краю
соответственно.
Разрыв строки <BR>
Тэг <BR> извещает браузер о разрыве строки. Наилучший пример
использования данного тэга - форматированный адрес или любая другая
последовательность строк, где браузер должен отображать их одну под другой.
Например:
Алексей Ярцев <BR>
Дмитровское шоссе, <BR>
д.9Б, офис 326 <BR>
Тэги списков
6
Существует три основных вида списков в HTML-документе:
 пронуменрованный
 непронуменрованный
 список описаний
Пронумерованные списки
Пронумерованный список начинается стартовым тэгом <OL> и
завершается тэгом </OL>. Каждый элемент списка начинается с тэга <LI>.
Например:
<OL>
<LI> Программирование
<LI> Алгоритмизация
<LI> Проектирование
</OL>
Тэг <OL> может иметь параметры: <OL TYPE=A|a|I|i|1 START=n>,
где:TYPE означает вид счетчика:
A - большие латинские буквы (A,B,C...);
a - маленькие латинские буквы (a,b,c...);
I - большие римские цифры (I,II,III...);
i - маленькие римские цифры (i,ii,iii...);
1 - обычные цифры (1,2,3...),
START=n - число, с которого начинается отсчет
Непронумерованные списки.
Непронумерованный список начинается стартовым тэгом <UL> и
завершается тэгом </UL>. Каждый элемент списка начинается с тэга <LI>.
Например:
<UL>
<LI> Программирование
<LI> Алгоритмизация
<LI> Проектирование
</UL>
Тэг <UL> может иметь параметр <UL TYPE=disc|circle|square>. Тип тэга
<UL> определяет внешний вид маркера как вид по умолчанию (disc), круглый
(circle) или квадратный (square). Например:
<UL TYPE=square>
<LI> Программирование
<LI> Алгоритмизация
<LI> Проектирование
</UL>
Графика внутри HTML-документа)
Для вставки графического изображения применяется тэг<IMG>.
Атрибуты тэга <IMG>: src="URL" URL-адрес файла изображения.
alt="text" - текст, который будет отображаться вместо изображения, при
невозможности его вывода.
align- Выравнивание изображения. Может принимать значения:
left -выравнивание изображения по левой границе экрана браузера;
7
right -выравнивание изображения по правой границе экрана браузера;
top -выравнивание текста по верхней границе изображения;
middle -выравнивание текста по центру изображения;
bottom -выравнивание текста по нижней границе изображения;
texttop -выравнивание текста по верхний границе изображения, относительно
самых высоких символов;
absmiddle -выравнивание середины строки относительно середины
изображения;
baseline -выравнивание нижней рамки изображения относительно базовой
линии текстовой строки;
absbottom -выравнивание нижней границы изображения относительно нижней
границы текущей строки.
heightВысота картинки в пикселях.
widthШирина картинки в пикселях.
borderШирина рамки вокруг картинки в пикселях (только NN).
hspaceШирина свободного пространства в пикселах, которое должно
отделять изображение от текста по горизонтали.
vspaceШирина свободного пространства в пикселах, которое должно
отделять изображение от текста по вертикали.
Фоновые рисунки
Описание фонового рисунка включается в тэг BODY и выглядит
следующим образом:
<BODY BACKGROUND="picture.gif">
Задание стандартных цветов
Многие HTML-авторы любят использовать заранее предопределенные
цвета фона документа, обычного текста и ссылок. Чтобы задать эти цвета,
необходимо включить в тэг <BODY> дополнительные параметры:
<BODY
BGCOLOR="#XXXXXX"
TEXT="#XXXXXX"
LINK="#XXXXXX">, где каждый из параметров определяет цвет того или
иного элемента. Опишем эти параметры:
BGCOLOR - Цвет фона документа
TEXT - Цвет простого текста документа
LINK - Цвет ссылки
Цвет задается шестизначным числом в шестнадцатеричном формате по
схеме RGB (Red, Green, Blue). Цвет #000000 соответствует черному, а цвет
#FFFFFF - белому
Добавление стилей в HTML документ
HTML позволяет использовать различные стили шрифтов для выделения
текстовой информации в документах. Вот короткий список стилей,
поддерживаемых большинством браузеров:
 bold (жирный)
 italic (наклонный)
 mono spaced (type writer - с использованием фиксированных шрифтов)
Дополнительные стили:
big (большой)
8
small (маленький)
sub (подстрочник)
sup (надстрочник)
Размер шрифта
Вы можете изменять размер шрифта тэгом <FONT SIZE= n>
Шрифт может иметь размер от 1 до 7.
Вы можете изменить цвет шрифта при помощи тэга <FONT
COLOR="#xxxxxx>
Цвет указывается в RGB-формате (Red-Green-Blue) посредством указания
размерности каждой компоненты цвета в шестнадцатеричном формате.
Например, белый цвет обозначается "000000", черный - "FFFFFF", синий "0000FF" и т.п.
Таблицы
Таблица объявляется с помощью тэгов:
TABLE - создаёт таблицу;
CAPTION - задаёт заголовок таблицы;
TR - создаёт новый ряд (строку) ячеек таблицы;
TD и TH - создаёт ячейку с данными в текущей строке.
Таблицы в HTML формируются построчно. Для этого, с помощью
элемента TR необходимо создать ряд таблицы, в который затем элементом TD
помещаются ячейки.
Тэг <TABLE> может использоваться с рядом параметров, каждый из
которых допустимо опускать:
ALIGN
Горизонтальное
выравнивание
таблицы.
Возможные
значения: left, center, right. Значение по умолчанию - left.
VALIGN Вертикальное
выравнивание
содержимого
таблицы.
Возможные значения: top, bottom, middle.
BORDER Ширина внешней рамки таблицы (в пикселах). При
BORDER="0" или при отсутствии этого параметра рамка отображаться не
будет.
CELLPADDING Расстояние (в пикселах) между рамкой каждой ячейки
таблицы и содержащейся в ней инфе.
CELLSPACING Расстояние (в пикселах) между границами соседних
ячеек.
WIDTH Ширина таблицы задается либо в пикселах, либо в процентном
отношении к ширине окна браузера.
HEIGHT Высота задается либо в пикселах, либо в процентном
отношении к высоте окна браузера.
BGCOLOR Цвет фона ячеек таблицы.
BACKGROUND Фоновый рисунок таблицы.
Тэг заголовка таблицы <CAPTION> имеет единственный допустимый
параметр <ALIGN>.
Атрибуты: top помещает заголовок над таблицей (значение по
умолчанию)/
Bottom
помещает заголовок под таблицей.
9
Элемент TR
Атрибуты: ALIGN
определяет способ горизонтального выравнивания
содержимого всех ячеек данного ряда. Возможные значения: left, center, right
VALIGN определяет способ вертикального выравнивания содержимого
всех ячеек данного ряда. Возможные значения: top, bottom, middle
BGCOLOR определяет цвет фона для всех ячеек данного ряда
Элементы TD и TH
Элемент TD создаёт ячейку с данными в текущей строке. Элемент TH
также создаёт ячейку, но определяет её как ячейку-заголовок. Такое
разграничение позволяет браузерам оформлять содержимое ячейки-заголовка и
ячеек с данными разными шрифтами. Текст, находящийся между тэгами
<TH></TH>, отображается жирным шрифтом, т.е. <TH>текст</TH>
равносильно <TD><b>текст</b></TD>
Атрибуты: ALIGN
определяет способ горизонтального выравнивания
содержимого ячейки. Возможные значения: left, center, right.
VALIGN определяет способ вертикального выравнивания содержимого
ячейки. Возможные значения: top, bottom, middle. По умолчанию происходит
выравнивание по центру (VALIGN="middle"), если значение этого параметра не
было задано ранее в элементе TR.
WIDTH
определяет ширину ячейки. Ширина задается в пикселах или
в процентном отношении к ширине таблицы.
HEIGHT определяет высоту ячейки. Высота задается в пикселах или в
процентном отношении к ширине таблицы.
COLSPAN определяет количество столбцов, на которые простирается
данная ячейка. По умолчанию имеет значение 1.
ROWSPAN определяет количество рядов, на которые простирается
данная ячейка. По умолчанию имеет значение 1.
BGCOLOR определяет цвет фона ячейки. Задается либо RGB-значением в
шестнадцатиричной системе, либо одним из 16 базовых цветов.
BACKGROUND заполняет ячейку фоновым рисунком.
Содержание работы:
Задание 1.
Знакомство с сайтом www.kstu.kz. Просмотреть информацию об
университете, институтах, кафедрах. Открыть сайт библиотеки и сделать поиск
по учебникам Информатики. Выписать три учебника по дисциплине
«Информатика». Открыть ссылку «Студент» и выписать результаты первой
аттестации.
Задание 2.
Прочитать сведения из теории. Ознакомиться с основными тегами языка
HTML. В редакторе «Блокнот» создать web-страницу «Резюме» с помощью
тегов языка HTML. Вставить свою фотографию на web-страницу.
10
Задание 3.
Открыть редактор «Блокнот». Создать web-страницу содержащей таблицу
«Расписание занятий». Использовать различные атрибуты тега <TABLE>.
Задание 4 (творческое).
Выбрать вариант задания. Создать web-сайт, содержащий не менее трех
страниц. На web-страницах использовать теги вставки таблиц, рисунков,
бегущей строки и т.д. Связать web-страницы гиперссылками.
№ варианта
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
Индивидуальное задание
создать web-сайт на тему «Новинки компьютерной техники»
создать web-сайт на тему «Правила дорожного движения»
создать web-сайт на тему «Столицы мира»
создать web-сайт на тему «Мой университет»
создать web-сайт на тему «Магазин Автомобили»
создать web-сайт на тему «Здоровый образ жизни»
создать web-сайт на тему «Физкультура и спорт»
создать web-сайт на тему «Кухни народов мира»
создать web-сайт на тему «Великие композиторы»
создать web-сайт на тему «Времена года»
создать web-сайт на тему «Мир животных»
создать web-сайт на тему «История освоения космоса»
Содержание отчета
1.
2.
3.
4.
Краткое описание выполненной работы.
HTML коды всех заданий.
Внешний вид головной страницы web-сайта.
Ответы на контрольные вопросы.
Контрольные вопросы
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
страницы?
Что такое Internet?
Виды адресации в Internet.
Какова структура IP-адреса?
Перечислите основные службы Интернета.
Что такое гиперссылка?
Сколько уровней заголовков можно создать в HTML-документе?
Для чего предназначен тег <UL>?
Какие атрибуты существуют у тега <TABLE>?
Какие атрибуты существуют у тега <Img>?
При помощи какого атрибута тега <body>можно оформить фон
11