World Wide Web Consortium

http://www.w3.org Перво наперво все, что есть в Нете (или почти все...) официально утверждается World Wide Web Consortium ( Интернет-консорциум ) Все стандарты описываются в так называемых RFC ( Request For Comments ) Требование, а скорее просьба... для комментариев.

Что же это такое - HTML?

HTML ( Hyper Text Markup Language ) Язык Гипертекстовой Разметки. На данный момент в Сети сосуществуют два варианта: классический HTML версии 3.2 с его физическим форматированием контента, для чего имеются специальные теги например <font></font> и множество атрибутов: size, color... Особенности HTML 3.2 заставляют прописывать эти теги и атрибуты для каждого нового абзаца, что сильно увеличивает размер кода страниц. Кроме того структура документа непонятна поисковыми машинами и голосовым броузерам. Им подавай чистую логику! В новой спецификации HTML 4.0 (4.01) http://www.w3.org/TR/REC-html40/ используется логическое форматирование, при котором структура и оформление документа разделены. Этот способ рекомендован к применению Инет-консорциумом, так как предоставляет расширенные возможности поиска информации в Сети, позволяет более точно анализировать информацию поисковым машинам, а также существенно уменьшает размер страниц и время их загрузки. Реализуется разделение структуры и оформления документа с помощью CSS (Cascade Style Sheets) Каскадных таблиц стилей. Что это за зверь такой, CSS я тоже немного пояснил.

Тэги HTML

Прежде всего давайте разберемся с тэгами tag или тегами, или тагами, элементами, контейнерми, атрибутами и т. д.

Тэги HTML состоят из:

• левой угловой скобки <
• слэша / если тэг является конечным.
• имени тэга, например title.
• Тэг может быть без атрибутов или сопровождаться одним или несколькими атрибутами, например: align=center
• правой угловой скобки >

Пример1: <h1> тэг без атрибутов.
Пример2: </h1> конечный тэг заголовка, без атрибутов.

Элементы HTML

Документ HTML представляет собой набор вложенных элементов. Два тэга и часть документа между ними, образуют блок или контейнер, называемый HTML элементом. Некоторые тэги, например <hr>, являются элементами HTML сами по себе или так называемыми Инструкциями управления отображением, для них конечный тег не нужен. Исторически сложилось, что ряд элементов потеряли в процессе развития языка свои тэги конца и, таким образом, превратились в инструкции. Элементы представляют из себя контейнеры - блоки, в которых могут размещаться:

• текст
• графика (рисунки)
• гипертекстовые ссылки (линки)
• инструкции управления отображением

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

• Примеры:
• <h1> - это тэг.
• </h1> - это закрывающий тэг.
• <h1 align=left> - это тоже тэг, но с атрибутом align и значением атрибута left.
• <h1>Зенит Forever!</h1> - а эти два тэга и текст между ними образуют HTML элемент или иначе - контейнер. В данном случае заголовок первого уровня.
• <hr> - тэг горизонтальной линии - инструкция управления отображением, закрывающий тэг не нужен.

Aтрибуты

Для каждого тэга определяется множество возможных атрибутов. Большинство тэгов допускает один или несколько атрибутов, однако атрибутов может и совсем не быть. Спецификация атрибута состоит из:

• имени атрибута, например width
• знака равенства (=)
• значения атрибута, которое задается строкой символов, например: "100"

Иногда полезно заключить значение атрибута в кавычки, используя либо одинарные '100', либо двойные кавычки "100". Строка в кавычках не должна содержать такие же кавычки внутри себя. Значения атрибутов должны быть отделены пробелами или незаполненными строками. Пример:

<table width="100%" border="0"> тэг таблицы с атрибутами width, border и значениями атрибутов "100%", "0"

Можно опустить кавычки для значений атрибутов, которые состоят из следующих символов (техническая концепция имени):

• символов английского алфавита (A - Z, a - z)
• цифр (0 - 9)
• промежутков времени
• дефисов (-)

Так width=100 и align=right - разрешенные сокращения для атрибутов width="100" и align="rihgt". Однако атрибуты URL должны быть всегда заковычены, например <a href="http://www.w3.org/">

Чувствительность к регистру

HTML нечувствителен к регистру, но строчные буквы для кода позволяют избежать вероятных глюков. Конечно если Вам больше нравиться, то можно написать TITLE, или Title, или title, но существуют и чувствительные к регистру конструкции языка, а именно: URL, он может содержать наименования файлов, которые являются case чувствительными во многих операционных системах, например в Unix. Также имеются и строгие к Регистру броузеры.

Тэг комментария

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

Пример: <!-- Это неотображаемый броузером комментарий -->

Пробелы и пустые линии

Когда документ выводится на экран, пробелы и пустые линии не сохраняются, за исключением текста, заключенного в тэги <pre></pre> (предварительно отформатированный текст). Правда весит это кажущаяся пустота, вполне реальные килобайты и сильно увлекаться пробелами не стоит.

HTML документ

Сам HTML документ является также элементом, который может иметь две формы:

• обычного документа
• фрейма

Обычный документ представляет из себя два основных контейнера HEAD и BODY:
Документ-фрейм имеет другой вид. Собственно - это контейнер для других HTML-документов (о фреймах я пока писать не буду).

• Пример:
• <html>
• <head>Контейнер - HEAD</head>
• <body>Контейнер - BODY</body>
• </html>

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

Тэг <!DOCTYPE> сообщает валидатору, какую версию HTML Вы используете. Этот тэг должен находиться в первой строке каждой страницы. Тэг <!DOCTYPE> - ключевой компонент Web-страниц, претендующих на соответствие стандартам. Без него Ваш код и CSS не пройдут проверку валидатором. Закрывающий тэг не требуется. Документация на тэг весьма и весьма туманна..., поэтому предлагаются варианты, которые "считаются правильными".

Примеры:

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

Transitional (переходный), Strict (строгий), Frameset (с фреймами).

Контейнер (элемент) - HEAD может включать в себя:

Тэг <title>и обязательный парный закрывающий</title>

Элемент TITLE не является частью отображаемого текста. Он может отображаться как заголовок страницы или название окна. В документе может быть только один TITLE. Элемент TITLE используется для идентификации содержимого документа, то-есть авторам необходимо писать осмысленные заголовки для страниц.

Пример:

<title>33 Сектор сайт фанов ФК Зенит</title>

Тэги <meta>

Специальная группа инструкций, предназначена в основном для описания и индексирования документа поисковыми машинами. Все тэги <meta> не видны при просмотре. Выносятся в "шапку" гипертекстового документа - внутри блока <head>...</head>. Закрывающий тег </meta> запрещен!

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

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

Список терминов и ключевых слов, что является важным при индексировании сайта поисковой машиной! Количество и набор ключевых слов - это вопрос для отдельного разговора. Длина же содержимого тэга не должна превышать 1000 символов. (Все поисковые машины имеют по этому поводу "свое особое мнение")

<meta name="keywords" content="зенит, фан, футбол">

Краткое описание страницы, используемое поисковым сервером при индексировании. Длина содержимого тегов не должна превышать 200 символов. Полезно указать авторские права, название фирмы или имя автора. Почти наверняка все это будет проиндексировано поисковой машиной.

<meta name="description" content="33 Сектор - Сайт фанов футбольного клуба Зенит С-Петербург">

<meta name="copyright" content="© 2004 33 Сектор">

<meta name="author" content="Shadow">

<meta name="Publisher-name" content="33 Сектор">

Ваш E-mail адрес (а это вероятно будет "проиндексировано" спамерами)

<meta name="Reply-to" content="nashsektor33@narod.ru">

Используется для автоматической переадресации браузера на новый адрес или перезагрузки текущей страницы через x секунд.

<meta http-equiv="Refresh" content="x; URL=http://zapiter33.narod.ru/">

Тэг ссылки на внешний CSS файл

Пример:

<link href="style.css" rel="stylesheet" type="text/css">

Тэг вызова файла JavaScript

Пример:

<script language=JavaScript1.2 src="news.js">
<!--
//-->
</script>

Контейнер - BODY <body></body>

Включает в себя все содержание (контент) Web-страницы, то-есть видимую часть документа: тексты, фото или другие объекты. Тэг имеет ряд необязательных атрибутов.Рекомендуется вместо нежелательных атрибутов в тэге body использовать CSS - каскадные таблицы стилей. Скачав справочник по HTML - Zip 124Kb можно узнать подробнее о всех HTML тэгах, а также о многом другом.