Методика обучения теме "Создание Web-страниц с помощью языка HTML" в курсе информатики для слабослышащих школьников 11-х классов (стр. 7 из 16)

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

Полный адрес документа в сети называется URL (UniformResourceLocator; принято читать ˝урл˝), URL может состоять из следующих частей:

- префикс протокола, то есть, указание на используемую сетевую службу. Основные протоколы, с которыми Вы столкнетесь:

- httr:// - основной протокол, обеспечивающий доступ к Web

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

- ftr:// - протокол передачи файлов FTR, позволяющий при

помощи программы FTR- клиента обмениваться файлами с удаленным компьютером.

- mailto; - доступ к электронной почте. Вслед за mailto: указывается

адрес электронной почты, имеющий общий вид

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

- file:// - указывается вместо имени протокола при обращении к Web-странице, расположенной на локальной машине.

- доменное имя компьютера или его IP-адрес вместо доменного имени. Например, сервер МТУ-Интел имеет доменное имя www.intel.ru и IP-адрес 195.34.32.11;

- номер порта, через который происходит взаимодействие с сервером. Перед номером порта ставится двоеточие. С точки зрения пользователя указание порта бывает полезно, например, для ˝принудительной˝ перекодировки документа. Так. Адреса http://www.newmail.ru:8100 и http://www.newmail.ru:8101 адресуют один и тот же сервер, но в первом случае документ читается в кодировке KOI-8, а во втором - в кодировке Windows. Вообще же, номер порта включается в URL только при нестандартных настройках сервера;

- имя файла на сервере, которое может включать и путь от корневого каталога сервера. В записи пути по дереву каталогов сервера используется символ ‘/’ , а не ‘\’, как принять в Dos и Windows. Корневой каталог на сервере – совсем не обязательно ˝ головной ˝ каталог ˝диска˝, как на локальной машине, а при соединении с сервером мы получаем доступ не ко всем его папкам и файлам, а только к тем, которые на нем специальным образом ˝размещены˝ и открыты для просмотра через WWW.

- закладка, позволяющая перейти в нужную часть документа. Имя закладки отделяется от имени файла символом ˝#˝.

В целях совместимости имена файлов, размещаемых в Интернет, обычно строятся по правилам DOS- то есть, состоят из латинских букв, цифр и символа подчеркивания и имеют длину не более 8 символов. С другой стороны, web-страницы принято давать расширение *.html, а не *.hml.

Следует помнить, что URL чувствителен к регистру символов, то есть, http://www.TNT.ru и http://www.tnt.ru – это не один и тот же адрес.

Если в URL не указано имя html- файла, это означает, что документ имеет имя по умолчанию, которое может назначаться при администрировании сервера. Чаще всего это имя index.html, так что URLhttp://www.host.ru может означить то же самое, что http://www.host.ru/ index.html.

Ссылки бывают:

- абсолютная- ссылка, в которой указан полный URL документа.

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

Интернет, URL которых известен нам и не меняется.

- относительная – ссылка, которая ссылается на документ, опуская общую адресную часть. Например, если из документа index.html нужно сослаться на документ test.html, находящийся в той же папке, это можно сделать ссылкой вида:

<A HREF =˝test.html˝>документ test.html </A>

При использовании относительной ссылки можно ссылаться на папки, которые являются как вложенными, так и родительскими по отношению к папке, в которой расположен исходный документ.

Например, ссылка на рисунок с именем my.jpg, находящийся во вложенной папке images может иметь вид:

<A HREF =˝ images/ my.jpg ˝>посмотритерисунок </A>

- внутренняя – ссылка предназначена для навигации в пределах документа. Они имеют вид:

<AHREF =˝ #закладка˝>якорь ссылки </A>

Для создания закладки служит тег вида:

<AHREF =˝ закладка ˝>якорь закладки </A>.

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

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

Далее рассмотрим одну из наиболее употребляемых форм представления данных.

обучение информатика гипертекст школьник

§2.1.5 Списки

HTML поддерживает нумерованный и маркированный списки.

Рассмотрим каждый из них.

Маркированный список.

- <UL>…<UL> - служит для создания маркированного списка. Внутри него располагаются все элементы списка.

Параметры тега:

- COMPACT – указывает браузеру, что список надо выводить в компактном виде.

- TYPE= ˝значение˝ - указывает вид маркера:

- circle – отображается закрашенными кружочками.

- disk - отображается не закрашенными кружочками.

- square - отображается закрашенными квадратами.

- <LI>…</LI> - заключает каждый элемент списка. Этот тег закрывать необязательно.

Отображение браузером маркированного списка показано на рисунке 5, а запись документа на языке HTML выглядит так:

<HTML>

<HEAD>

<TITLE>Маркированныйсписок </TITLE>

</HEAD>

<BODY>

<UL TYPE="square">

<B>Знакизодиака: </B>

<LI>Овен</LI>

<LI>Телец</LI>

<LI>Близнецы</LI>

<LI>Рак</LI>

<LI>Дева</LI>

<LI>Весы</LI>

<LI>Скорпион</LI>

<LI>Стрелец</LI>

<LI>Козерог</LI>

<LI>Водолей</LI>

<LI>Рыбы</LI>

</UL>

</BODY>

</HTML>

Рис.5. Отображение браузером маркированного списка

Нумерованный список.

- <OL>…<OL> - служит для создания нумерованного списка. Внутри него располагаются все элементы списка.

- Параметры тега:

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

компактном виде.

- TYPE= ˝значение˝ - указывает вид маркера:

- А – отображается в виде прописных латинских букв.

- а – отображается в виде строчных латинских букв.

- I - отображается в виде больших римских букв.

- i - отображается в виде маленьких римских букв.

- 1 - отображается в виде арабских цифр.

- START = ˝число˝ - позволяет начать нумерацию с цифры, отличной от 1 или буквы, отличной от A.

- <LI>…</LI> - заключает каждый элемент списка. Этот тег закрывать необязательно.

Для нумерованного списка можно изменить нумерацию, указав в теге

<LI> параметр VALUE= ˝число˝.

Отображение браузером маркированного списка показано на рисунке 6, а запись документа на языке HTML выглядит так:

<HTML>

<HEAD>

<TITLE>Нумерованныйсписок </TITLE>

</HEAD>

<BODY>

<OL>

<P><B>Знакизодиака: </B></P>

<LI>Овен</LI>

<LI>Телец</LI>

<LI>Близнецы</LI>

<LI>Рак</LI>

<LI>Дева</LI>

<LI>Весы</LI>

<LI>Скорпион</LI>

<LI>Стрелец</LI>

<LI>Козерог</LI>

<LI>Водолей</LI>

<LI>Рыбы</LI>

</OL>

</BODY>

</HTML>

Рис.6. Отображение браузером нумерованного списка

Список определений.

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

- <DL>…</DL> - задает списки определений.

- <DT>…</DT> - отмечает определяемый термин.

- <DD>…</DD> - отмечает абзац с его определением.

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

<DL>

<DT> Термин

<DD> Определение термина

</DL>

Параметр тега <DL>:

- COMPACT – указывает браузеру, что список надо выводить в компактном виде.

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

<HTML>

<HEAD>

<TITLE> Список определений </TITLE>

</HEAD>

<BODY>

<DL>

<H1>Виды сетей </H1>

<DT> Локальные сети.

<DD> Объединяют несколько компьютеров, рассоложены в одном здании, дает возможность пользователям совместно использовать ресурсы компьютеров, а также подключенных к сети периферийных устройств(принтер, сканеров, модемов и др.) <BR><BR>

<DT> Региональные сети.

<DD> Объединяют множество компьютеров находящихся на большом расстоянии, в пределах одного региона, города. <BR><BR>

<DT> Корпоративные сети.

<DD>Сети организаций, которые хотят сохранять свою информацию в тайне <BR><BR>

<DT> Глобальные сети.

<DD> Объединяет компьютеры, находящиеся на огромном расстоянии, для общего пользования мировых информационных ресурсов.

</DL>

</BODY>

</HTML>

Рис.7. Отображение браузером списка определений

Комбинированные списки.

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

Рис.8. Отображение браузером комбинированного списка

Запись HTML кода выглядит так:

<HTML>

<HEAD>

<TITLE>Комбинированный список </TITLE>

</HEAD>

<BODY>

<UL>

<B>Спутники некоторых планет</B>

<LI>Земля

<OL>

<LI>Луна

</OL>

<LI>Марс

<OL>

<LI>Фобос

<LI>Деймос

</OL>

<LI>Уран

<OL>

<LI>Ариэль

<LI>Умбриль

<LI>Титания

<LI>Оберон

<LI>Миранда

</OL>

<LI>Нептун