Перегляд вихідного коду сторінки Загальна структура HTML

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


Зараз ми ознайомимось з структурою звичайної html сторінки. Вона потрібна для того, щоб брузер знав більше про нашу сторінку та кращого структурування контенту. Це допоможе пошуковим системам краще індексувати ваш сайт, а також не заплутатись у ньому.

Давайте заглянемо в код будь-якого сайту. 

В першій стрічці ви можете бачити, так званий доктайп:
<!DOCTYPE html>

В теперішній версії HTML5 саме такий короткий доктайп. Можете навіть його запам'ятати. В раніших версіях він був набагато довший. У доктайпа дуже довга історія і якщо не вдаватись в подробиці, то він каже браузеру, згідно якого стандарту відображати сторінку. Просто пам'ятайте, що його потрібно використовувати в усіх нових проектах.

Наступним елементом, після doctype є <html>. Він обгортає весь код сторінки. Всередині цього тегу є ще тільки два тега. Це <head> та <body>.

Head (голова) - це службовий тег, контент якого не відображається на сторінці. Всередині нього вказується, які скрипти та таблиці стилів підключати, як має інтерпретуватись кожен символ та інша службова інформація необхідна браузеру чи пошуковим системам. Також всередині head можна вставити тег <title>, вміст якого буде показаний в заголовку вікна браузера.

Body (тіло) - це елемент в якому має знаходитись весь вміст сторінки. Усі теги, все, що має побачити відвідувач, має бути розташоване в ньому.

Усі перераховані теги є закриваючими, тобто зараз у нас така структура сторінки:

 
<!DOCTYPE html>
 
<html>
 
<head>
    
<title>Заголовок стоорінки</title>
 
</head>
 
<body>
    
</body>
 
</html>