Слово HTML представляет собой сокращение от HyperText Markup Language —
язык разметки гипертекста. В основном, HTML-документ является простым текстовым
файлом, который содержит текст и ничего больше. Так что создавать веб-страницы
можно в любом текстовом редакторе.
Когда веб-страница открывается в браузере, он просматривает код
HTML, находит специальные символы, называемые тегами, и использует
их для вставки изображений, изменения вида текста, создание ссылок
на другие веб-страницы и др.
Для обозначения тегов используется символ <тег>.
Теги бывают двух видов: парные, которые выделяют блок текста, также называются
еще контейнером (пример 1) и одиночные. Контейнер требует закрывающего
тега, обозначаемого </тег>. Теги нечувствительны
к регистру, поэтому запись <B> и <b>
эквивалентна.
Пример 1. Использование парных тегов (контейнера)
<!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>
<p> <b>Жирный шрифт</b> в тексте.</p>
</body>
</html>
Поскольку одновременно можно использовать любое разумное сочетание тегов, следует
помнить об их вложенности (пример 2). Один контейнер должен находиться
внутри другого, и никак не пересекаться (пример 3).
Пример 2. Правильное сочетание тегов
<!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>
<p> <b><i>Полужирный курсивный текст </i></b></p>
</body>
</html>
В данном примере текст находится внутри контейнера <I>,
который устанавливает курсивное начертание, а он в свою очередь размещается
внутри контейнера <B> задающим жирное начертание
текста. Результат останется неизменным, если в данном случае поменять теги местами.
Пример 3. Неправильное сочетание тегов
<!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>
<p> <i><b>Полужирный курсивный текст </i></b></p>
</body>
</html>
В данном примере нарушена вложенность тегов один в другой. Хотя браузер и отобразит
пример корректно, самостоятельно ?догадавшись? что от него хотят, подобных ошибок
следует избегать, поскольку они приводят к замедлению работы страницы и к неправильной
демонстрации страницы в большинстве случаев.
Структура документа
Все нормальные веб-страницы состоят из двух разделов — заголовка (<HEAD>)
и тела документа (<BODY>). Раздел заголовка может
содержать текст и теги, но содержимое этого раздела не показывается напрямую
на странице. Тело документа предназначено для размещения тегов и содержательной
части (пример 4).
Пример 4. Простейший HTML-документ
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<!-- Этот раздел предназначен для заголовка страницы
и технической информации. -->
</head>
<body>
<!-- А здесь надо размещать все, что хочется увидеть
на странице. -->
</body>
</html>
DOCTYPE
Элемент <!DOCTYPE> предназначен для
указания типа текущего документа — DTD (document type definition,
описание типа документа). Это необходимо, чтобы браузер понимал, как
следует интерпретировать текущую веб-страницу, ведь HTML существует в
нескольких версиях, кроме того, имеется XHTML (EXtensible HyperText
Markup Language, расширенный язык разметки гипертекста), похожий на
HTML, но различающийся с ним по синтаксису. Чтобы браузер «не путался»
и понимал, согласно какому стандарту отображать веб-страницу и
необходимо в первой строке кода задавать <!DOCTYPE>.
Существует несколько видов <!DOCTYPE>,
они различаются в зависимости от версии HTML, на которую ориентированы.
В табл. 1. приведены основные типы документов с их описанием.
Табл. 1. Допустимые DTD
DOCTYPE |
Описание |
HTML 4.01 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD
HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
Строгий синтаксис HTML. |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD
HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
Переходный синтаксис HTML. |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD
HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> |
В HTML-документе применяются фреймы. |
XHTML 1.0 |
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
Строгий синтаксис XHTML. |
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
Переходный синтаксис XHTML. |
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> |
Документ написан на XHTML и содержит фреймы. |
XHTML 1.1 |
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.1//EN"> |
Разработчики XHTML 1.1 предполагают,
что он постепенно вытеснит HTML. Как видите, никакого деления на виды
это определение не имеет, поскольку синтаксис один и подчиняется четким
правилам. |
Раздел заголовка документа (<HEAD>)
Теги и тексты, находящиеся в этом разделе, не отображаются на веб-странице.
Этот раздел обычно предназначен для следующей служебной информации.
Заголовок страницы (тег <TITLE>)
Используется для отображения строки текста в левом верхнем углу окна браузера.
Такая строка сообщает пользователю название сайта и другую информацию, которую
добавляет разработчик.
CSS (Cascading Style Sheets, Каскадные таблицы стилей)
Стили хранят набор элементов форматирования, который применяется к тексту документа,
чтобы быстро изменить его внешний вид.
Метатеги (тег <META>)
Метатеги используются для хранения информации предназначенной для браузеров
и поисковых систем. Например, механизмы поисковых систем обращаются к метатегам
для получения описания сайта, ключевых слов и других данных. Хотя тег <META>
всего один, он имеет множество параметров, поэтому для его обращения применяется
множественное число.
Скрипты
Скриптом традиционно называют программу, которая внедряется в тело веб-страницы
и выполняет на ней определенные действия. Распространенным языком программирования
для написания скриптов является JavaScript.
Порядок тегов в заголовке документа особого значения не имеет.
Тело документа (<BODY>)
Тело документа предназначено для отображения данных на веб-странице, в частности,
в теле размещается текст, изображения, ссылки, таблицы, списки и т.д.
Комментарии
Как показано в примере 4, некоторый текст можно скрыть от показа в браузере,
сделав его комментарием. Хотя такой текст пользователь не увидит, он все равно
будет передаваться в документе, так что, посмотрев исходный код, можно обнаружить
скрываемую информацию.
Комментарии начинаются тегом <!-- и заканчиваются
тегом -->. Все, что находится между этими тегами
отображаться на веб-странице не будет
Источник: http://htmlbook.ru/ |