Общая структура HTML документа.

Лекция 8. Основы HTML (Hypertext Markup Language)

Общая структура HTML документа.

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

Директивы HTML называются «теги» (от англ, tag — отметка). Теги HTML заключаются в угловые скобки, синтаксис их записи в общем виде выглядит как < тег>. Все объекты, не заключенные в угловые скобки, интерпретатор воспринимает как текстовые элементы, отображая их на экране компьютера «как есть».

Структура документа HTML выглядит следующим образом:

Документ HTML

Заголовок

У HTML имеется еще одна значительная особенность, отличающая его от других языков программирования: практически все теги данного языка, за исключением некоторых отдельно оговоренных случаев, — парные. Такая па­ра состоит из «открывающего» и «закрывающего» тега, которые отличаются лишь наличием в последнем символа «/» Все, что расположено между откры­вающими закрывающим тегом, обрабатывается интерпретатором согласно ал­горитму, присвоенному данному конкретному тегу. В общем виде программ­ная строка HTML с открывающим и закрывающим тегами выглядит так:

< тег> обрабатываемое значение < /тег>

Данное свойство HTML позволяет использовать принцип вложения одного тега в другой, когда обрабатываемым значением одной команды может слу­жить другая команда. Вот простой пример вложения двух тегов друг в друга:

< тег1> < тег2> обрабатываемое значение < /тег2> < /тег1>

При роботе с кодом HTML необходимо запомнить одно простое правило:

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

Основной, глобальной конструкцией внутреннего кода Web-страницы явля­ется «Документ HTML», для определения которой существует специальная команда, призванная «объяснить» броузеру, что он имеет дело именно с доку­ментом HTML, а не с текстовым или, например, графическим файлом. Такая команда называется «тег верхнего уровня» и записывается как:

< НТМL> Содержимое < /НТМL>

Тег верхнего уровня парный, причем его содержимое как раз и есть весь код HTML, составляющий документ. Открывающий тег записывается самой первой строкой html-документа, а закрывающий — самой последней.

Следующим элементом является «Заголовок документа». Заголовок Web-страницы содержит исчерпывающую информацию о самом документе, а ино­гда также специальные директивы транслятора, подсказывающие встроенному в броузер интерпретатору HTML правила, по которым следует обрабатывать составляющий страницу код. Cодержимое заголовка не отображается в бро­узере и не влияет на внешний вид документа. Это служебная информация, которая необходима для корректной работы броузера. Синтаксис тега заголов­ка в общем виде выглядит так:

< HEAD> Содержимое < /HEAD>

Раздел HEAD следует в html-документе непосредственно за тегом < HTML> и является второй обязательной командой, которую необходимо включать в код Web-страницы.

«Внешний заголовок» является вложенной командой тега < HEAD>. Мне­моника внешнего заголовка записывается следующим образом:

< ТITLE> Внешний заголовок < /TITLE>

Внешний заголовок отображается в верхнем поле броузера в качестве названия страницы при ее открытии. Значение тега < TITLE> подставляется по умолчанию в соответствующее диалоговое окно, когда пользователь зано­сит документ в папку «избранное».

Последняя структурна составляющая кода web-страницы — «Тело доку­мента». Тело документа, описываемое тегами < BODY> < /BODY>, включает в себя весь основной код разметки страницы, который и определяет отображе­ние html-документа на экране монитора. Основной текст, иллюстрации, эле­менты навигации и все, что вы хотите продемонстрировать посетителям ваше­го сайта, размещается внутри данного тега.

Таким образом, обязательные элементы кода документа HTML выглядят так:

< HTML>

< HEAD>

< ТITLE> Название страницы < /TITLE>

< /HEAD>

< BODY>

< /BOOY>

< /HTML>