Мировые Информационные ресурсы



РУБРИКИ	Мировые Информационные ресурсы	РЕКЛАМА

Главная

Зоология

Инвестиции

Информатика

Искусство и культура

Исторические личности

Безопасность жизнедеятельности

Бизнес-план

Биология

Бухучет управленчучет

Водоснабжение водоотведение

Военная кафедра

География экономическая география

Законодательство и право

Здоровье

Земельное право

Иностранные языки лингвистика

ПОИСК

Мировые Информационные ресурсы

Дает описание содержимого Web страницы.

<META name=”KEYWORDS” content=”…, …, …”

Ключевые слова указываются через запятую (можно пробел).

Определяет ключевые слова данного Web документа.

* Свойства HTML документа, обозначенные http-equiv передаются

на компьютер пользователя в составе HTTP заголовка. Браузер

обязательно интерпретирует http заголовок. Инструкции,

содержащиеся в http заголовке особенно важны для правильного

отображения HTML документа.

* Свойства HTML документа, определенные с помощью атрибута

name носят рекомендательный характер и в большинстве своем

игнорируются браузером.

Подобные МЕТА свойства (или свойства HTML документа)

обрабатываются поисковыми системами.

Пример.

<BODY BGCOLOR=”red”/”gray”/”# FFCC22”

BACKGROUND=1.jpg>

Структура дескриптора BODY

1.Атрибут bgcolor - для отображения фона HTML документа.

Пример.

bgcolor=”white” (black, blue и другие цвета)

Данному атрибуту может присваиваться свойство RGB (RGB - red,

green, blue).

Пример.

bgcolor=”#FFCC22”, где

FF - уровень красной составляющей, CC - уровень зеленой

составляющей, 22 - уровень синей составляющей.

В шестнадцатеричной системе исчисления FFFFFF - белый цвет,

000000 - черный цвет.

Данная кодировка (RGB) может использоваться во всем HTML

документе.

2. Атрибут background - определяет фон с помощью графического

формата.

Пример.

background=”2.jpg”

В значении атрибута указывается название документа и путь к нему.

(Если указано только название, то данный файл должен находиться в

той же папке, что и HTML документ).

Если путь указан так:

background=”/fold1/2.jpg”, то папка будет искаться начиная от

корневого каталога.

3. Атрибут TEXT.

Значения данного атрибута могут быть такими же, как у атрибута

bgcolor.

Эти же правила верны и для следующих атрибутов:

4. Атрибут LINK= определяет цвет ссылки.

5. Атрибут VLINK= определяет цвет уже посещенной ранее ссылки.

6.Атрибут ALINK= определяет цвет активной ссылки (то есть ссылки,

указывающей на текущий документ).

7. Атрибут TOPMARGIN=(верхнее поле).

8. Атрибут LEFTMARGIN=(левое поле).

Пример.

TOPMARGIN=”20” (в пунктах).

LEFTMARGIN=”10” (в пунктах).

Все содержимое HTML документа будет смещено относительно левого и

верхнего края HTML документа.

0x08 graphic

Пример парного дескриптора:

-----------------------

</BODY>

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

В HTML документе можно помещать комментарии (они игнорируются

браузером и используются для служебных целей).

Комментарии.

1) Одиночный дескриптор.

<!--

Все, что находится между первой и последней треугольной скобкой

считается комментарием.

-->

2) Парный дескриптор <COMMENT> .

------------------

</COMMENT>

Браузеры игнорируют “обычные” средства форматирования текста,

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

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

средства физического и логического форматирования.

К физическим относятся дескрипторы, которые определяют напрямую

внешний вид текста.

К логическим относятся дескрипторы, которые определяют логический

статус (значение) текста.

Физические средства форматирования.

1.Одиночный дескриптор <br> - перевод строки (разрыв строки)

2.Парный дескриптор <nobr>…</nobr> - запрещает разрыв текста,

находящегося в контейнере. Данный дескриптор еще называют

дескриптор жесткого переноса.

По причине различных условий, в которых отражается HTML документ

(разные браузеры, видеорежимы, разрешение экрана) HTML документ

может отображаться с нарушением взаимного расположения элементов.

0x08 graphic

3. Одиночный дескриптор <wbr> - определяет место мягкого

переноса. Данный дескриптор используется совместно с дескриптором

<nobr> и размещается внутри его контейнера.

Браузер осуществляет перенос в соответствии с этим дескриптором

только в том случае, если строчка не помещается в ширину окна и

обычный перенос запрещен с помощью дескриптора <nobr>.

4. Парный дескриптор<p>…</p> - параграф или абзац. Текст,

находящийся внутри дескриптора оформляется в виде параграфа или

абзаца.

Атрибут ALIGN= выравнивание текста.

Возможные значения:

* =LEFT - по левому краю.

* =CENTER - по центру.

* =RIGHT - по правому краю.

5. Парные дескрипторы заголовка.

Бывают шести уровней:

… … …

Текст заголовка выравнивается, до и после текста интервал.

Допустимо использование атрибута ALIGN.

Данные дескрипторы имеют большое значение для повышения

информационной ценности документа в ”глазах” поисковой системы.

(Дескрипторы заголовка - один из основных инструментов для

повышения ценности).

6. Дескриптор <HR> - одиночный горизонтальный дескриптор.

Там где находится данный дескриптор, отображается горизонтальная

черта.

Атрибуты:

* ALIGN

* COLOR -цвет черты (значения как у background).

* WIDTH - ширина линии (в пунктах).

* SIZE - толщина линии (в пунктах).

* NOSHADE - без тени.

7. Парный дескриптор <FONT>…</ FONT >.

Предназначен для определения шрифта (начертания) отображаемого

текста (курсив и так далее).

Атрибуты:

* FACE - название шрифта.

Пример:

FASE=”Times New Roman”

Текст, который помещен внутри контейнера будет отображен данным

шрифтом. В связи с тем, что сложно угадать есть ли у пользователя

такой же шрифт, допускается перечисление нескольких шрифтов через

запятую в дескрипторе.

* COLOR

* SIZE=3 - по умолчанию. (Размер символов может быть от 1 до

7).

8.Одиночный дескриптор <BASEFONT>

Данный дескриптор устанавливает базовое значение текстовых

значений Web страниц, находящихся после <BASEFONT>. Атрибуты как

у дескриптора <FONT>.

9. Парный дескриптор <PRE>…</ PRE > - дескриптор пре

форматирования.

Используется для форматирования текста стандартными способами

(табуляцией, последовательностью пробелов и так далее).

Пример:

<PRE>

_ _ _ _ _ _ _ _ _ _ _ _ _ _

|_ _ _ _ _ _ _|_ _ _ _ _ _ _|

</PRE>

10. Парный дескриптор <DIV>…</ DIV >

Используется для выравнивания группы элементов таблицы (группа -

несколько текстовых или графических элементов). Все, что внутри

таблицы выравнивается.

Пример:

<DIV>

Align

</DIV>

10. Парный дескриптор <Center>…</ Center >

Все содержимое контейнера данного дескриптора выравнивается по

центру.

Советы по форматированию текстовых фрагментов

1.Использовать мягкий контраст между фоном и текстом (например,

черный и белый).

2.Использовать как можно меньшее число шрифтов (2-3). Принято для

отображения заголовков использовать шрифты типа Arial (то есть

без засечек), а шрифты с засечками для самого текста (например,

ТАЙМС).

3.Реже используйте выделения, подчеркивания и жирные шрифты.

Существуют так же дескрипторы:

1. <b>…</b> - выделяет текст в контейнере с помощью жирного

шрифта.

2. <i>…</i> - выделяет текст в контейнере с помощью наклонного

текста (курсив).

Пример логического форматирования.

1) Парный дескриптор <CITE>…</ CITE >

Используется для цитат. Обычно браузером отображается в виде

курсива (наклонного текста).

2) Парный дескриптор <BLOCKQUOTE>…</BLOCKQUOTE>

Используется для выделения больших цитат. (Браузер обычно делает

отступ от левого края).

В большинстве случаев браузер не допускает пересечение

дескрипторов.

Пример пересечения:

<PRE>

<FONT>

</ PRE >

</ FONT >

(В лучшем случае просто не запустится).

Но есть и исключения, например <b>…<i>…</b>…</i>

В том месте, где пересеклись дескрипторы <i> и <b>, текст будет

выделен жирным курсивом.

3) Парный дескриптор <U>…</U> - подчеркивание.

Специальные символы

Используются для отображения символов, которые являются в HTML

управляющими и не могут быть отображены обычными способами.

Например, (>) - больше или (<) - меньше. Браузер ее воспринимает

как начало контрольной последовательности.

Для того чтобы все-таки отобразить эту скобку необходимо набрать

последовательность:

1. < - отобразится левая скобка.

2. > - отобразится правая скобка.

3. © - отобразится значок авторского права.

4. ° - отобразится значок температуры.

5. отобразится символ пробела (жесткого пробела). Если

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

разрыв строки не допускается, так как браузер будет видеть

слова и пробелы как одно слово.

Сложное форматирование

В отличие от простого форматирования символов и абзацев в HTML

сложное форматирование производится с помощью многоуровневых

конструкций, основу которых составляет дескриптор, задающий

способ форматирования (список, таблица) и элементы более низкого

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

Пример:

<OL>

</OL>

Данная конструкция формирует нумерованный список, при этом

дескриптор <OL> является дескриптором, который определяет способ

форматирования. В браузере отобразится:

1.abc или a. abc

2.def b. def

1. Парный дескриптор <LI>…</LI> (от английского слова List -

список) используется для отображения элементов списка. Атрибутов

не имеет.

2. Парный дескриптор <OL>…</OL> - формирует нумерованный список

(или упорядоченный).

* Изменение способа нумерации производится с помощью атрибута

TYPE.

Например:

<OL TYPE=[1/a/A/I] , где

1 - арабские цифры.

а - прописные буквы.

А - заглавные буквы.

I - римские цифры.

* Атрибут START позволяет указать номер, с которого начинается

нумерация.

Например, если START=3, то нумерация начнется с трех или с буквы

“c”.

2. Парный дескриптор <UL>…</UL>

Формирует не упорядоченный список (маркерный).

* abc

* def

Например:

</UL>

Где disc - жирная точка; square - квадрат; circle - не

закрашенная окружность.

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

Многоуровневые списки.

Например:

<UL>

</UL>

Отобразиться:

* abc

* def

* ghi

Браузер будет делать очередной отступ слева.

Таблицы.

1. Парный дескриптор <TABLE>…</TABLE>

В его контейнере должны быть сформированы элементы таблицы

(ячейки) в которых и будет информация.

2. Парный дескриптор <TR>…</TR> - формирует строку таблицы.

3. Парный дескриптор <TD>…</TD> - формирует ячейку внутри строки.

Пример:

<TABLE>

+-------------------------+

| <TD>1</TD> | <TD>2</TD> |

|------------+------------|

| <TD>3</TD> | <TD>4</TD> |

+-------------------------+

</TABLE>

Атрибуты дескриптора <TABLE>:

* Атрибут WIDTH - определяет ширину таблицы (в процентах или

пикселях).

Пример:

* Атрибут HEIGHT - высота (принимает такие же значения, как и

атрибут WIDTH).

* Атрибут ALIGN - выравнивание таблицы по ширине относительно

краев окна.

* Атрибут BORDER - определяет ширину рамки (если значение

данного атрибута 0, то рамки отсутствуют).

* Атрибут bgcolor - для формирования фона таблицы с помощью

цвета.

* Атрибут background - для формирования фона таблицы с

помощью картинки.

* Атрибут cellpadding - для указания отступов от краев ячейки

(в пикселях).

* Атрибут cellspacing - расстояние между ячейками.

0x08 graphic

Обычная таблица

+---------+

|----+----|

+---------+

0x08 graphic

* Атрибут bordercolor - цвет границ ячеек (рамки).

Атрибуты дескриптора <TR>:

1. Атрибут ALIGN - выравнивание текста в ячейках.

2. Атрибут VALIGN - определяет вертикальное выравнивание

текста в ячейках.

Возможные значения атрибута VALIGN:

* =TOP - по верху.

* =MIDDLE - по центру.

* =BOTTOM - по нижнему краю ячейки.

3)Атрибут bgcolor - для указания фона строки.

Атрибуты дескриптора <TD>:

* Атрибут ALIGN.

* Атрибут VALIGN.

* Атрибут bgcolor.

Вышеперечисленные атрибуты действуют так же, как для дескриптора

<TR>.

Дополнительно атрибуты:

* Атрибут COLSPAN - объединение ячеек, находящихся в одной

строке. Значение атрибута равно количеству близлежащих ячеек

находящихся в одной строке, которые будут объединены.

Пример:

<TABLE>

+-------------------------+

| <TD COLSPAN=2>1</TD> |

|-------------------------|

| <TD>3</TD> | <TD>4</TD> |

+-------------------------+

</TABLE>

* Атрибут ROWSPAN - объединение ячеек, находящихся в одном

столбце. Значение атрибута указывает количество близлежащих

ячеек находящихся в одном столбце, которые будут объединены.

Пример:

<TABLE>

+--------------------------------------------+

| |<TD>2</TD>| |

| <TD ROWSPAN=2>1</TD> |----------+----------|

| | |<TD>4</TD>|

|----------------------| |----------|

+--------------------------------------------+

</TABLE>

Форматирование текстовых фрагментов HTML документа

Кроме ширины и высоты таблицы в целом можно регулировать ширину и

высоту ячеек (то есть использовать такие же атрибуты в

дескрипторе <TD>, в пикселях и в процентах).

Если они не указаны, то браузер выравнивает размер ячейки по

ширине текста.

Таблица является наиболее часто употребляемым инструментом в Web

дизайне, позволяющим точно разместить на таблице отдельные

мультимедийные элементы. Подобно спискам, таблицы могут быть

вложены в другие таблицы.

Пример:

+---------+

|----+----|

+---------+

Чтобы добавить такую таблицу в контейнере дескриптора ячейки

пишут следующее:

<TD>

<TABLE>

</TABLE>

<TD>

Фон отдельных ячеек могут отображать не все браузеры.

Размещение графических изображений в HTML документе

Для размещения изображений используются в основном два

графических формата:

* JPG

* GIF

1.Формат JPG.

Плюсы - Графическое изображение, сохраненное в данном формате,

имеют наименьший объем.

Минусы - при сохранении происходит довольно сильное сжатие

картинки, а при сжатии изображение теряет качество и наблюдается

эффект пикселизации.

Пример:

Картинка сжалась в девять раз.

+---+

|-++|

|---|

+---+

Девять пикселей заменяются одним пикселем среднего цвета.

Изображение сохраняется в формате .jpg в том случае, если

необходимо сохранить максимальное количество оттенков.

2.Формат GIF.

При сохранении картинок в этом формате также происходит сжатие,

но пикселизации не происходит.

Минусы - изображение сохраняется с помощью ограниченного

количества цветов (обычно 256 цветов) => изображение будет не

очень красочным.

С помощью формата .gif сохраняются навигационные кнопки,

навигационные графические элементы и фоновые изображения.

Для внедрения изображения используется одиночный дескриптор

<IMG>.

* Атрибут SRC - основной атрибут. Он указывает путь и имя

файла, в котором содержится графический элемент.

Пример:

* Атрибут WIDTH - ширина внедряемого изображения (в пикселях).

* Атрибут HEIGHT - высота внедряемого изображения (в

пикселях).

* Атрибуты VSPACE, HSPACE - устанавливают отступ текста от

внедряемого в HTML документ изображения.

* Атрибут BORDER - задает толщину рамки вокруг изображения.

* Атрибут ALT - задает альтернативный текст, который

появляется в том месте, где должны быть картинки.

Пример:

ALT=”Здесь была картинка”.

Обычно атрибут используют при размещении навигационных

изображений (ссылок), а так же при размещении изображений, о

которых надо дать знать поисковой системе.

* Атрибут ALIGN - выравнивание.

Возможные значения:

=LEFT, CENTER, RIGHT.

Добавляются значения: =TOP, MIDDLE, BOTTOM.

* Если не используются атрибуты WIDTH, HEIGHT, то изображение

внедряется оригинального размера.

Если используется только один атрибут, например HEIGHT, то

браузер уменьшит или увеличит ширину пропорционально изображению.

Использование гипрессылок

Гипрессылка - это URL адрес того документа, который привязан к

одному из элементов Web страницы (текстовому или графическому).

Для внедрения ссылок в HTML документ применяется парный

дескриптор <A>…</A>.

Пример:

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

(текстовый фрагмент или графический элемент).

</A>

В результате на экране отображается подчеркнутый выделенный

текст.

Пример привязки к изображению:

<A>

</A>

Изображение, к которому привязывается ссылка, называется

навигационной картинкой (изображением).

В случае привязки к картинке ссылки вокруг картинки формируется

рамка (чаще всего синего цвета). Чтобы ее убрать, необходимо

указать:

Значением атрибута HREF может быть абсолютный адрес (URL адрес)

или относительный адрес (имя файла, в котором хранится HTML

документ, указываемый с помощью ссылки). Например, HREF=”1.htm”.

Браузер будет искать данный документ в текущей папке, то есть в

той, в которой находится активный документ.

Исключение составляет дескриптор <BASE>

В случае использования данного дескриптора в заголовке HTML

документа (то есть контейнера HEAD)относительные адреса

(указанные в виде значений HREF) будут восприниматься браузером

не относительно текущей папки, а относительно URL адреса,

указанного в значении атрибута URL.

Использование дескриптора <A>…</A>

для указания отдельных элементов HTML документов.

1. Атрибут NAME используется для указания места, до которого

необходимо пролистать

HTML документ.

Пример:

</A>

В этом случае внутри дескриптора <A> находится якорь - это

элемент HTML документа, который может быть адресован с помощью

гиперссылки. Якорь не выделяется браузером.

Для того чтобы с помощью ссылки адресоваться к якорю надо после

URL адреса добавить # и указать имя якоря.

Пример:

Название якоря может формироваться без указания URL адреса HTML

документа.

Пример:

Данный якорь будет искаться в текущей папке.

При использовании абсолютного адреса необходимо использовать

аббревиатуру http (например, http://www.kirov.ru).

HTML форма

Форма (в документе HTML) - это средство, позволяющее организовать

диалог пользователя и Web сайта.

Основные виды HTML форм:

1. Кнопки.

2. Списки.

3. Текстовые поля.

4. Переключатели (флажки).

5. Радиокнопки.

Элементы управления HTML форм позволяют пользователю вводить

информацию с помощью браузера и отправлять её на обработку Web

сайту.

Для обработки форм, заполненных пользователем, на Web сайте

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

программа формирует HTML код.

Группа дескрипторов, формирующих HTML форму.

1. Парный дескриптор <FORM> - задает свойство формы и содержит в

своем контейнере элементы этой формы.

Атрибуты:

* Атрибут NAME - для задания имя формы.

Например, NAME=”anketa”.

! Каждый элемент HTML формы, как и сама форма, должны быть

обязательно поименованы.

* Атрибут METHOD - определяет, каким способом HTML форма будет

отправляться к программе-обработчику.

Есть два варианта:

1)=POST - используется чаще всего.

2)=GET - используется для отправки HTML формы с помощью URL

адреса.

(По умолчанию задается метод GET).

* Атрибут ACTION - задает местоположение

программы-обработчика. Значением атрибута служит адрес

(абсолютный или относительный).

Например,

ACTION=”executive.php” - файл, в котором хранится

программа-обработчик.

Или ACTION=“mailto:a@kirov.ru” - пользовательская форма будет

отсылаться по указанному электронному адресу.

* Атрибут ENCTYPE - тип кодировки.

Варианты:

=”text/htm/”

=”text/plain” - обычный текст без элементов форматирования.

Элементы HTML форм

1.Текстовые поля.

Бывают двух видов:

1. Многострочное. Парный дескриптор <TEXTAREA>…</TEXTAREA>

Атрибуты:

* Атрибут NAME.

* Атрибут ROWS - высота поля в строчках.

* Атрибут COLLS - ширина поля в символах.

Размещенный в контейнере дескриптора <TEXTAREA> текст будет

отображаться внутри этого текстового поля (по умолчанию).

0x01 graphic

2. Однострочное. Формируется с помощью одиночного дескриптора

<INPUT>.

(Данный дескриптор также используется для переключателей,

радиокнопок).

Атрибуты:

* Атрибут NAME.

* Атрибут TYPE - задает тип создаваемого элемента. Для

создания однострочного поля значение атрибута TYPE=”Text”.

* Атрибут SIZE - ширина поля в символах.

* Атрибут MAXLENGTH - максимальная длина вводимого текста.

* Атрибут VALUE - используется для хранения значения элемента

формы.

Пример:

Мы можем задать значение поля по умолчанию VALUE=”Например, пошел

дождь”.

0x01 graphic

2.Переключатель или флажок.

0x01 graphic

Формируется с помощью дескриптора <INPUT>, атрибут TYPE

которого принимает значение TYPE=”CHECKBOX”.

У данного дескриптора имеются также атрибуты:

* Атрибут NAME.

* Атрибут CHESKED - если он указан, то флажок будет

установлен.

3.Радиокнопка.

(Выглядит как жирная точка).

Достигается с помощью двух дескрипторов <INPUT>, имеющих

одинаковое имя. Например, NAME=”1”.

0x01 graphic

4.Текстовое поле типа пароль.

Данный дескриптор формирует текстовое поле типа пароль. Работает

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

в виде звездочек.

0x01 graphic

5.Кнопка.

* <INPUT TYPE=”BUTTON”>

Используется для вызова клиентских скриптов (сценариев).

Выглядит так:

0x01 graphic

* Кнопка созданная с помощью:<INPUT TYPE=”SUBMIT”

VALYE=”Пуск”> предназначена для отправки формы на обработку

в Web сайт.

Выглядит так:

0x01 graphic

* Кнопка сброса формы.

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

Выглядит так:

0x01 graphic

6.Списки выбора (меню) - это многоуровневая конструкция.

Парный дескриптор < SELECT >…</ SELECT > (дескриптор первого

уровня) формирует свойства меню.

Атрибуты:

* Атрибут NAME.

* Атрибут SIZE.

* Если данный атрибут равен единице, меньше единицы или

не указан, то формируется выпадающее меню.

Выглядит так:

0x01 graphic

* Если SIZE больше единицы, то формируется прокручиваемый

список.

Выглядит так:

0x01 graphic

Внутри контейнера дескриптора<SELECT> находятся элементы меню,

которые формирует одиночный дескриптор <OPTION> (дескриптор

второго уровня).

Пример:

<OPTION>Файл

<OPTION>Печать

</SELECT>

Ширина меню определяется максимальным значением элемента меню.

* Атрибут MULTIPLE - для выбора нескольких разных опций.

Советы преподавателя:

1. Размещать каждый дескриптор с новой строки.

2. Перед большими конструкциями делать интервал.

HTML форма отсылается на обработку Web сайту в виде записей,

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

Имя элемента формы(Name) = значение(Value).

Для списков, переключателей, кнопок, радиокнопок обязательно

задавать значение атрибута Value. В остальных случаях значение

задает пользователь (во время ввода). В случае если при

формировании элементов формы типа переключатель (флажок) атрибут

Value не используется, в качестве значения будет формироваться

предлог On.

Для списков таковым значением по умолчанию будет назначаться

текст, расположенный сразу после дескриптора <OPTION>.

Если вы используете элемент Web формы для передачи информации Web

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

Имя элемента формы = его значение.

История создания Internet

Толчком к созданию сети Internet послужила холодная война.

Первые разработки по созданию глобальных компьютерных сетей были

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

разработок DARPA (агентство было создано в 1957 году).

В 1965 году состоялся первый сеанс удаленной связи между

компьютерами. Был выделен специальный проект по созданию сети

ARPANET (прообраз сети Internet).

В 1969 году были созданы первые маршрутизаторы, благодаря этому в

этом же году было создано четыре узла маршрутизации, которые

позволили в полной мере реализовать ту модель ГВС, которая была

изначально принята за основу при создании сети ARPANET.

В 1972 году был запущен стандарт, регламентирующий основу

транспортного протокола TCP.

В этом же году появились первые сервисы:

* TELNET (1972).

* FTP (1973).

С помощью этих сервисов пользователь получает удаленный доступ к

командной строке сервера. Для передачи сообщений использовали

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

протокол FTP.

В 1977 году появился стандарт на сервис электронной почты SMTP.

В 1983 году произошло официальное внедрение протокола TCP/IP.

В результате расширения сети было принято решение о передаче

координации проекта ARPANET из обороны науке. И проект был

переименован в NSFNET.

В середине 80-х к NSFNET подключились британская сеть, затем

канадская, финская и другие.

В 1993 году к Internet присоединилась Россия, и был образован

домен .ru

В 1991 году был создан сервис Gopher - прообраз Web сервиса.

Основные организационные структуры,

координирующие работу Internet

После выхода Internet за национальные рамки основная роль по

управлению сетью была передана Всемирной общественной организации

по назначению имен и чисел - ICANN.

Инженерная организация по развитию Internet - IETF.

Основная задача: Развитие старых и создание новых сетевых

стандартов.

Развитием Web стандартов занимается W3C.

IOSC - интернет сообщество. Основная задача - развитие

содержательной части, правовые вопросы.

РСИЦ - региональный сетевой информационный центр (в России). Этот

центр занимается разработками, опираясь на стандарты четырех

вышеперечисленных организаций.

В каждой стране есть такой центр.

Листы каскадных стилей или CSS

CSS - это набор правил для оформления и форматирования различных

элементов HTML документов.

Правила подключения стиля к конкретному HTML документу:

1) С помощью одиночного дескриптора <LINK>.

<LINK REL=”Stylesheet” TYPE=”text/css” [MEDIA=”SKREEN”]

HREF=”URL”>

MEDIA - среда, в которой будут работать стили.

При задании значения атрибуту MEDIA правила будут действовать

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

MEDIA=”PRINT” - печать.

MEDIA=”SCREEN” - экран.

2) При помощи парного дескриптора <STYLE>…<STYLE>.

<STYLE TYPE=”text/css” [MEDIA=”…”]>…</STYLE>.

В контейнере дескриптора <STYLE> располагаются правила,

определяющие свойства отдельных элементов страницы.

3) Определение стиля непосредственно внутри элемента страницы.

<P STYLE=”…”>…</P>.

4) Использование пользовательских стилей (то есть с помощью

настроек браузера).

Правила описания стилей

Правила описания стилей - это команды, определяющие свойства HTML

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

CSS гораздо больше, чем стандартный HTML набор.

Синтаксис:

P {text-align:right; color:red}, где

P - класс HTML документов, которые будут подвергаться

форматированию (то есть к которым будет применяться стиль).

Набор таких правил у нас может храниться в отдельном файле, могут

находиться в контейнере дескриптора <STYLE>.

Например,

P.krass{color:red} - все параграфы класса krass будут красного

цвета.

P:first-letter {color:red; font-size:300%; float:left}, где

first-letter - имя псевдонима. (Здесь первая буква).

P.krass:first-letter

A:visited {color:red; font-size:300%; float:left}

A:active

first-line

Псевдокласс - это множество HTML элементов, описываемых

непосредственно спецификацией CSS.

#111{color:red} ,где #111 -идентификатор элемента.

Атрибут ID служит для присваивания идентификатора элементу.

Пример:

Так можно накладывать элементы друг на друга:

#111{top:10; left:100; width:100; height:200; width:100;

height:200; z-index:2}

Координата z определяет место (порядок) элемента.

Каскадный приоритет - это порядок, в котором правила,

определяющие конкретные стили будут применяться.

1) На первом месте правила, определенные атрибутом STYLE.

2) Правила, определяемые с помощью стилей.

Например, P.1{…}.

3) Правила, определяющие стили для дескрипторов определенного

типа.

Например, P {text-align:right; color:red}

Подключение стилей с помощью дескриптора <STYLE> является более

важным, чем подключение стилей с помощью дескриптора LINE.

Чтобы придать акцент (приоритет) определенному правилу

используется important.

Пример:

P {text-align:right !important}- искусственное изменение

приоритета.

4) На последнем месте каскадного приоритета (то есть наименьшие

по важности) правила определения стилей указываемых пользователем

с помощью браузера.

P, H1, DIV {…} - эта конструкция используется для одновременного

присвоения свойств сразу нескольким классам.

XML - расширяемый язык разметки

Расширяемый язык разметки XML предназначен для описания

внутренней логической структуры документа.

<ТЕМА>информация</ТЕМА>

В качестве команд языка HML используются элементы. Элемент

начинается так же, как и дескриптор:

<название элемента>содержимое элемента</название элемента>

!Элемент всегда заканчивается закрывающимся тэгом. Одиночных

элементов (как в HTML) не бывает.

При указании элементов могут использоваться атрибуты (свойства)

элемента. В отличие от атрибута HTML, значения атрибутов

обязательно должны заключаться в кавычки.

Иерархическая структура документов.

Все элементы XML документа должны располагаться в строгой

иерархической последовательности. Обязательно должен быть один

корневой элемент, от которого иерархическое дерево растет и

изветвляется.

Пример:

<?XML version=”1.0” encoding=”windows-1251”?>

<PREDMET_LIST>

<PREPOD>Выдрин А.Л.</ PREPOD >

<TEMY_LIST>

<TEMA>Информация</TEMA>

< TEMA >Структура Интернета</ TEMA >

… … …

</ TEMY_LIST >

</ PREDMET >

</ PREDMET_LIST >

Основное свойство HML - его расширяемость. Создатель документа

может использовать для обозначения элементов любые названия,

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

Для определения смысла отдельных элементов HML документа

используются специальные конструкции DTD - определители типа

документов, которые определяют не только логический смысл

элемента (дают комментарии по поводу описания использования

элемента), но и жестко определяют структуру элемента.

Синтаксис данных определителей типа документов достаточно сложен

и напоминает отдельный язык разметки (или язык программирования).

! Синтаксис достаточно строг. Нельзя делать ошибки.

DTD используются так же, как эталоны для проверки правильности

XML документов.

Для задания внешнего представления XML документа используются

стили. Основная нагрузка XML документа - содержание.

<?xml-stylesheet type=”text/css” ref=”1.css”?>

Классификация Web ресурсов

+-----------------+

| 0x08 graphic ||

| Навигационные ||

| сайты ||

|-----------------|

| 0x08 graphic |

| Конечные (или |

| функциональные) |

| сайты |

+-----------------+

0x08 graphic

+----------------+

| Информационные |

| |

| (тематические) |

| |

| сайты |

|----------------|

| Корпоративные ||

| ||

| сайты ||

+----------------+

+--------------+

|Каталоги | |

|------------+ |

| Поисковые | |

| | |

| системы | |

|-------------+|

| Сайты ||

| ||

| электронной ||

| ||

| коммерции ||

|--------------|

| Сайты, |

| являющиеся |

| |

| Web |

| интерфейсами |

| |

|сетей Internet|

|--------------|

|Порталы | |

+--------------+

Навигационные сайты - перенаправляют пользователей к конечным

сайтам (указующая и направляющая роль). Например, порталы Яндекс,

Кирилл и Мифодий и прочие.

Портал - это Web сайт, сочетающий в себе функции навигационного

сайта и информационного ресурса по различным темам.

Конечный (функциональный) сайт - это сайты или ресурсы, которые

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

приходят в глобальные сети (Internet).

Информационные сайты - обеспечивают доступ пользователей к

документам определенной тематики.

Корпоративные сайты, а так же сайты электронной коммерции - дают

доступ к коммерческой информации (информации о товарах, услугах,

производителях), а также возможность удаленного заказа, оплаты и

приобретения товаров и услуг.

Web интерфейс - это сайты, которые через стандартные HTML

страницы (Web страницы) предоставляют доступ к сервисам Internet

(электронной почты, телеконференций и другим).

Роль последней группы сайтов очень велика.

Семинарские занятия

1) Знакомство с Internet (чтение учебника). Подключится к

серверу.

2) Создание учетных записей. Создание оригинального сообщения.

3) Получить ваше сообщение. Создать правила для сообщений почты в

отношении названных вами сообщений.

4) Получить ваше сообщение, создать ответ и отправить сообщение.

Перенаправить ваше сообщение вам и еще кому-нибудь, присоединив к

нему файл.

5) Подписаться на группу новостей.

6) Создание запросов. Найти в документах данные вами слова и

фразы.

7) Создать HTML документ. В заголовке использовать дескрипторы

<title>, <meta> (с атрибутами http-equiv, name, content). В теле

опробовать действие атрибутов bgcolor, background, text, link,

vlink, alink, topmargin, leftmargin.

8) Форматирование текста. Создать HTML документ. Скопировать

текст. Попробовать действие дескрипторов <!>,<comment>, <br>,

<nobr>, <wbr>, <p> (с атрибутом align), заголовка от <h1> до <h6>

(с тем же атрибутом), <hr> (с атрибутами align, color, width,

size, noshade),< font> (атрибут face, color, size),< basefont>

(атрибуты как у font), <pre>(в его контейнере создать таблицу

стандартными средствами форматирования), <div>, <center>.

9) Форматирование текста. Создать HTML документ. Скопировать

текст. Попробовать действие дескрипторов <b>, <i>, <cite>,

<blockquote>, <u>. Отобразить символы символов < (левая

° (значок температуры), (жесткий пробел).

10) Сложное форматирование. Создать HTML документ. Создать

нумерованный и маркерный списки. То есть попробовать действие

дескрипторов <ol> (атрибуты type, start), <li> ,<ul> (атрибут

type). Создать многоуровневый список.

11) Сложное форматирование. Создать нарисованную на доске

таблицу. Поменять ее размеры, ширину рамки, фон, расстояние между

ячейками, цвет ячеек и их границ, выравнивание в ячейках.

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

12) Внедрение графического изображения. Создать HTML документ.

Скопировать текст. В тексте поместить картинки, как показано на

доске. Использовать дескриптор <img> (атрибуты src, width,

height, hspace, vspace, border, align, alt).

13) Создание ссылок. Создать три HTML документа. Связать их между

собой с помощью ссылок, предусмотреть возможность перемещения

обратно. Используем дескриптор <A> атрибуты href, name.

14) Скачать с компьютера преподавателя картинки и расположить их

так, чтобы получился лабиринт (смотри на доску).

15) HTML форма. Проверить действие дескрипторов <form> (атрибуты

name, method, action, enctype), <textarea> (атрибуты name, rows,

colls), <input>(атрибут name, и всевозможные значения атрибута

type с соответствующими каждому элементу формы возможными

атрибутами), <select>(атрибуты name, size, option)

16) HTML форма. Создать изображенную на доске форму заказа,

заполнить ее и отправить ее на обработку в Web сайт. Проверить

соответствие HTML кода и данных формы.

17) Листы каскадных стилей. Создать HTML документ. В него

скопировать текст и поместить два рисунка (один на другой).

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

стилей.

18) Листы каскадных стилей. Создать HTML документ. В него

скопировать текст создать правила, указанные на доске. Подключить

стили. Поменять приоритет стилей.

19)XML. Создать XML документ, описывающий структуру HTML

документа.

клиент

узел

сервер

файл

Клиентский компьютер

Программа клиент

Запрос

Пакет1

Пакет2

Пакет3

С3

С2

С5

С4

файл

Сервер, содержащий информационный ресурс

сервис

Сервис 1

(обеспечивает доступ к информационному ресурсу)

Папка f1

Папка f2

Отправитель

Компьютер пользователя

IP 1

IP 2

SMTP

POP3

Папка user

Пользователь

Сервер новостей News

SMTP сервис

POP3 сервис

Web интерфейс

Почтовый сервер

ПК пользователя

Браузер

Web сервис

Специализированный сервис

Поисковая система

Например, принтер

Например, хранение данных

Internet

Web интерфейс

СУБД

База адресов

База ключей

Если значение атрибута больше нуля,

то таблица выглядит так:

Страницы: 1, 2