Метаданные страницы: head и meta

<head> хранит сведения, которые не показываются посетителю напрямую, но важны для браузеров и поисковиков: заголовок, кодировку, подключения стилей и скриптов, meta-теги.

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Fresh bread in Baku | Example Bakery</title>
  <link rel="stylesheet" href="style.css">
  <link rel="icon" href="favicon.svg">
</head>

• charset="utf-8" обеспечивает правильное отображение букв.
• viewport задаёт правильный масштаб на мобильных экранах.

<title> — заголовок во вкладке браузера и в результатах поиска; он должен быть уникальным и ясным для каждой страницы. <meta name="description"> может стать кратким описанием в выдаче; достаточно 150–160 символов.

<meta name="description" content="Daily fresh bread, pastries and coffee in the centre of Baku.">
<link rel="canonical" href="https://example.com/bread">

Теги Open Graph определяют, как ссылка выглядит при публикации: og:title, og:description, og:image. <html lang="az"> объявляет язык документа; для альтернативных языков служат ссылки hreflang.

<meta property="og:title" content="Fresh bread in Baku">
<meta property="og:image" content="https://example.com/cover.jpg">
<link rel="alternate" hreflang="en" href="https://example.com/en/bread">