Роль Секції Head у Документі

У голові документа можуть міститися мета-теги, більшість з яких не відображаються користувачу у вікні браузера. Тому в наступних прикладах ви не побачите жодного видимого вмісту. Ці теги зберігають метадані про сторінку.

Заголовок сторінки

Текст всередині тега <title> відображається на вкладці браузера. Заголовок має бути коротким описом сторінки і не перевищувати 60 символів.

index.html

За допомогою цього коду ви можете досягти такого вигляду на вебсайті. У вкладці браузера ви побачите саме той текст, який знаходиться всередині тегу <title> (білий контур на зображенні).

Мета-дані

Тег <meta> містить інформацію для браузерів і пошукових систем: кодування документа, передачу даних та багато іншого. Мета-теги можуть мати багато атрибутів, оскільки кожен з них передає різну інформацію. Найважливішим є кодування сторінки. Воно допомагає браузеру правильно відображати текст. Якщо не вказати кодування, браузер може показати некоректні символи замість тексту.

index.html

Значення атрибутів тега meta

name: назва властивості може бути будь-яким словом або фразою, але веб-браузери зазвичай очікують значення, яке вони можуть розпізнати та використати для виконання певної дії. Наприклад, <meta name="author" content="name"> вказує автора сторінки;
content: визначає значення властивості. Наприклад, <meta name="language" content="english"> задає мову тексту сторінки;
http-equiv: означає HTTP-еквівалент і використовується для імітації HTTP-заголовків відповіді. Використовується рідко. Наприклад, <meta http-equiv="refresh" content="30"> вказує браузеру оновлювати сторінку кожні 30 хвилин.

Базові meta-теги для покращення SEO

<meta name="description"/>: задає короткий опис веб-сторінки;
<meta name="author" />: вказує автора веб-сторінки;
<meta name="language"/>: визначає мову веб-сторінки;
<meta name="robots"/>: повідомляє пошуковим системам, як індексувати або сканувати веб-сторінку;
<meta name="googlebot" content="notranslate"/>: інформує Google не пропонувати автоматичний переклад веб-сторінки;
<meta name="copyright" content="Copyright 2024"/>: вказує авторське право на веб-сторінку.