initial commit

1 files changed, 175 insertions, 0 deletions

diff --git a/files/ru/web/html/element/main/index.html b/files/ru/web/html/element/main/index.html
new file mode 100644
index 0000000000..44b9b4db78
--- /dev/null
+++ b/files/ru/web/html/element/main/index.html
@@ -0,0 +1,175 @@
+---
+title: <main>
+slug: Web/HTML/Element/main
+tags:
+  - Element
+  - HTML
+  - HTML группировка контента
+  - HTML секции
+  - main
+  - Справка
+  - Элемент
+translation_of: Web/HTML/Element/main
+---
+<div>{{HTMLRef}}</div>
+
+<p><span class="seoSummary"><strong>HTML-элемент <code>&lt;main&gt;</code></strong> предназначен для основного контента (содержимого) {{HTMLElement("body")}} документа (страницы). Основной контент состоит из контента, который непосредственно относится к главной теме документа или ее развивает.</span></p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/main.html","tabbed-shorter")}}</div>
+
+<p class="hidden">Исходный код этого интерактивного примера хранится в репозитории GitHub. Если вы хотите внести свой вклад в проект интерактивных примеров, пожалуйста клонируйте <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> и отправте нам "pull request" (предложение изменения кода в чужом репозитории).</p>
+
+<p>Документ не должен иметь более одного элемента <code>&lt;main&gt;</code> у которого не указан атрибут {{htmlattrxref("hidden")}}.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th><a href="/ru/docs/Web/Guide/HTML/Content_categories">Категории контента</a></th>
+   <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Явный_контент">явный контент</a>.</td>
+  </tr>
+  <tr>
+   <th>Разрешенное содержимое</th>
+   <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a>.</td>
+  </tr>
+  <tr>
+   <th>Пропуск тега</th>
+   <td>Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.</td>
+  </tr>
+  <tr>
+   <th>Разрешенные родительские элементы</th>
+   <td>Те, в которых разрешается <a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">контент основного потока</a> в качестве содержимого, но только если это <a href="https://html.spec.whatwg.org/multipage/grouping-content.html#hierarchically-correct-main-element" id="the-main-element:hierarchically-correct-main-element">иерархически корректный <code>main</code> элемент</a>.</td>
+  </tr>
+  <tr>
+   <th>Разрешенные ARIA роли</th>
+   <td>Роль <code>main</code> применяется к <code>&lt;main&gt;</code> по умолчанию, и роль <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_presentation_role">presentation</a></code> также разрешена.</td>
+  </tr>
+  <tr>
+   <th>DOM-интерфейс</th>
+   <td>{{domxref("HTMLElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Атрибуты">Атрибуты</h2>
+
+<p>К этому элементу применимы только <a href="/ru/docs/Web/HTML/%D0%9E%D0%B1%D1%89%D0%B8%D0%B5_%D0%B0%D1%82%D1%80%D0%B8%D0%B1%D1%83%D1%82%D1%8B">глобальные атрибуты</a>.</p>
+
+<h2 id="Примечание">Примечание</h2>
+
+<p>Содержимое элемента <code>&lt;main&gt;</code> должно быть уникальным для документа. Содержимое, которое повторяется в наборе документов или разделах документа, такое как боковые панели, навигационные ссылки, информация об авторских правах, логотипы сайта и поисковые формы, не должно добавляться, за исключением формы поиска, если она является основной функцией страницы.</p>
+
+<p><code>&lt;main&gt;</code> не вносит вклад в структуру документа; то есть, в отличие от таких элементов, как {{HTMLElement("body")}}, заголовков, таких как {{HTMLElement("h2")}} и т.п., <code>&lt;main&gt;</code> не влияет на концепцию {{glossary("DOM")}} структуры страницы. Он носит исключительно информативный характер.</p>
+
+<h2 id="Пример">Пример</h2>
+
+<pre class="brush: html">&lt;!-- другой контент --&gt;
+
+&lt;main&gt;
+  &lt;h1&gt;Яблоки&lt;/h1&gt;
+  &lt;p&gt;Яблоко - плод яблони, который употребляется в пищу в свежем виде, служит сырьём в кулинарии и для приготовления напитков.&lt;/p&gt;
+
+  &lt;article&gt;
+    &lt;h2&gt;Сорт "Ред Делишес"&lt;/h2&gt;
+    &lt;p&gt;Эти ярко-красные яблоки являются одними из самых популярных в Соединенных Штатах.&lt;/p&gt;
+    &lt;p&gt;... &lt;/p&gt;
+    &lt;p&gt;... &lt;/p&gt;
+  &lt;/article&gt;
+
+  &lt;article&gt;
+    &lt;h2&gt;Сорт "Гренни Смит";/h2&gt;
+    &lt;p&gt;Эти сочные, зеленые яблоки являются одними из самых популярных в мире.&lt;/p&gt;
+    &lt;p&gt;... &lt;/p&gt;
+    &lt;p&gt;... &lt;/p&gt;
+  &lt;/article&gt;
+&lt;/main&gt;
+
+&lt;!-- другой контент --&gt;</pre>
+
+<h3 id="Результат">Результат</h3>
+
+<p>{{EmbedLiveSample("Пример")}}</p>
+
+<h2 id="Проблемы_доступности">Проблемы доступности</h2>
+
+<h3 id="Ориентир">Ориентир</h3>
+
+<p>Элемент <code>&lt;main&gt;</code> ведет себя как <a href="/en-US/docs/Web/Accessibility/ARIA/Roles/Main_role">роль-ориентир <code>main</code></a>. <a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques#Landmark_roles">Ориентиры</a> могут использоваться вспомогательными технологиями для быстрой идентификации и навигации по большим разделам документа. Предпочтительно использовать элемент <code>&lt;main&gt;</code> вместо объявления <code>role="main"</code>, если не нужна <a href="/ru/docs/Web/HTML/Element/main#%D0%9F%D0%BE%D0%B4%D0%B4%D0%B5%D1%80%D0%B6%D0%BA%D0%B0_%D0%B1%D1%80%D0%B0%D1%83%D0%B7%D0%B5%D1%80%D0%B0%D0%BC%D0%B8">поддержка старых браузеров</a>.</p>
+
+<h3 id="Пропуск_навигации">Пропуск навигации</h3>
+
+<p>Пропуск навигации, также известный как "skipnav", это техника которая позволяет пользователю вспомогательных технологий совершать быстрый обход больших разделов повторяющегося контента (главная навигация, информационные баннеры и т.д.). Это позволяет пользователю получить доступ к основному контенту страницы быстрее.</p>
+
+<p>Добавление атрибута {{htmlattrxref("id")}} в элемент <code>&lt;main&gt;</code> позволяет ему становится целью для ссылки пропуска навигации.</p>
+
+<pre><span class="tag">&lt;body</span><span class="tag">&gt;
+  &lt;a href="#main-content"&gt;Перейти к основному контенту&lt;/a&gt;
+
+  &lt;!-- навигация и заголовок контента --&gt;
+
+  &lt;main id="main-content"&gt;
+    &lt;!-- основной контент страницы --&gt;
+  &lt;/main&gt;
+&lt;/body&gt;</span>
+</pre>
+
+<ul>
+ <li><a href="https://webaim.org/techniques/skipnav/">WebAIM: Ссылки "Пропуск навигации"</a></li>
+</ul>
+
+<h3 id="Режим_чтения">Режим чтения</h3>
+
+<p>Функционально режим чтения браузера будет искать наличие элемента <code>&lt;main&gt;</code>, а также элементов <a href="/ru/docs/Web/HTML/Element/Heading_Elements">заголовка</a> и <a href="/ru/docs/Web/HTML/Element#%D0%A1%D0%B5%D0%BA%D1%86%D0%B8%D0%BE%D0%BD%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5_%D1%81%D0%BE%D0%B4%D0%B5%D1%80%D0%B6%D0%B0%D0%BD%D0%B8%D1%8F">секционных элементов</a>, которые преобразовывают контент в специальный вид для чтения.</p>
+
+<ul>
+ <li><a href="https://medium.com/@mandy.michael/building-websites-for-safari-reader-mode-and-other-reading-apps-1562913c86c9">Создание сайтов для режима чтения Safari и других программ чтения.</a></li>
+</ul>
+
+<h2 id="Спецификации">Спецификации</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Спецификация</th>
+   <th scope="col">Статус</th>
+   <th scope="col">Комментарий</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', '#the-main-element', '&lt;main&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', 'grouping-content.html#the-main-element', '&lt;main&gt;')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Нет изменений с {{SpecName('HTML5 W3C')}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-main-element', '&lt;main&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Первоначальное определение.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Поддержка_браузерами">Поддержка браузерами</h2>
+
+<p>Элемент <code>&lt;main&gt;</code> широко поддерживается. Для Internet Explorer 11 и ниже предлагается добавить роль {{glossary("ARIA")}} <code>"main"</code> в элемент <code>&lt;main&gt;</code>, чтобы обеспечит его доступность (программы для чтения с экрана, такие как JAWS, используемые совместно со старыми версиями Internet Explorer, смогут понять семантическое значение элемента <code>&lt;main&gt;</code> после добавления атрибута <code>role</code>).</p>
+
+<pre class="brush: html">&lt;main role="main"&gt;
+  ...
+&lt;/main&gt;
+</pre>
+
+<div class="hidden">Таблица совместимости на этой странице генерируется из структурированных данных. Если вы хотите внести свой вклад в эти данные, пожалуйста проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам "pull request" (предложение изменения кода в чужом репозитории).</div>
+
+<p>{{Compat("html.elements.main")}}</p>
+
+<h2 id="Смотрите_также">Смотрите также</h2>
+
+<ul>
+ <li>Основные структурные элементы: {{HTMLElement("html")}}, {{HTMLElement("head")}}, {{HTMLElement("body")}}</li>
+ <li>Связанные с этим разделом элементы: {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, or {{HTMLElement("nav")}}</li>
+ <li><a href="/en-US/docs/Web/Accessibility/ARIA/Roles/Main_role">ARIA: роль main</a></li>
+</ul>