Структура документа HTML

Файл

Для начала нам необходимо создать файл, имеющий расширение *.html. Называть файл желательно латиницей. Чтобы открывая браузером папку или домен сайта открывался сразу сайт, необходимо файлу главной страницы дать название index.html.

Спецификация

После создания файла необходимо указать спецификацию !DOCTYPE.

Пример указания спецификации HTML 3.2:

<!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 3.2 Final//EN»>

Все указанно верно но это старая версия, лучше использовать версию 4 или 5.
HTML 4.01

  • Использование строгого синтаксиса

<!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01//EN» «http://www.w3.org/TR/html4/strict.dtd»>

  • Переходный синтаксис

<!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01 Transitional//EN» «http://www.w3.org/TR/html4/loose.dtd»>

  • Использование фреймов в документе

<!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01 Frameset//EN» «http://www.w3.org/TR/html4/frameset.dtd»>

HTML 5

<!DOCTYPE html>

XHTML 1

  • Использование строгого синтаксиса

<!DOCTYPE html PUBLIC «-//W3C//DTD XHTML 1.0 Strict//EN» «http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd»>

  • Переходный синтаксис

<!DOCTYPE html PUBLIC «-//W3C//DTD XHTML 1.0 Transitional//EN» «http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd»>

  • Использование фреймов в документе

<!DOCTYPE html PUBLIC «-//W3C//DTD XHTML 1.0 Frameset//EN» «http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd»>

Данный сайт на момент написания статьи использовал XHTML 1.0 Transitional

Тело

Для начало необходимо указать начало и конец документа, для этого используется тег <html> и закрывающийся тег </html>.
После тега необходимо указать заголовок документа, в нем будет содержатся название страницы, скрипты и стили. Заголовок документа указывается тегом <HEAD>.
В нутри заголовка также желательно указать кодировку страницы, для этого используется тег: <meta http-equiv=»Content-Type» content=»text/html; charset={кодировка}»>, в HTML 5 через: <meta charset=»{кодировка}»>
Вместо {кодировка} вписываете свою кодировку: к примеру windows-1251 или UTF-8

Указав все стили, скрипты и т.д. необходимо указать тело документа, где и будут находится статьи или содержимое сайта.

 

Пример структуры документа

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HTML>
  <HEAD>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <TITLE>Заголовок документа</TITLE>
  </HEAD>
  <BODY>
    Текст документа
  </BODY>
</HTML>

 

Структура для index.html нашего сайта

<!DOCTYPE html>
<html>
  <head>
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1251">
    <title>Сайт киоска канцтоваров</title>
  </head>
  <body>
    Сайт Киоска №454
  </body>
</html>

Описание:

1. <!DOCTYPE html> — это спецификация, в данном случае html 5.

2. <html> — отметили начало документа.

3. <head> — начало заголовка

4. <META HTTP-EQUIV=»Content-Type» CONTENT=»text/html; charset=windows-1251″> — описали кодировку документа.

5. <title></title> — указали заголовок страницы, п.1 на скриншоте.

6. </head> — закрыли заголовок док-а.

7. <body>- указали начало тело документа

8. «Сайт Киоска №454» — это содержимое страницы, что и будет отображаться

9. </body> — указали что тело документа закончилось

10. </html> — и закрыли документ

Результат:

 

Скачать результат



comments powered by Disqus

Популярное