Структура HTML документа
 Так
что же все-таки представляет собой структура HTML документа?
Посмотрите на этот код страницы.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD
HTML 4.01 Transitional//EN">
<Html>
<Head>
<Title>Наша первая страница</Title>
</Head>
<Body>
Здесь должно находиться содержимое Вашей
страницы.
</Body>
</Html> |
Посмотрите здесь, что получилось.
Или для практики откройте стандартный блокнот «Windows». Если Вы
не знаете, что это такое и где он находится у вас на компьютере,
то идите в панель «ПУСК», далее «ПРОГРАММЫ», далее на вкладке «СТАНДАРТНЫЕ»
найдите и откройте «БЛОКНОТ». Скопируйте и вставьте верхний код,
или перепишите вручную (это тоже практика) в блокнот. Теперь сохраните
этот файл в расширении «html» или «htm». Для этого в «Блокноте»
в меню «Файл» нажмите «Сохранить как…»
В открывшемся окне в строке «Имя файла:» впишите имя под которым
Вы хотите сохранить этот файл. Например «index.html», «first.html»
или «index.htm», «first.htm». В строке «Тип файла:» в выпадающем
меню выберите из списка «Все файлы». Это важно чтобы во второй строке
Вы выбрали «Все файлы», в противном случае наш файл не сохранится
с расширением «html» или «htm» и Вы не сможете просмотреть вебстраницу.
Нажимаем кнопку «Сохранить». Все наша первая страница готова. (Надеюсь,
после этого, мы уже не будем возвращаться к вопросу сохранения страницы
написанной в «блокноте».) Теперь найдите ее там, куда Вы ее сохранили
и откройте. То, что Вы видите это результат работы этого простого
кода. Теперь давайте разберем этот код.
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD
HTML 4.01 Transitional//EN">
- Каждый, уважающий себя (несмотря на то, что на
страницах многих вебмастеров эта строка опущена), html документ
должен начинаться с объявления браузеру какой версии международной
спецификации html он соответствует. Верхняя строчка сообщает браузеру,
что этот HTML документ соответствует версии 4.01 международной
спецификации HTML.
- <Html>
- открывающий тег, который объявляет о начале документа.
- <Head>
- открывающий тег заголовка или головы документа
(кому как удобно). В дальнейшем, если речь будет идти о заголовке
документа, будем говорить тег <head>, имя в виду
«заголовок» документа. Между открывающим (<head>)
и закрывающим (</head>) тегом располагается название
документа и служебная информация для браузеров и поисковых машин.
- <Title>
- Открывающий тег названия документа дает браузеру
понять, что все что написано сразу за этим тегом и до закрывающего
тега </Title> является названием документа. Это
название выводится браузером на самую верхнюю панель браузера
 и внизу на панели
инструментов
- Наша первая страница
-
- собственно само название документа.
- </Title>
- закрывающий тег названия документа дающий понять
браузеру, что на этом действие тега <Title> закончилось.
- </Head>
- закрывающий тег заголовка или головы документа
дающий понять браузеру, что на этом действие тега <Head>
закончилось.
- <Body>
- открывающий тег тела документа, или содержимого
документа которое выводится на экран. Между открывающим <Body>
и закрывающим </Body> находится все, что выводится
браузером на экран. Это таблицы, текст, изображения. Одним словом,
все HTML-элементы, отвечающие за отображение документа, управление
им и гипертекстовые ссылки.
- Здесь должно находиться содержимое
Вашей страницы.
- Содержимое документа (ВНИМАНИЕ!!! Это содержимое
документа для разбираемого нами кода HTML документа). Здесь может
быть все что угодно; таблицы, текст, изображения и т.д..
- </Body>
- Закрываем тело документа. Сообщаем браузеру,
что на этом тело или содержимое (кому как нравиться, мы будем
говорить далее «тело») документа закончено. Иными словами в данном
месте закончено действие тега <Body>.
- </Html>
- Закрываем HTML документ. Видя этот тег браузер
понимает что действие тега <Html> на этом закончено.
Ниже Вы можете видеть примерную структуру HTML документа.
| <!DOCTYPE HTML PUBLIC "-//W3C//DTD
HTML 4.01 Transitional//EN"> |
Объявление версии
HTML |
| <Html> |
Объявление начала Html документа |
<Head>
<Title>Наша первая страница</Title>
</Head> |
Начало заголовка документа
Название документа
Конец заголовка документа |
<Body>
Здесь должно находиться содержимое
Вашей страницы.
</Body> |
Начало тела документа
Содержимое документа (текст, таблицы, изображение и т.д.)
Конец тела документа |
|
| </Html> |
Конец Html документа |
Подводим итог
Как
видно из верхней таблицы HTML документ делится на две основные части.
Первая – заголовок и вторая – тело документа. В заголовке документа
располагается название документа и служебная информация для браузеров
и поисковых машин. В теле документа находятся все HTML-элементы,
отвечающие за отображение документа, управление им и гипертекстовые
ссылки.
В
дальнейшем нам в основном придется работать во второй части документа.
Не
устали? Если нет, тогда вперед.
Если да, то отдохните немного и продолжим. Отдыхать ведь тоже надо.
И глазки поди устали.
|
