Что делает тег

Тег <main> содержит основной контент страницы. Этот контент должен быть уникальным и не может использоваться на других страницах.

Синтаксис тега <main>

<main>
  <!-- Здесь находится содержимое страницы -->
</main>

Спецификация HTML

Тег является частью спецификации HTML Living Standard.

Семантический или нет

Тег <main> считается семантическим, поскольку несёт в себе смысл и точно передаёт назначение своего содержимого.

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

Записи в блоге:

<main>
<h1>Записи моего блога</h1>
  <article>
    <h2>Первая запись моего блога</h2>
    <p>Сегодня я проснулся и решил вести блог...</p>
  </article>
</main>

Страница интернет-магазина с информацией о продукте:

<main>
  <h1>Название продукта</h1>
  <p>Здесь представлены основные сведения о продукте...</p>
</main>

Для чего использовать тег <main>

  • Чтобы обернуть основной контент главной страницы.
  • Чтобы обернуть основное содержимое страницы контактов.
  • Чтобы обернуть основной контент на странице о продукте или услуге.

Атрибуты тега <main>

У тега нет специфических атрибутов.

Глобальные атрибуты

Тег поддерживает все глобальные атрибуты HTML.

Ограничения

Тег должен использоваться только один раз на странице. Его нельзя добавлять внутри другого тега <main>.

Нюансы

Если не использовать тег <main>, скринридерам и поисковым системам будет сложнее определить основное содержимое страницы.

Поддержка браузерами

Тег поддерживается всеми современными браузерами. Актуальная информация — на сaniuse.

Альтернативные теги

Альтернативных тегов для тега <main> не существует.

Чем заменить тег

Если вы по какой-то причине не хотите использовать <main>, можете обернуть контент в <div> или <section>.

Актуальность

Тег <main> не устарел, можете использовать его в веб-разработке.


Хотите узнать больше об HTML-тегах?

Прочитайте справочник по HTML или познакомьтесь с вёрсткой на интерактивных тренажёрах в HTML Academy.


«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.

ТелеграмПодкастБесплатные учебники

Читать дальше

<ul>

Синтаксис, примеры использования, основные атрибуты.

Справочник
  • 25 января 2023

<video>

Синтаксис, примеры использования, основные атрибуты.

Справочник
  • 25 января 2023

<datalist>

Синтаксис, примеры использования, основные атрибуты.

Справочник
  • 25 января 2023

<caption>

Синтаксис, примеры использования, основные атрибуты.

Справочник
  • 25 января 2023