- •1. Общие сведения
- •Структура html-документа и элементы разметки заголовка документа
- •Назначение заголовка
- •Отображение содержания элемента title
- •Основные контейнеры заголовка
- •Элемент разметки head
- •Элемент разметки title
- •Элемент разметки base
- •Элемент разметки isindex
- •Применение элемента isindex
- •Применение атрибута prompt
- •Элемент разметки meta
- •Элемент разметки link
- •Элемент разметки style
- •Элемент разметки script
- •Контейнеры тела документа Теги тела документа
- •Тело документа – контейнер body
- •Теги управления разметкой Заголовки
- •Атрибут аlign
- •Теги управления отображением символов
- •Теги, управляющие формой отображения
- •Верхние и нижние индексы
- •Атрибут sizе
- •Атрибут соlоr
- •Создание списков в html
- •Атрибуты маркеров в ненумерованном списке
- •Комментарии в языке html
- •Гипертекстовые ссылки
- •Графика Использование графики в html
- •Атрибуты и их аргументы
- •Атрибут src
- •Атрибут alt
- •Атрибут аlign
- •Атрибут usemap
- •Средства описания таблиц в html
- •Создание таблиц в html
- •Атрибут nowrap
- •Атрибут соlspan
- •Атрибут rowspan
- •Атрибут widтн
- •Применение пустых ячеек
- •Атрибут сеllраdding
- •Атрибуты аlign и valign
- •Атрибут border
- •Атрибут cellspacing
- •Атрибут bgcolor
- •Атрибут background
- •Использование таблиц в дизайне страницы
- •Создание разноцветных таблиц
- •Html-формы
- •Задание формы — элемент form
- •Атрибут cols
- •Как работают фреймы
- •Создание простой страницы с фреймами
- •Задание фреймовой структуры
- •Подготовка содержимого фрейма
- •Подготовка фрейма main
- •Списки Definition: элементы dl, dt и dd
- •Визуальное представление списков
- •Элементы dir и menu
- •Гиперссылки Гиперссылки и якоря. Введение
- •"Посещение" связанного ресурса
- •Другие соотношения гиперссылок
- •Спецификация якорей и гиперссылок
- •Заголовки гиперссылок
- •Интернационализация и гиперссылки
- •Синтаксис имён якорей
- •Вложение ссылок не допускается
- •Якоря с атрибутом id
- •Недоступные и неидентифицируемые ресурсы
- •Взаимосвязи документов: элемент link
- •Гиперссылки вперёд и назад
- •Гиперссылки и внешние таблицы стилей
- •Гиперссылки и машины поиска
- •Информация пути: элемент base
- •Добавление стиля в html
- •Установка языка по умолчанию для таблиц стилей
- •Инлайн-стиль (внедрённый)
- •Информация о стиле в заголовках: элемент style
- •Типы носителя
- •Внешние таблицы стилей
- •Основные и альтернативные таблицы стилей
- •Спецификация внешней таблицы стилей
- •Каскадные таблицы стилей
- •Media-зависимые каскады
- •Наследование и каскадирование
- •Скрытие данных стиля от пользовательских агентов (па)
- •Ссылки на таблицы стилей в заголовках http
- •Выравнивание, стили шрифта и горизонтальные линии Форматирование Цвет фона
- •Выравнивание
- •Плавающие объекты
- •"Всплывание" объекта
- •Обтекание текста вокруг объекта
- •Элементы стиля шрифта: tt, I, b, big, small, strike, s и u
- •Элементы модификатора шрифта: font и basefont
- •Сценарии (скрипты) Введение
- •Дизайн документов для па, поддерживающих скрипты
- •Элемент script
- •Установка языка скриптов
- •Язык сценариев по умолчанию
- •Локальное объявление языка скриптов
- •Ссылки на элементы html из скрипта
- •Динамическое изменение документов
- •Дизайн документов для па, не поддерживающих сценарии
- •Элемент noscript
- •Скрытие данных скрипта от па
- •Дополнительные возможности html Компоновка документа в html
- •Компоновка html - использование таблиц
- •Использование стилей в html
- •Как использовать стили
- •Внешняя таблица стилей
- •Внутренняя таблица стилей
- •Встроенные стили
- •Раздел заголовка html
- •Элемент head
- •Универсальные указатели ресурсов в html Ссылки в html
- •Универсальные указатели ресурсов
- •Схемы обращения к ресурсу url
- •Сценарии в html
- •Добавление сценария на страницу html
- •Как работать со старыми браузерами
- •Стандартные атрибуты html 4.0
- •Атрибуты событий клавиатуры
- •Атрибуты событий мыши
- •Вы изучили html, что дальше? Краткое заключение
- •Теперь вы знаете html, что дальше?
- •Каскадные таблицы стилей (css)
Элемент head
Элемент head содержит общую информацию, называемую также мета-информацией, о документе. Мета означает "информация о чем-то".
Можно сказать, что мета-данные означают информацию о данных, или мета-информация означает информацию об информации.
Элементы внутри элемента head не выводятся браузером. Согласно стандарту HTML, внутри раздела head допустимы только несколько тегов. Это теги <base>, <link>, <meta>, <title>, <style>, и <script>.
Посмотрите на следующую незаконную конструкцию:
<head>
<p>Это какой-то текст</p>
</head>
В этом случае у браузера есть две возможности:
Вывести текст, потому что он находится внутри элемента параграфа
Скрыть текст, потому что он находится внутри элемента заголовка
Если поместить элемент HTML, такой как <h1> или <p>, внутрь элемента head, как в этом случае, большинство браузеров его выведут, даже если это незаконно.
Должны ли браузеры прощать подобные ошибки? Наверно, это неправильно.
|
Теги заголовка | |
|
Тег |
Описание |
|
<head> |
Определяет информацию о документе |
|
<title> |
Определяет заглавие документа |
|
<base> |
Определяет базовый URL для всех ссылок на странице |
|
<link> |
Определяет ссылку на ресурс |
|
<meta> |
Определяет мета-информацию |
|
<!DOCTYPE> |
Определяет тип документа. Этот тег идет перед начальным тегом <html>. |
Мета-информация в HTML
Описание документа
<html>
<head>
<meta name="author" content="Иван Петров">
<meta name="revised" content="Иван Петров,16/10/05">
<meta name="generator" content="Microsoft FrontPage 4.0">
</head>
<body>
<p>
Атрибуты meta этого документа определяют автора и использованную программу редактора.</p>
</body>
</html>
Пример выполнения данного HTML-кода
Информация внутри элемента meta описывает документ.
Ключевые слова документа
<html>
<head>
<meta name="description" content="примеры HTML">
<meta name="keywords" content="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript">
</head>
<body>
<p>Атрибуты meta этого документа описывают документ и его ключевые слова.</p>
</body>
</html>
Пример выполнения данного HTML-кода
Информация внутри элемента meta описывает ключевые слова документа.
Перенаправление пользователя
<html>
<head>
<meta http-equiv="Refresh" content="5;url=http://www.intuit.ru">
</head>
<body>
<p>
Извините! Мы переехали! Новый URL: <a href="http://www.intuit.ru">http://www.osp.ru</a>
</p>
<p>
Вы будете перенаправлены на новый адрес через пять секунд.
</p>
<p>
Если вы видите это сообщение более 5 секунд, щелкните,
пожалуйста, на приведенной выше ссылке!
</p>
</body>
</html>
Пример выполнения данного HTML-кода
Этот пример показывает, как перенаправить пользователя, если адрес сайта изменился.
Элемент meta
Как было показано в предыдущей лекции, элемент head содержит общую информацию (мета-информацию) о документе.
HTML имеет также элемент meta, который помещается внутри элемента head. Элемент meta предназначен для предоставления мета-информации о документе.
Наиболее часто элемент meta используется для предоставления информации, которая имеет отношение к браузерам или поисковым машинам, описывающая содержание документа.
Примечание: Консорциум W3C заявляет в документе http://www.w3.org/TR/html4/struct/global.html#adef-http-equiv, что "Некоторые агенты пользователей поддерживают использование META для обновления текущей страницы после указанного количества секунд, с возможностью заменить ее другим URI. Авторы не должны использовать эту технику для пересылки пользователей на другие страницы, так как это делает страницу недоступной для некоторых пользователей. Вместо этого автоматическое перенаправление страницы должно делаться с помощью перенаправления на сервере".
Ключевые слова для поисковых машин
Некоторые поисковые машины в WWW будут использовать атрибуты name и content тега meta для индексации страницы.
Этот элемент meta определяет описание страницы:
<meta name="description" content="Бесплатные Web-учебники по HTML, CSS, XML, и XHTML">
Этот элемент meta определяет ключевые слова для страницы:
<meta name="keywords" content="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript">
Назначение атрибутов name и content состоит в описании содержимого страницы.
Однако, так как многие вебмастера использовали теги meta для недобросовестной рекламы, увеличивая количество повторений ключевых слов, чтобы страница получила более высокое положение, некоторые машины поиска полностью перестали использовать этот тег.
О машинах поиска можно почитать в учебнике по созданию Web-сайтов.
Неизвестные атрибуты meta
Иногда можно встретить атрибуты meta, которые могут оказаться совершенно незнакомыми, например:
<meta name="security" content="low">
Тогда необходимо просто принять для себя, что это является чем-то уникальным для сайта или для автора сайта и не имеет, вероятно, к вам никакого отношения.
Весь список атрибутов элемента meta можно найти в Полном справочнике тегов HTML 4.01 в конце книги.