update(HTML): web/html/content_categories

files/uk/web/html/content_categories/index.md

@@ -14,17 +14,28 @@ page-type: guide
 - Категорії вмісту форм, що описують правила, спільні для елементів, котрі стосуються форм.
 - Особливі категорії вмісту, що описують рідкісні категорії, які поділяються лишень кількома елементами, іноді лише в конкретному контексті.
 
-> **Примітка:** Більш докладне обговорення таких категорій вмісту та відповідної їм функціональності лежить поза обсягом цієї статті; на цю тему може бути доречним прочитати [відповідні частини специфікації HTML](https://html.spec.whatwg.org/multipage/dom.html#kinds-of-content).
+> [!NOTE]
+> Більш докладне обговорення таких категорій вмісту та відповідної їм функціональності лежить поза обсягом цієї статті; на цю тему може бути доречним прочитати [відповідні частини специфікації HTML](https://html.spec.whatwg.org/multipage/dom.html#kinds-of-content).
 
-[![Діаграма Венна, що демонструє, як взаємовідносяться різні категорії вмісту. Наступні розділи пояснюють ці взаємини у текстовий спосіб.](content_categories_venn.png)](/uk/docs/Web/HTML/Content_categories/content_categories_venn.png)
+![Діаграма Венна, що демонструє, як взаємовідносяться різні категорії вмісту. Наступні розділи пояснюють ці взаємини у текстовий спосіб.](content_categories_venn.png)
 
 ## Головні категорії вмісту
 
 ### Вміст метаданих
 
-Елементи, що належать до категорії _вмісту метаданих_, видозмінюють представлення чи поведінку решти документа, задають посилання на інші документи чи доносять іншу _супутню_ інформацію.
+Елементи, що належать до категорії _вмісту метаданих_, видозмінюють представлення чи поведінку решти документа, задають посилання на інші документи чи доносять іншу _супутню_ інформацію. Все елементи в {{htmlelement("head")}}, серед яких `<title>`, `<link>`, `<script>`, `<style>`, а також менш вживаний `<base>`, є вмістом метаданих. Для метаданих, які не можуть бути представлені цими елементами, є елемент `<meta>`
 
-Елементи, що належать до цієї категорії: {{HTMLElement("base")}}, {{HTMLElement("link")}}, {{HTMLElement("meta")}}, {{HTMLElement("noscript")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}} і {{HTMLElement("title")}}.
+Елементи метаданих:
+
+- {{HTMLElement("base")}}
+- {{HTMLElement("link")}}
+- {{HTMLElement("meta")}}
+- {{HTMLElement("noscript")}}
+- {{HTMLElement("script")}}
+- {{HTMLElement("style")}}
+- {{HTMLElement("title")}}
+
+Частина з цих елементів належить до більш ніж однієї категорії вмісту. Наприклад, `<script>` – представник категорій вмісту: метаданих, потокових та оповідальних, а також є елементом підтримки сценаріїв; `<script>` можна застосовувати всюди, де очікуються елементи метаданих, оповідальні чи елементи підтримки сценаріїв.
 
 ### Потоковий вміст
 
@@ -123,21 +134,30 @@ page-type: guide
 
 Розділовий вміст, підмножина потокового вмісту, утворює [розділ у поточному плані](/uk/docs/Web/HTML/Element/Heading_Elements), визначаючи область дії елементів {{HTMLElement("header")}} і {{HTMLElement("footer")}}.
 
-Елементи, що належать до цієї категорії: {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("nav")}} і {{HTMLElement("section")}}.
+Розділові елементи:
+
+- {{HTMLElement("article")}}
+- {{HTMLElement("aside")}}
+- {{HTMLElement("nav")}}
+- {{HTMLElement("section")}}
 
 ### Заголовковий вміст
 
 Заголовковий вміст, підмножина потокового вмісту, визначає заголовок розділу. Це визначення застосовується як до розділів, позначених явним елементом [розділового вмісту](#rozdilovyi-vmist), так і до неявно визначених самим заголовковим вмістом.
 
-Елементи, що належать до цієї категорії – {{HTMLElement("Heading_Elements", "<code>&lt;h1&gt;</code>-<code>&lt;h6&gt;</code>")}} і {{HTMLElement("hgroup")}}.
+Заголовкові елементи:
+
+- {{HTMLElement("Heading_Elements", "<code>&lt;h1&gt;</code>-<code>&lt;h6&gt;</code>")}}
+- {{HTMLElement("hgroup")}}
 
-> **Примітка:** Хоч елемент {{HTMLElement("header")}} з високою ймовірністю міститиме заголовковий вміст, сам він не є заголовковим вмістом.
+> [!NOTE]
+> Хоч елемент {{HTMLElement("header")}} з високою ймовірністю міститиме заголовковий вміст, сам він не є заголовковим вмістом.
 
 ### Оповідальний вміст
 
 Оповідальний вміст, підмножина потокового вмісту, включає текст і розмітку всередині документа. Серії елементів оповідального вмісту утворюють абзаци.
 
-Елементи, що належать до цієї категорії:
+Оповідальні елементи:
 
 - {{HTMLElement("abbr")}}
 - {{HTMLElement("audio")}}
@@ -202,7 +222,9 @@ page-type: guide
 
 ### Вбудований вміст
 
-Вбудований вміст, підмножина потокового вмісту, імпортує інші ресурси чи вставляє в документ вміст з іншої мови розмітки чи простору імен. Серед елементів, що належать до цієї категорії:
+Вбудований вміст, підмножина потокового вмісту, імпортує інші ресурси чи вставляє в документ вміст з іншої мови розмітки чи простору імен.
+
+Елементи вбудованого вмісту:
 
 - {{HTMLElement("audio")}}
 - {{HTMLElement("canvas")}}
@@ -217,7 +239,9 @@ page-type: guide
 
 ### Інтерактивний вміст
 
-Інтерактивний вміст, підмножина потокового вмісту, включає елементи, котрі розроблені конкретно для взаємодії з користувачем. Серед елементів, що належать до цієї категорії:
+Інтерактивний вміст, підмножина потокового вмісту, включає елементи, котрі розроблені конкретно для взаємодії з користувачем.
+
+Елементи інтерактивного вмісту:
 
 - {{HTMLElement("button")}}
 - {{HTMLElement("details")}}
@@ -240,10 +264,84 @@ page-type: guide
 
 Вміст є відчутним, коли він не є ані порожнім, ані прихованим; це вміст, що виводиться і є істотним. Елементи, чия модель – потоковий вміст, повинні містити принаймні один вузол, що є відчутним.
 
+Відчутні елементи:
+
+- {{HTMLElement("a")}}
+- {{HTMLElement("abbr")}}
+- {{HTMLElement("address")}}
+- {{HTMLElement("article")}}
+- {{HTMLElement("aside")}}
+- {{HTMLElement("b")}}
+- {{HTMLElement("bdi")}}
+- {{HTMLElement("bdo")}}
+- {{HTMLElement("blockquote")}}
+- {{HTMLElement("button")}}
+- {{HTMLElement("canvas")}}
+- {{HTMLElement("cite")}}
+- {{HTMLElement("code")}}
+- {{HTMLElement("data")}}
+- {{HTMLElement("del")}}
+- {{HTMLElement("details")}}
+- {{HTMLElement("dfn")}}
+- {{HTMLElement("div")}}
+- {{HTMLElement("em")}}
+- {{HTMLElement("embed")}}
+- {{HTMLElement("fieldset")}}
+- {{HTMLElement("footer")}}
+- {{HTMLElement("figure")}}
+- {{HTMLElement("form")}}
+- {{HtmlElement("iframe")}}
+- {{HtmlElement("img")}}
+- {{HtmlElement("ins")}}
+- {{HtmlElement("kbd")}}
+- {{HtmlElement("label")}}
+- {{HtmlElement("main")}}
+- {{HtmlElement("map")}}
+- {{HtmlElement("mark")}}
+- {{MathMLElement("math")}} з [MathML](/uk/docs/Web/MathML)
+- {{HtmlElement("meter")}}
+- {{HtmlElement("nav")}}
+- {{HtmlElement("object")}}
+- {{HtmlElement("p")}}
+- {{HtmlElement("picture")}}
+- {{HtmlElement("pre")}}
+- {{HtmlElement("progress")}}
+- {{HtmlElement("q")}}
+- {{HtmlElement("ruby")}}
+- {{HtmlElement("s")}}
+- {{HtmlElement("samp")}}
+- {{HtmlElement("search")}}
+- {{HtmlElement("section")}}
+- {{HtmlElement("select")}}
+- {{HtmlElement("small")}}
+- {{HtmlElement("span")}}
+- {{HtmlElement("strong")}}
+- {{HtmlElement("sub")}}
+- {{HtmlElement("sup")}}
+- {{SVGElement("svg")}} з [SVG](/uk/docs/Web/SVG)
+- {{HtmlElement("table")}}
+- {{HtmlElement("textarea")}}
+- {{HtmlElement("time")}}
+- {{HtmlElement("u")}}
+- {{HtmlElement("var")}}
+- {{HtmlElement("video")}}
+- [Автономні кастомні елементи](/uk/docs/Web/API/Web_components/Using_custom_elements)
+- текст, що не є [пробілом](/uk/docs/Glossary/Whitespace) між елементами
+
+Частина елементів належить до цієї категорії лише за певних умов:
+
+- {{HTMLElement("audio")}}, якщо присутній атрибут [`controls`](/uk/docs/Web/HTML/Element/audio#controls)
+- {{HTMLElement("dl")}}, якщо серед дочірніх елементів є хоча б одна група назва-значення
+- {{HTMLElement("input")}}, якщо атрибут [type](/uk/docs/Web/HTML/Element/input#type-typ) не перебуває в стані прихованості
+- {{HTMLElement("ol")}}, якщо серед дочірніх елементів є хоча б один елемент {{HTMLElement("li")}}
+- {{HTMLElement("ul")}}, якщо серед дочірніх елементів є хоча б один елемент {{HTMLElement("li")}}
+
 ### Формовий вміст
 
 Формовий вміст – це підмножина потокового вмісту, що складається з елементів, котрі мають форму-власника, представлену в атрибуті **form**, і може використовуватися всюди, де очікується потоковий вміст. Форма-власник може бути або контейнерним елементом {{HTMLElement("form")}}, або елементом, чий id вказаний в атрибуті **form**.
 
+Елементи, що стосуються форм:
+
 - {{HTMLElement("button")}}
 - {{HTMLElement("fieldset")}}
 - {{HTMLElement("input")}}
@@ -281,21 +379,28 @@ page-type: guide
 
 ## Модель прозорого вмісту
 
-Коли елемент має модель прозорого вмісту, то його вміст мусить мати таку структуру, що була б дійсним HTML 5, навіть коли сам прозорий елемент був би прибраний і заміщений власними дочірніми елементами.
+Коли елемент має модель прозорого вмісту, то його вміст мусить мати таку структуру, що була б валідним HTML, навіть коли сам прозорий елемент був би прибраний і заміщений власними дочірніми елементами.
 
 Наприклад, елементи {{HTMLElement("del")}} і {{HTMLElement("ins")}} – є прозорими:
 
 ```html
-<p>
-  Ми вважаємо ці істини <del><em>священними &amp; незаперечними</em></del>
-  <ins>самоочевидними</ins>.
-</p>
+<p>Список <del>покупок</del> <ins>повернення</ins></p>
+<ul>
+  <del>
+    <li>Апельсини</li>
+    <li>Туалетний папір</li>
+  </del>
+  <li>Зубна паста</li>
+</ul>
 ```
 
 Якщо ці елементи прибрати, то такий уривок все одно буде дійсним HTML (хоч і не коректною українською).
 
 ```html
-<p>
-  Ми вважаємо ці істини <em>священними &amp; незаперечними</em> самоочевидними.
-</p>
+<p>Список покупок повернення</p>
+<ul>
+  <li>Апельсини</li>
+  <li>Туалетний папір</li>
+  <li>Зубна паста</li>
+</ul>
 ```