Краткие сведения из теории. Интернет (internet)- это всемирное объединение сетей, шлюзов, серверов и клиентских компьютеров, использующих для связи единый набор протоколов TCP/IP

Интернет (internet) - это всемирное объединение сетей, шлюзов, серверов и клиентских компьютеров, использующих для связи единый набор протоколов TCP/IP.

Протокол - это набор соглашений, который определяет обмен данными между различными программами.

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

Модель OSI – это семиуровневая логическая модель работы сети.

На физическом уровне этой модели определяются физические (механические, электрические, оптические) характеристики линий связи.

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

Сетевой уровень отвечает за адресацию и доставку сообщений.

Транспортный уровень контролирует очередность прохождения компонент сообщения.

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

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

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

Протокол TCP/IP - это два протокола нижнего уровня, являющиеся основой связи в Интернет. Протокол TCP (Transmission Control Protocol) разбивает передаваемую информацию на порции и нумерует все порции. С помощью протокола IP (Internet Protocol) все части передаются получателю. Далее с помощью протокола TCP проверяется, все ли части получены. При получении всех порций TCP располагает их в нужном порядке и собирает в единое целое.

Каждый компьютер в сети TCP/IP имеет адреса трех уровней:

· физический (MAC-адрес),

· сетевой (IP-адрес)

· символьный (DNS-имя)

Для компьютеров, входящих в локальные сети МАС-адрес - это адрес сетевого адаптера или порта маршрутизатора, например, 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 и др.);

· сетевой адрес ресурса (имя хост-машины и домена);

· полный путь к файлу на сервере.

Пример: https://support.vrn.ru/archive/index.html.

Ниже приведены некоторые наиболее часто встречающиеся термины сети Интернет.

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

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

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

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

Сайт - обобщенное название совокупности документов в Интернет, связанных между собой ссылками.

Шлюз (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> и более нигде в теле документа. Данный тэг представляет из себя общее описание документа. Избегайте размещать какой-либо текст внутри тэга <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>:

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

Разрыв строки <BR>

Тэг <BR> извещает браузер о разрыве строки. Наилучший пример использования данного тэга - форматированный адрес или любая другая последовательность строк, где браузер должен отображать их одну под другой. Например:

Алексей Ярцев <BR>

Дмитровское шоссе, <BR>

д.9Б, офис 326 <BR>

Тэги списков

Существует три основных вида списков в 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). Например:

<LI> Программирование

<LI> Алгоритмизация

<LI> Проектирование

</UL>

Графика внутри HTML-документа)

Для вставки графического изображения применяется тэг<IMG>.

Атрибуты тэга <IMG>: src="URL" URL-адрес файла изображения.

alt="text" - текст, который будет отображаться вместо изображения, при невозможности его вывода.

align- Выравнивание изображения. Может принимать значения:

left -выравнивание изображения по левой границе экрана браузера;

right -выравнивание изображения по правой границе экрана браузера;

top -выравнивание текста по верхней границе изображения;

middle -выравнивание текста по центру изображения;

bottom -выравнивание текста по нижней границе изображения;

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

absmiddle -выравнивание середины строки относительно середины изображения;

baseline -выравнивание нижней рамки изображения относительно базовой линии текстовой строки;

absbottom -выравнивание нижней границы изображения относительно нижней границы текущей строки.

height- Высота картинки в пикселях.

width- Ширина картинки в пикселях.

border- Ширина рамки вокруг картинки в пикселях (только NN).

hspace- Ширина свободного пространства в пикселах, которое должно отделять изображение от текста по горизонтали.

vspace- Ширина свободного пространства в пикселах, которое должно отделять изображение от текста по вертикали.

Фоновые рисунки

Описание фонового рисунка включается в тэг BODY и выглядит следующим образом:

Задание стандартных цветов

Многие 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 (большой)

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 помещает заголовок под таблицей.

Элемент 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. Определение версии используемого браузера

С помощью базы помощи (Справка - О программе) определите версию используемого браузера. Данные о браузере поместите в отчет.

Задание 2. Установка начальной (домашней) страницы браузера

Установите поочередно различные режимы выбора начальной (домашней) страницы, с которой начинается работа (обзор) браузера MS Internet Explorer (пункты Сервис - Свойства обозревателя и выбрать закладку Общие):

- пустая страница;

- текущая страница;

- исходная страница.

При установке текущей страницы следует использовать доменный адрес: https://www.kstu.kz/. Опишите порядок выполнения данного задания. Объясните, в каких случаях целесообразно использовать каждый из исследованных режимов.

Задание 3. Изучите способы ускорения загрузки Web-страниц с помощью пункта Сервис - Свойства обозревателя, закладка Дополнительно. В разделе Мультимедиа с помощью включателей установить необходимые режимы. Результаты поместите в отчет.

Задание 4. Просмотр страницы в виде программы на языке HTML.

Загрузите поочередно страницы www.microsoft.com, www.rambler.ru и www.lenta.ru. Установите режим просмотра страниц в виде HTML. Поместите в отчет фрагменты программ, расположенные между тегами <title> и </title>

Задание 5. Создать собственную web-страничку с использованием всех выше описанных тегов.

№ варианта	Индивидуальное задание
1.	создать HTML – документ на тему «Автобиография»
2.	создать HTML – документ на тему «Мой университет»
3.	создать HTML – документ на тему «Мой город»
4.	создать HTML – документ на тему «Моя страна»
5.	создать HTML – документ на тему «Моя группа»
6.	создать HTML – документ на тему «Моя семья»
7.	создать HTML – документ на тему «Любимое животное»
8.	создать HTML – документ на тему «Любимая книга»
9.	создать HTML – документ на тему «Моя любимая музыка»
10.	создать HTML – документ на тему «Моя любимая поп-группа»
11.	создать HTML – документ на тему «Автомобили»
12.	создать HTML – документ на тему «Компьютеры»
13.	создать HTML – документ на тему «Спорт»
14.	создать HTML – документ на тему «Музыка»
15.	создать HTML – документ на тему «Любимая радиостанция»
16.	создать HTML – документ на тему «Магазин бытовой техники»
17.	создать HTML – документ на тему «Справочник лекарственных растений»
18.	создать HTML – документ на тему «Мебельный магазин»
19.	создать HTML – документ на тему «Моя кафедра»
20.	создать HTML – документ на тему «Моё хобби»