Для каких целей используется тег main?

Тег <main> — это семантический элемент HTML5, который выделяет основное содержимое страницы. Под «основным» понимается контент, непосредственно относящийся к теме документа и уникальный для него: статья, товар, форма заказа, результаты поиска. Повторяющиеся на всех страницах блоки — шапка, навигация, сайдбар, подвал — в <main> не входят.

Зачем это нужно

• Доступность: скринридеры и вспомогательные технологии используют <main> как landmark-роль, позволяя пользователю быстро перейти к главному контенту.
• SEO: поисковые системы лучше понимают структуру страницы и вес основного контента.
• Читаемость кода: разработчикам проще ориентироваться в разметке.

Правила использования

1. На странице должен быть только один видимый <main>.
2. Нельзя вкладывать <main> в <article>, <aside>, <header>, <footer> или <nav>.
3. Если у страницы несколько независимых блоков (например, SPA с несколькими «страницами»), остальные можно скрывать атрибутом hidden.

Пример

<body>
  <header>Логотип и меню</header>
  <nav>Навигация</nav>
  <main>
    <h1>Статья о HTML</h1>
    <p>Основной текст статьи...</p>
  </main>
  <aside>Реклама</aside>
  <footer>Контакты</footer>
</body>

Итог: применяйте <main> для выделения уникального контента страницы — это улучшает доступность, SEO и структуру разметки.