Структура документа

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

<title>Документ</title>

</head>

<body>
</body>

</html>

HTML-документ состоит из двух разделов — заголовка (между тегами <head> и </head>) и содержательной части (между тегами <body> и </body>).

Множество всех тегов HTML можно разбить на следующие группы:

Кратко рассмотрим основные теги этих групп.

Тег !DOCTYPE

Во многих HTML-документах, созданных в специальных редакторах типа Dreamweaver, перед открывающимся тегом <html> нередко можно увидеть тег <!DOCTYPE>, с помощью которого объявляется тип и формат содержимого документа. Однако современные Web-браузеры обрабатывают документы и без него. Ниже приведено содержимое тега <!DOCTYPE>:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Здесь определен тип документа HTML, публичное DTD-описание которого принадлежит организации W3C, соответствует стандарту HTML 4.01 и ориентировано на английскоязычные документы.

Если HTML-документ без тега <!DOCTYPE> открыть в браузере Internet Explorer, а затем выполнить команду Файл -> Сохранить как, выбрав при этом тип файла html, то браузер добавит в сохраняемый файл тег <!DOCTYPE>.

Возможны следующие версии DTD (Document Type Definition — определение типа документа):

Раздел HEAD

Раздел HEAD содержит техническую информацию о странице — заголовке, ее описание и ключевые слова для поисковых машин, данные об авторе и времени создания страницы, базовом адресе страницы и т.д. и расположен в контейнерном теге <head>. В этом теге размещаются также следующие теги:

Тег meta

Информация, содержащаяся в тегах <meta>, не отображается веб-браузером, однако имеет важное значение. Если текст между тегами <title>и</title>используется в качестве текста ссылки на эту страницу, то описание из тега <meta> будет отображено под ссылкой:

Кроме того, тег <meta> позволяет запретить или разрешить индексацию веб-страницы поисковыми машинами:

С помощью тега <meta>устанавливается кодировка текста:

Для автоматической перезагрузки страницы через заданный промежуток времени используется свойство refresh:

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

Тег base

В HTML-документах обычно используются относительные ссылки на ресурсы. Например, в ссылке нередко приводится только имя файла. В этом случае предполагается, что его местоположение совпадает с расположением документа, из которого этот файл вызывается. Однако можно явно указать базовый URL-адрес, который будет использоваться во всех случаях применения относительных ссылок. Это делается с помощью тега <base> с атрибутом href, значением которого является базовый URL-адрес:

<base href = "URL-адрес">

Пример:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Использование тега <base></title>
<base href="http://sevidi.narod.ru/images/">
</head>

<body>
<img src="sv1.gif">
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.

В этом примере графическое изображение имеет относительную ссылку (просто имя файла). Если базовый URL-адрес не был бы указан, то браузер искал бы файл sv1.gif в той же папке, где расположен HTML-документ со ссылкой на него. Поскольку базовый URL-адрес задан, то браузер будет искать файл в папке imagesна узле http://sevidi.narod.ru.

При указании в теге <base> базового URL-адреса относительные ссылки продолжают работать, даже если вы переместите HTML-документ в другую папку. Это обеспечивает определенные удобства с локальной версией HTML-документа в условиях, когда компьютер подключен к сети.

Тег link

Тег <link> предназначен для обозначения связей между документами в больших и сложных по своей структуре узлах. Атрибут href содержит ссылку на другой документ, связанный с текущим. Адрес может быть абсолютным или относительным. Атрибут rel указывает отношения между документами:

Используются также и другие значения для атрибута rel: glossary, help, toc, index, contents.

Пример:
<link href="../../sevidi.css" rel="stylesheet" type="text/css">

В одном и том же HTML-документе тег <link> может присутствовать несколько раз.

Тег style

В контейнерном теге <style> размещаются правила каскадных таблиц стилей, определяющих внешний вид и позиционирование элементов HTML-документа. Более подробно каскадные таблицы стилей будут рассмотрены далее. В одном и том же HTML-документе тег <style>может встречаться несколько раз. При этом они могут размещаться вне тега <head>.

Тег script

В контейнерном теге <script> размещается код сценария (скрипт), выполняемый веб-браузером. В одном и том же HTML-документе тег <script>может встречаться несколько раз. При этом они могут размещаться вне тега <head>. Внутри тега <script>не могут находиться теги HTML и правила каскадных таблиц стилей.

Код сценария может быть написан на языке JavaScript или VBScript. Последний понимает только веб-браузер Internet Explorer. Языком по умолчанию является JavaScript. Созданию сценариев на JavaScript посвящен целый раздел сайта. Но обо всем по порядку.



  • Другие |
назадвверхвперед
Rambler's Top100