Відмінності між версіями «Загальна структура HTML»

Матеріал з Wiki TNEU
Перейти до: навігація, пошук
Рядок 20: Рядок 20:
 
Усі перераховані теги є закриваючими, тобто зараз у нас така структура сторінки:
 
Усі перераховані теги є закриваючими, тобто зараз у нас така структура сторінки:
  
  <!DOCTYPE html>
+
   
  <html>
+
<!DOCTYPE html>
  <head>
+
   
    <title>Заголовок стоорінки</title>
+
<html>
</head>
+
   
<body>
+
<head>
 
      
 
      
  </body>
+
<title>Заголовок стоорінки</title>
  </html>
+
   
 +
</head>
 +
 +
<body>
 +
   
 +
   
 +
</body>
 +
 +
</html>

Версія за 00:06, 23 листопада 2011

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

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

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

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

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

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

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

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

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


<!DOCTYPE html>

<html>

<head>

<title>Заголовок стоорінки</title>

</head>

<body>


</body>

</html>

Особисті інструменти
Простори назв

Варіанти
Дії
Навігація
Інструменти