diff --git a/files/uk/web/html/element/header/index.md b/files/uk/web/html/element/header/index.md index ab26173ac0..59b0bbb5ba 100644 --- a/files/uk/web/html/element/header/index.md +++ b/files/uk/web/html/element/header/index.md @@ -1,5 +1,5 @@ --- -title: "
– Заголовок" +title: "
– Шапка шапки" slug: Web/HTML/Element/header page-type: html-element browser-compat: html.elements.header @@ -7,53 +7,53 @@ browser-compat: html.elements.header {{HTMLSidebar}} -**`
`** [HTML](/en-US/docs/Web/HTML) елемент представляє вступний вміст, як правило, групу вступних або навігаційних засобів. Він може містити деякі елементи заголовків, а також логотип, форму пошуку, ім'я автора та інші елементи. +Елемент [HTML](/uk/docs/Web/HTML) **`
`** (шапка, верхній колонтитул) представляє вступний вміст, як правило це група вступних або навігаційних засобів. Він може містити деякі елементи заголовків, а також логотип, форму пошуку, ім'я автора та інші елементи. {{EmbedInteractiveExample("pages/tabbed/header.html", "tabbed-standard")}} ## Примітки щодо використання -Значення елемента `
` ідентичне до глобальної ознаки [`banner`](/en-US/docs/Web/Accessibility/ARIA/Roles/banner_role) у разі відсутності її у контенті. Тоді елемент `
` не є ознакою. +Елемент `
` значить абсолютно те саме, що й роль-віха [`banner`](/uk/docs/Web/Accessibility/ARIA/Roles/banner_role), коли `
` не вкладено всередину розділового вмісту. Якщо вкладено, то елемент `
` не є віхою. -Елемент `
` може визначати глобальний заголовок сайту, який описується як `banner` в дереві доступності. Зазвичай він включає логотип, назву компанії, пошук і, можливо, глобальну навігацію або гасло. Зазвичай він знаходиться у верхній частині сторінки. +Елемент `
` може визначати глобальну шапку сайту, яка в дереві доступності описується як `banner`. Зазвичай шапка включає логотип, назву компанії, пошук і, можливо, глобальну навігацію або гасло. Зазвичай вона знаходиться у верхній частині сторінки. -У протилежному випадку, для цього використовується `section` в дереві доступності, і зазвичай містить заголовок навколишньої секції (елемент `h1` - `h6`) і можливий підзаголовок, але це не обов'язково. +У протилежному випадку, в дереві доступності цей елемент стає `section`, і зазвичай містить заголовок навколишнього розділу (елемент `h1` - `h6`) і необов'язковий підзаголовок, але це **не** вимагається. ### Історичне використання -Елемент `
` спочатку використовувався у самому початку HTML для заголовків. Продемонстровано у [Найперший веб-сайт](http://info.cern.ch/). В якись момент, заголовки стали [`

` через `

`](/en-US/docs/Web/HTML/Element/Heading_Elements), що доволило `
` вільно заповнівати різні ролі. +Елемент `
` у самому початку існував у HTML для заголовків. Це можна спостерігати в [найпершому вебсайті](http://info.cern.ch/). В якийсь момент, заголовки стали [`

` – `

`](/en-US/docs/Web/HTML/Element/Heading_Elements), що дозволило `
` зайняти іншу роль. ## Атрибути -Це елемент вкличає лише [глобальні атрибути](/en-US/docs/Web/HTML/Global_attributes). +Це елемент приймає лише [глобальні атрибути](/en-US/docs/Web/HTML/Global_attributes). ## Приклади -### Заголовок сторінки +### Шапка сторінки ```html

Назва головної сторінки

- MDN logo + Логотип MDN
``` #### Результат -{{EmbedLiveSample('Page Header')}} +{{EmbedLiveSample('shapka-storinky')}} -### Заголовок статті +### Шапка статті ```html

Планета Земля

- Опубліковано в Середу, Остап Мирний Миколайович + Опубліковано в Середу, Остапом Мирним

- Ми живемо на планеті, що зелена й блакитна, з багатьма речами, що ще невідомі. + Ми живемо на планеті, що зелена й блакитна, де так багато всього ще не бачило людське око.

Продовжити читання…

@@ -61,11 +61,11 @@ browser-compat: html.elements.header #### Результат -{{EmbedLiveSample('Article Header')}} +{{EmbedLiveSample('Shapka-statti')}} -## Зауваження до доступності +## Занепокоєння щодо доступності -Елемент `
` визначає ознаку [`banner`](/en-US/docs/Web/Accessibility/ARIA/Roles/banner_role), коли її контекст {{HTMLElement('body')}}. HTML заголовок не завжди вважається ознакою баннера коли він є нащадком елементів {{HTMLElement('article')}}, {{HTMLElement('aside')}}, {{HTMLElement('main')}}, {{HTMLElement('nav')}}, чи {{HTMLElement('section')}}. +Елемент `
` визначає віху [`banner`](/uk/docs/Web/Accessibility/ARIA/Roles/banner_role), коли його контекстом є {{HTMLElement('body')}}. Елемент шапки HTML не вважається віхою банера, коли є нащадком елемента {{HTMLElement('article')}}, {{HTMLElement('aside')}}, {{HTMLElement('main')}}, {{HTMLElement('nav')}} чи {{HTMLElement('section')}}. ## Технічний підсумок @@ -78,34 +78,34 @@ browser-compat: html.elements.header > - Потоковий вміст, - Дозволений вміствідчутний вміст. Дозволений вміст - Потоковий вміст, але буз <header> чи нащадку - {{HTMLElement("footer")}}. + >, але без жодних <header> і + {{HTMLElement("footer")}} серед нащадків. - Пропуск тегу - Жоден, обидва теги (початковий і закриваючий) обов'язкові. + Пропуск тега + Немає; і початковий, і кінцевий теги – обов'язкові. Дозволені батьки - Будь-який елемент, що приймає - вміст потоку. Зверніть увагу, що елемент <header> не повинет бути нащадком {{HTMLElement("address")}}, + Усі елементи, що приймають, + потоковий вміст. Зверніть увагу, що елемент <header> не повинен бути нащадком {{HTMLElement("address")}}, {{HTMLElement("footer")}} або іншого елемента {{HTMLElement("header")}}. @@ -113,18 +113,18 @@ browser-compat: html.elements.header Неявна роль ARIA - баннерBanner, чи загальнийgeneric - якщо нащадок + якщо елемент є нащадком article, aside, main, nav або section - або елемент де + або має role=article - Дозаолені ролі ARIA + Дозволені ролі ARIA - group, presentation або + group, presentation і none - Інтерфейс DOM'у + Інтерфейс DOM {{domxref("HTMLElement")}} -## Спецефікації +## Специфікації {{Specifications}} -## Сумісність з баузерами +## Сумісність зі баузерами {{Compat}} -## Див. також +## Дивіться також -- Інші секційні елементи: {{HTMLElement("body")}}, {{HTMLElement("nav")}}, {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("Heading_Elements", "h1")}}, {{HTMLElement("Heading_Elements", "h2")}}, {{HTMLElement("Heading_Elements", "h3")}}, {{HTMLElement("Heading_Elements", "h4")}}, {{HTMLElement("Heading_Elements", "h5")}}, {{HTMLElement("Heading_Elements", "h6")}}, {{HTMLElement("footer")}}, {{HTMLElement("section")}}, {{HTMLElement("address")}}. +- Інші елементи, що пов'язані з розділовістю: {{HTMLElement("body")}}, {{HTMLElement("nav")}}, {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("Heading_Elements", "h1")}}, {{HTMLElement("Heading_Elements", "h2")}}, {{HTMLElement("Heading_Elements", "h3")}}, {{HTMLElement("Heading_Elements", "h4")}}, {{HTMLElement("Heading_Elements", "h5")}}, {{HTMLElement("Heading_Elements", "h6")}}, {{HTMLElement("footer")}}, {{HTMLElement("section")}}, {{HTMLElement("address")}}.