Структура HTML-документа, обязательные теги

На этом уроке вы узнаете:

Что такое директива DOCTYPE.
Структуру HTML-страницы.
Обязательные теги HTML-страницы.

Язык HTML не является языком программирования - это язык разметки, поэтому HTML учится быстро и легко.

Теги и их атрибуты не чувствительны к регситру.

HTML-страницу рекомендуется начинать с директивы DOCTYPE, которая сообщает браузеру какая версия HTML использовалась при написании страницы. Общепринятым стандартом на 2015 год считается версия HTML5. В HTML5 версия в DOCTYPE не указывается, что упрощает переход на HTML5 со старых версий. Например, если HTML-страница соответствует стандарту HTML4, то для перехода на HTML5 достаточно изменить DOCTYPE.

ПРИМЕР:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> - HTML4
<!DOCTYPE HTML> - HTML5

Все браузеры поддерживают сокращенное объявление DOCTYPE и отображают HTML-страницу в соответствии со стандартом. Различия между версиями HTML приведены на странице w3.org/TR/html5-diff/#doctype

HTML-страница содержит обязательные теги, которые располагаются в строгом порядке.

ПРИМЕР:

<!DOCTYPE HTML>

<html>
<head>
	<title>НАЗВАНИЕ HTML-страницы</title>
</head>

<body>

Текст HTML-страницы.

</body>
</html>

Контейнер HTML определяет начало и конец HTML-страницы.
Контейнер HEAD определяет головную часть HTML-страницы.
Контейнер TITLE содержит название HTML-страницы.
Контейнер BODY содержит информацию, которая отображается в окне браузера.

Теорию будем дополнять практикой.

Откройте текстовый редактор Notepad++ (или HTML-редактор, если он у вас есть).
Наберите текст примера, который приведен выше:
- В контейнере TITLE запишите - Урок 1.
- В контейнере BODY запишите - Моя первая HTML-страница.
Сохраните пример в файл lesson1.html на диск D своего компьютера.
Запустите браузер, который установлен на вашем компьютере (например Internet Explorer).
В командной строке браузера наберите D:/lesson1.html и нажмите клавишу Enter.
Посмотрите как выглядит HTML-страница.

Поздравляю, только что вы создали настоящую Веб-страницу. Согласитесь, это было не сложно.

ВАЖНО!

Между символами <, >, / и именами тегов, а также внутри имен тегов недопустимы пробелы и переносы строк.
В обычном тексте HTML-страницы нельзя использовать символы <, >, т.к. браузер будет считать текст, заключенный в косые скобки тегом и будет некорректно отображать страницу.
Следует внимательно следить за правильной вложенностью тегов - порядок следования закрывающих тегов должен быть обратным, в котором следуют теги открывающие:
- ПРАВИЛЬНО - текст
- НЕПРАВИЛЬНО - текст