HTML
Глава 2. Раздел заголовков.
Раздел документа head определяет его заголовок и не является
обязательным элементом, однако хорошо составленный заголовок может быть весьма
полезен. Задачей заголовка является представление необходимой информации для браузера.
Элементы, находящиеся внутри раздела head (кроме названия документа,
описываемого с помощью элемента title ), не отображаются
на экране.
Заголовок может содержать в себе следующие элементы:
- название документа (элемент
title );
- полный URL документа (элемент
base );
- управляющую информацию (элемент
meta );
- список ссылок (элемент
link );
- описание стилей (элемент
style );
- задание скриптов (элемент
script ).
Элемент head имеет один необязательный атрибут profile ,
указывающий на внешний файл мета-элементов. В качестве значения атрибута задается адрес URL.
Задание элемента head в общем виде выглядит так:
<head profile="URL">
...список элементов заголовка...
...список элементов заголовка...
</head>
Элемент <title>.
Элемент title задает название документа. Этот элемент разметки, строго говоря,
не является обязательным, однако его использование настоятельно рекомендуется. Он присваивает
документу название, независимое от имени файла. Это название отображается в строке заголовка
браузера. Также это имя используется по умолчанию при добавлении документа в папку "Избранное".
Открывающий и закрывающий теги элемента title являются обязательными. Его содержимое
представляет собой текстовую строку неограниченной длины.
Название документа должно кратко характеризовать его содержание. Учитывая это, а также
возможную минимизацию окна браузера, рекомендуется в названии документа ограничиться
50-60 символами. Содержание элемента title не должно включать в себя других
элементов разметки. Например, нельзя с помощью элемента <i> вывести
название документа курсивом, т.е. недопустима запись:
<title><i>Название документа</i></title>
Запись
<i><title>Название документа</title></i>
также неприемлема, так как элемент <i> не является элементом заголовка.
Элемент <base>.
Элемент base используется для явного задания полного URL-адреса документа.
Это бывает полезно ввиду того, что общепринятым стилем задания гипертекстовых ссылок
является относительная их адресация. То есть при задании ссылки на документ указывается
не полный его URL-адрес, а задается его месторасположение относительно текущего адреса.
Так вот элемент base как раз и задает адрес, относительно которого и будут
браться относительные ссылки. Пример относительной ссылки:
<a href="/book/chapter_1.html">Глава 1</a>
Такой стиль полезен тем, что при переносе всего дерева документов в другое место не
требуется изменять ссылки в самих документах.
Задание абсолютной ссылки заключается в указании полного URL-адреса целевого документа,
например:
<a href="http://www.somehost.ru/book/chapter_1.html">Глава 1</a>
Использование элемента base позволяет поддерживать относительные ссылки
в том случае, когда HTML-документ перемещен (или скопирован), а все остальное дерево
документов, на которые он ссылается, нет. Адрес документа поменялся (например, документ
лежал на www.somehost.ru, а теперь у вас дома, на диске С), однако при активизации
относительной ссылки она будет взята браузером относительно исходного адреса, прописанного
в элементе base .
Элемент base имеет один обязательный атрибут href , значением
которого является полный URL документа. В листинге показано применение элемента
base и относительных ссылок:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Глава 1</title>
<base href= "http://www.somehost.ru">
</head>
<body>
...текст документа...
...текст документа...
<a href= "/images/photo.gif">Ссылка на изображение photo.gif</a>
...текст документа...
...текст документа...
<a href= "chapter_2.html">К следующей главе</a>
...текст документа...
...текст документа...
</body>
</html>
В этом примере переход по относительным ссылкам задается относительно URL-адреса
http://www.somehost.ru. Таким образом, заданные в этом документе ссылки в
абсолютном варианте всегда (независимо от месторасположения документа) будут иметь
следующий вид:
http://www.somehost.ru/images/photo.gif
http://www.somehost.ru/chapter_2.html
Если базовый адрес не был бы задан, то эти ссылки интерпретировались бы относительно
каталога, в котором находится данный документ. Соответственно при перемещении
документа изменялись бы цели относительных ссылок.
Начальный тег элемента base обязателен, конечный тег запрещен.
Элемент base можно использовать и в заголовке и в теле документа,
причем несколько раз. Область действия элемента base определяется от
места его задания и до конца документа, или до следующего объявления элемента
base , если таковой имеется.
Элемент <meta>.
Элемент meta используется для задания некоторых свойств документа
(а именно: автора, списка ключевых слов, кодировки и т.п.), благодаря чему позволяет
управлять обработкой HTML-документа. Этот элемент, вместе с элементом title
является наиболее используемым при задании заголовка. При задании элемента
meta начальный тег обязателен, конечный тег запрещен.
Атрибуты:
- name — указывает имя свойства;
- content — задает значение свойства;
- scheme — указывает имя схемы, используемой для обработки значения свойства;
- http-equiv — используется вместо атрибута name для указания имени http-сообщения;
- lang — информация о языке. Необязательный атрибут.
- dir — указывает направленность текста Необязательный атрибут.
Каждый элемент meta содержит в себе пару "свойство-значение". Атрибут
name (http-equiv ) указывает свойство, атрибут content —
значение. Например:
<meta http-equiv="content-type" content="text/html; charset=iso-8859-l">
<meta name="description" content="cascading style sheets, stylesheets,
CSS, CSS1, CSS2, HiperText Markup Language, HTML 4.0, HTML 4.01">
<meta name="keywords" content="cascading style sheets, stylesheets,
CSS, CSS1, CSS2, HiperText Markup Language, HTML 4.0, HTML 4.01">
В первом случае указана кодировка HTML-документа, во втором случае — описание документа,
в третьем — ключевые слова. Оба последних элемента meta обычно имеют
одинаковое значение в целях повышения эффективности обнаружения их поисковыми роботами,
так как именно по этим параметрам в значительной степени осуществляется отбор нужных документов.
Атрибут http-equiv может использоваться вместо атрибута name ,
для задания свойств HTML-документа на уровне http-заголовка. Через атрибут http-equiv
осуществляется доступ к полям HTTP-заголовка.
Первое полезное применение этого элемента заключается в осуществлении принудительной
перезагрузки документа браузером. Для этого с помощью атрибута http-equiv
используется http-оператор refresh . Время, через которое надо произвести
перезагрузку, указывается атрибутом content , а адрес загружаемого документа —
атрибутом url оператора refresh . Пример написания:
<meta http-equiv="refresh"
content="5; url=http://www.somehost.ru/page.html">
При таком задании через 5 секунд после загрузки текущего документа браузер автоматически
перейдет к загрузке документа page.html. Если URL не задан, то происходит просто
обновление документа. На этом построены все чаты.
Практически во всех HTML-документах элемент meta используется для их описания
посредством задания списка ключевых слов и краткой информации о содержимом документа.
Ключевые слова вместе с названием документа помогают поисковым машинам найти документ.
В своих отчетах они выдают название документа, прописанное в элементе <title> ,
и краткое его описание, заданное через элемент meta . Для указания списка
ключевых слов и краткой информации о документе в заголовке используются два meta
элемента:
<meta name="description" content="Наибольшее количество анекдотов
в сети. Постоянное пополнение. ЗАХОДИ - не соскучишься">
<meta name="keywords"
content="анекдот; прикол; лучшие анекдоты; шутка">
Через элемент meta можно указать кодировку содержимого документа.
Элемент meta тогда принимает вид:
<meta http-equiv="content-type"
content="text/html; charset=windows-1251">
С помощью элемента meta можно запретить кэширование документа, что бывает
полезно при частом обновлении документа. Для осуществления этой операции в элемент
meta включается оператор cache-control (в HTTP 1.0 применялся
оператор Pragma ). Оператор устанавливается в положение no-cashe .
Элемент meta тогда примет вид:
<meta http-equiv="cache-control" content="no-cache">
При кэшировании документа можно указать время, до которого имеет место соответствие
закэшированного документа с его оригиналом на сервере. В данном случае используется
HTTP-оператор Expires и элемент meta принимает вид:
<meta http-equiv="Expires"
content="Monday, 18-Мау-2005 00:00:01">
В данном случае дата задается для корректировки HTTP-заголовка и поэтому должна иметь
указанный формат.
Элемент <link>.
Данный элемент задает вид взаимоотношений между содержащим его документом и другим
ресурсом сети, устанавливает между ними логическую связь. Начальный тег обязателен,
конечный тег запрещен.
Атрибуты:
-
href — указывает URL-адрес документа, взаимоотношение с
которым описывается.
-
rel — атрибут, определяющий отношение между текущим и внешним
документами. С помощью этого атрибута W3C пытается запрограммировать клавишу
"Вперед" браузера.
- rev — атрибут, определяющий отношение между текущим и
внешним документами. С помощью этого атрибута W3C пытается запрограммировать клавишу
"Назад" браузера.
-
hreflang — необязательный атрибут, указывающий базовый
язык целевого Web-ресурса. Этот атрибут может использоваться только в сочетании с
атрибутом
href . В качестве значения пишется код языка.
- charset — указывает кодировку символов целевого документа.
Один элемент link устанавливает связь только с одним внешним документом.
Однако в HTML-документе может присутствовать несколько элементов link .
Элемент link обычно содержит URL-адрес документа, с которым задается
взаимоотношение, и тип самого взаимоотношения, который показывает, чем документ, указанный
в ссылке, является по отношению к текущему документу.
Перечень возможных типов взаимоотношений:
Для атрибута rev
- made — адрес электронной почты автора текущего документа;
- author — автор данного документа;
- editor — страница редактора данного документа;
- owner — страница владельца данного документа.
Для атрибута rel
- start — начальная страница;
- index — алфавитный указатель;
- previous — предыдущая страница;
- next — следующая страница;
- bookmark — закладка;
- copyright — авторское право;
- alternate — альтернативная версия документа;
- help — справочное пособие.
Запись
<link href="http://www.somehost.ru/charter_3.html" rel="next">
читается как:
документ по адресу http://www.somehost.ru/charter_3.html является следующим в
логической последовательности после данного.
Пример:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Вторая глава</title>
<link rev="made" href="mailto:ivanov@mail.ru">
<link rev="author" href="Александр Иванов">
<link rel="next" href=charter_3.html">
<link rel="previous" href="charter_l.html">
<link rel="index" href="toc.html">
<meta http-equiv="Content-Type" content="text/html;
charset=windows-1251">
<meta name="description" content="HTML, CSS, JavaScript">
<meta name="keywords" lang="ru" content="HTML, CSS, JavaScript">
</head>
<body>
...текст документа...
...текст документа...
...текст документа...
</body>
</html>
На данный момент информация о взаимоотношениях документов, задаваемых элементом link ,
браузерами никак не учитывается и не отображается. Пользователь может увидеть эти сведения,
только просмотрев HTML-код документа. Консорциум W3C уже не один год занимается разработкой
браузера с возможностью программирования кнопок "Вперед" и "Назад". Однако разработки этой
компании пока не нашли своего применения в популярных и общеиспользуемых браузерах.
Заглавные ссылки учитываются поисковыми машинами в своей работе, поэтому все-таки бывает
полезно их задавать. Например, чтобы указать поисковому роботу на расположение иноязычных
версий данного документа, достаточно использовать следующее задание элемента link .
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Документ на русском языке</title>
<link title ="Этот же документ на английском языке"
type="text/html" rel="alternate"
href="http://www.mybook.ru/charter_3/english_3.html"
hreflang="en">
<link title ="Этот же документ на французском языке"
type="text/html" rel="alternate"
href="http://www.mybook.ru/charter_3/french_3.html"
hreflang =fr>
<link title ="Этот же документ на немецком языке"
type="text/html" rel="alternate"
href="http://www.mybook.ru/charter_3/deutch_3.html"
hreflang="de">
</head>
<body>
...текст документа на русском языке...
...текст документа на русском языке...
...текст документа на русском языке...
</body>
</html>
Сегодня основное практическое применение элемента link , заключается в подключении
внешних таблиц стилей (CSS).
Пример:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Название документа</title>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
...текст документа...
...текст документа...
...текст документа...
</body>
</html>
|