Видео-уроки HTML. Часть 2. Структура HTML-документа

Информация о материале: Родительская категория: Программирование; Категория: HTML

Краткое содержание урока №2 по HTML.

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

Видео урок №2 по изучению HTML.

Азы синтаксиса языка HTML.

Как будет выглядеть информация в браузере зависит от того, как она размечена в HTML-документе. Для разметки используются теги. Их мало, поэтому их легко запомнить.

Нет разницы, записаны ли тэги ЗАГЛАВНЫМИ или строчными буквами. Главное – это помнить всегда закрывать теги. Есть теги, не требующие закрытия (их ещё меньше и их не спутать с другими).

Как будет показано в следующих лекциях, лучше использовать строчные буквы в написании тегов, т.к. это принято большинством тех, кто пишет и читает HTML-документы.

HTML-тэг начинается с угловой скобки < и заканчивается угловой скобкой >.

Закрывающий HTML-тег начинается с угловой скобки и слэша </ и заканчивается всё той же угловой скобкой >.

Например, тег <html>

Пример простейшего HTML-кода.

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

<html>

  <head>
    <!-- для заголовка страницы и технической информации -->
  </head>

  <body>
    <!-- для того, что будет отображаться в браузере -->
  </body>

</html>

Как видно, он состоит из двух контейнеров head и body, которые вложены в контейнер html.

ВАЖНО! Все HTML-документы имеют именно такую структуру и должны содержать в себе контейнер html, в котором сначала вложен контейнер head и после него контейнер body.

Контейнер html

Основной контейнер html начинается с открывающего тега <html> и заканчивается закрывающим тегом </html>.

Внутрь этого контейнера помещаются два других контейнера <head> и <body>

После закрывающего тега </html> ничего быть не должно.

Контейнер head

Контейнер head начинается с открывающего тега <head> и заканчивается закрывающим тегом </head>.

Внутрь этого контейнера помещается служебная информация для браузера и поисковых машин. Всё, что в него помещено не отображается в браузере за исключением тега <title>, который служит для заголовка страницы и отображается как название закладки в браузере.

Контейнер body

Контейнер body начинается с открывающего тега <body> и заканчивается закрывающим тегом </body>

Служит собственно для размещения информации и её разметке, которая будет отображена в браузере.

Контейнер комментария

Контейнер комментария начинается с открывающего тега .

Служит для комментариев кода в HTML-документе.

Комментарии не отображаются в видимом в браузере документе.

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

Задание

Продолжим работать с созданным ранее файле index.html.

Теперь внесём в него простейший HTML-документ и попробуем открыть в любом браузере.

Если всё получилось (файл сохранился и потом открылся в браузере), можно двигаться дальше.

Заключение

Если что-то пошло не так, задавайте вопросы. Для тех, кто всё-таки не смог создать файл index.html, можно скачать его по этой ссылке. Он находится в zip-архиве, так он скачается. Иначе он просто бы открылся в браузере.

Заберите ссылку на статью к себе, чтобы потом легко её найти!
Раз уж досюда дочитали, то может может есть желание рассказать об этом месте своим друзьям, знакомым и просто мимо проходящим?
Не надо себя сдерживать! ;)