Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Перелинковывает материалы в разделе Доступность (2) #4639

Merged
merged 1 commit into from
Aug 2, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
18 changes: 9 additions & 9 deletions a11y/aria-setsize/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,13 +22,13 @@ tags:

`aria-setsize` можно задавать только некоторым тегам и ролям:

- [`<article>`](/html/article/) или роли `article`.
- [`<tr>`](/html/tables/#tr) или `row`.
- [`<li>`](/html/li/) и `listitem`.
- [`<option>`](/html/option/) или `option`.
- [`<input type="radio">`](/html/input/#type) или `radio`.
- [`<article>`](/html/article/) или роли [`article`](/a11y/role-article/).
- [`<tr>`](/html/tables/#tr) или [`row`](/a11y/role-row/).
- [`<li>`](/html/li/) и [`listitem`](/a11y/role-listitem/).
- [`<option>`](/html/option/) или [`option`](/a11y/role-option/).
- [`<input type="radio">`](/html/input/#type) или [`radio`](/a11y/role-radio/).
- [`tab`](/a11y/role-tab/).
- `menuitem`, `menuitemcheckbox`, `menuitemradio`.
- `treeitem`.
- `comment`.
- `associationlistitemkey`, `associationlistitemvalue`.
- [`menuitem`](/a11y/role-menuitem/), [`menuitemcheckbox`](/a11y/role-menuitemcheckbox/), [`menuitemradio`](/a11y/role-menuitemradio/).
- [`treeitem`](/a11y/role-treeitem/).
- [`comment`](/a11y/role-comment/).
- [`associationlistitemkey`](/a11y/role-associationlistitemkey/), [`associationlistitemvalue`](/a11y/role-associationlistitemvalue/).
6 changes: 3 additions & 3 deletions a11y/aria-sort/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@ description: "ARIA-атрибут для сортировки содержимо
authors:
- doka-dog
related:
- a11y/aria-intro
- a11y/aria-attrs
- a11y/role-rowheader
- a11y/role-columnheader
- html/tables
tags:
- doka
Expand All @@ -25,4 +25,4 @@ tags:
- `descending` — сортировка по убыванию.
- `other` — другой способ сортировки.

`aria-sort` можно задавать только заголовкам таблиц или сеток — [`<th>`](/html/tables/#th) или ролям `columnheader` и `rowheader`.
`aria-sort` можно задавать только заголовкам таблиц или сеток — [`<th>`](/html/tables/#th) или ролям [`columnheader`](/a11y/role-columnheader/) и [`rowheader`](/a11y/role-rowheader/).
10 changes: 5 additions & 5 deletions a11y/aria-valuemax/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,9 @@ tags:

`aria-valuemax` можно задавать только некоторым тегам и ролям:

- [`<input type="range">`](/html/input/#type) или ролям `range` и `slider`;
- [`<input type="number">`](/html/input/#type) или `spinbutton`;
- [`<input type="range">`](/html/input/#type) или роли [`slider`](/a11y/role-slider/);
- [`<input type="number">`](/html/input/#type) или [`spinbutton`](/a11y/role-spinbutton/);
- [`separator`](/a11y/role-separator/), когда разделитель интерактивный;
- [`<meter>`](/html/meter/) или `meter`;
- [`<progress>`](/html/progress/) или `progressbar`;
- `scrollbar`.
- [`<meter>`](/html/meter/) или [`meter`](/a11y/role-meter/);
- [`<progress>`](/html/progress/) или [`progressbar`](/a11y/role-progressbar/);
- [`scrollbar`](/a11y/role-scrollbar/).
10 changes: 5 additions & 5 deletions a11y/aria-valuemin/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,9 @@ tags:

`aria-valuemin` можно задавать только некоторым тегам и ролям:

- [`<input type="range">`](/html/input/#type) или ролям `range` и `slider`;
- [`<input type="number">`](/html/input/#type) или `spinbutton`;
- [`<input type="range">`](/html/input/#type) или роли [`slider`](/a11y/role-slider/);
- [`<input type="number">`](/html/input/#type) или [`spinbutton`](/a11y/role-spinbutton/);
- [`separator`](/a11y/role-separator/), когда разделитель интерактивный;
- [`<meter>`](/html/meter/) или `meter`;
- [`<progress>`](/html/progress/) или `progressbar`;
- `scrollbar`.
- [`<meter>`](/html/meter/) или [`meter`](/a11y/role-meter/);
- [`<progress>`](/html/progress/) или [`progressbar`](/a11y/role-progressbar/);
- [`scrollbar`](/a11y/role-scrollbar/).
10 changes: 5 additions & 5 deletions a11y/aria-valuenow/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,12 +22,12 @@ tags:

`aria-valuenow` можно задавать только некоторым тегам и [ARIA-ролям](/a11y/aria-roles/):

- [`<input type="range">`](/html/input/#type) или `range` и `slider`;
- [`<input type="number">`](/html/input/#type) или `spinbutton`;
- [`<input type="range">`](/html/input/#type) или роли [`slider`](/a11y/role-slider/);
- [`<input type="number">`](/html/input/#type) или [`spinbutton`](/a11y/role-spinbutton/);
- [`separator`](/a11y/role-separator/), когда разделитель интерактивный;
- [`<meter>`](/html/meter/) или `meter`;
- [`<progress>`](/html/progress/) или `progressbar`;
- `scrollbar`.
- [`<meter>`](/html/meter/) или [`meter`](/a11y/role-meter/);
- [`<progress>`](/html/progress/) или [`progressbar`](/a11y/role-progressbar/);
- [`scrollbar`](/a11y/role-scrollbar/).

Когда у элемента есть максимальное и минимальное значения, не забудьте добавить ещё [`aria-valuemax`](/a11y/aria-valuemax/) и [`aria-valuemin`](/a11y/aria-valuemin/).

Expand Down
10 changes: 5 additions & 5 deletions a11y/aria-valuetext/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,11 +22,11 @@ tags:

`aria-valuetext` можно задавать только некоторым тегам и [ARIA-ролям](/a11y/aria-roles/):

- [`<input type="range">`](/html/input/#type) или `range` и `slider`;
- [`<input type="number">`](/html/input/#type) или `spinbutton`;
- [`<input type="range">`](/html/input/#type) или роли [`slider`](/a11y/role-slider/);
- [`<input type="number">`](/html/input/#type) или [`spinbutton`](/a11y/role-spinbutton/);
- [`separator`](/a11y/role-separator/), когда разделитель интерактивный;
- [`<meter>`](/html/meter/) или `meter`;
- [`<progress>`](/html/progress/) или `progressbar`;
- `scrollbar`.
- [`<meter>`](/html/meter/) или [`meter`](/a11y/role-meter/);
- [`<progress>`](/html/progress/) или [`progressbar`](/a11y/role-progressbar/);
- [`scrollbar`](/a11y/role-scrollbar/).

Когда задаёте `aria-valuetext`, не забудьте также указать [`aria-valuenow`](/a11y/aria-valuenow/), если известно текущее значение.
2 changes: 1 addition & 1 deletion a11y/role-application/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,6 @@ tags:

Задайте тегу `role="application"`, лучше всего [`<div>`](/html/div/) или [`<span>`](/html/span/). Используйте эту роль только когда точно не подходит никакая другая.

Внутри контейнера с ролью `application` могут находиться интерактивные элементы и обычный текст внутри элементов с ролями [`document`](/a11y/role-document/) или `article`.
Внутри контейнера с ролью `application` могут находиться интерактивные элементы и обычный текст внутри элементов с ролями [`document`](/a11y/role-document/) или [`article`](/a11y/role-article/).

Элементам с ролью `application` можно задавать все [глобальные ARIA-атрибуты](/a11y/aria-attrs/#globalnye-atributy), [атрибут связи](/a11y/aria-attrs/#atributy-svyazi) [`aria-activedescendant`](/a11y/aria-activedescendant/) и некоторые [атрибуты виджетов](/a11y/aria-attrs/#atributy-vidzhetov) — [`aria-disabled`](/a11y/aria-disabled/), [`aria-errormessage`](/a11y/aria-errormessage/), [`aria-expanded`](/a11y/aria-expanded/), [`aria-haspopup`](/a11y/aria-haspopup/) и [`aria-invalid`](/a11y/aria-invalid/).
2 changes: 1 addition & 1 deletion a11y/role-associationlist/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,6 @@ tags:

Задайте тегу `role="associationlist"`. Для этого больше всего подходит [`<span>`](/html/span/) или [`div`](/html/div/).

Внутри элемента `associationlistitemkey` обязательно должны быть ключ `associationlistitemkey` и связанное с ним значение `associationlistitemvalue`.
Внутри элемента `associationlistitemkey` обязательно должны быть ключ [`associationlistitemkey`](/a11y/role-associationlistitemkey/) и связанное с ним значение [`associationlistitemvalue`](/a11y/role-associationlistitemvalue/).

Элементам с ролью `associationlist` можно также задавать все [глобальные ARIA-атрибуты](/a11y/aria-attrs/#globalnye-atributy).
4 changes: 2 additions & 2 deletions a11y/role-associationlistitemkey/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ keywords:
- car-элемент
- key
related:
- a11y/aria-posinset
- a11y/role-associationlist
- a11y/aria-level
- a11y/aria-setsize
tags:
Expand All @@ -37,6 +37,6 @@ tags:

Задайте тегу `role="associationlistitemkey"`. Для этого больше всего подходит [`<span>`](/html/span/) или [`div`](/html/div/).

Элемент `associationlistitemkey` обязательно должен быть вложен внутрь ассоциативного списка с ролью `associationlist`. Также рядом с ключом должно находиться связанное с ним значение с `associationlistitemvalue`.
Элемент `associationlistitemkey` обязательно должен быть вложен внутрь ассоциативного списка с ролью [`associationlist`](/a11y/role-associationlist/). Также рядом с ключом должно находиться связанное с ним значение с [`associationlistitemvalue`](/a11y/role-associationlistitemvalue/).

Элементам с ролью `associationlistitemkey` можно задавать все [глобальные ARIA-атрибуты](/a11y/aria-attrs/#globalnye-atributy) и атрибуты виджетов [`aria-level`](/a11y/aria-level/), [`aria-posinset`](/a11y/aria-posinset/) и [`aria-setsize`](/a11y/aria-setsize/).
4 changes: 2 additions & 2 deletions a11y/role-associationlistitemvalue/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ keywords:
- cdr-элемент
- datum
related:
- a11y/aria-roles
- a11y/role-associationlist
- a11y/aria-posinset
- a11y/aria-setsize
tags:
Expand All @@ -37,6 +37,6 @@ tags:

Задайте тегу `role="associationlistitemvalue"`. Для этого больше всего подходит [`<span>`](/html/span/) или [`div`](/html/div/).

Элемент `associationlistitemvalue` обязательно должен быть вложен внутрь ассоциативного списка с ролью `associationlist`. Также рядом с ним должен находиться связанный с ним ключ с `associationlistitemkey`.
Элемент `associationlistitemvalue` обязательно должен быть вложен внутрь ассоциативного списка с ролью [`associationlist`](/a11y/role-associationlist/). Также рядом с ним должен находиться связанный с ним ключ с [`associationlistitemkey`](/a11y/role-associationlistitemkey/).

Элементам с ролью `associationlistitemvalue` можно задавать все [глобальные ARIA-атрибуты](/a11y/aria-attrs/#globalnye-atributy) и атрибуты виджетов [`aria-posinset`](/a11y/aria-posinset/) и [`aria-setsize`](/a11y/aria-setsize/).
6 changes: 3 additions & 3 deletions a11y/role-caption/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,16 +16,16 @@ tags:

[Роль структуры документа](/a11y/aria-roles/#roli-struktury-dokumenta) из [WAI-ARIA](/a11y/aria-intro/#specifikaciya) для видимой подписи к таблице, обычной или древовидной сетке и автономного графического содержимого.

В HTML эта роль есть у [`<caption>`](/html/caption/) и [`<figcaption>`](/html/figure-figcaption/) по умолчанию.
В HTML эта роль есть у [`<caption>`](/html/caption/) по умолчанию.

## Как пишется

Задайте тегу `role="caption"`, лучше всего [`<div>`](/html/div/) или [`<span>`](/html/span/). При этом для [`<table>`](/html/tables/) лучше использовать в первую очередь `<caption>`, а для [`<figure>`](/html/figure-figcaption/) — `<figcaption>`.

Элементы с `caption` могут быть описывать только некоторые элементы и [ARIA-роли](/a11y/aria-roles/):

- `<figure>` или роль `figure`;
- `<table>` или роль `table`;
- `<figure>` или роль [`figure`](/a11y/role-figure/);
- `<table>` или роль [`table`](/a11y/role-table/);
- [`grid`](/a11y/role-grid/);
- [`treegrid`](/a11y/role-treegrid/).

Expand Down
4 changes: 2 additions & 2 deletions a11y/role-cell/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ description: "Роль ячейки обычной таблицы."
authors:
- doka-dog
related:
- a11y/aria-colindex
- a11y/role-row
- a11y/role-table
- html/tables
tags:
Expand All @@ -22,6 +22,6 @@ tags:

Задайте тегу `role="cell"`, лучше всего [`<div>`](/html/div/) или [`<span>`](/html/span/). В большинстве случаев используйте тег `<td>`.

Ячейка обязательно должна быть вложена в контейнер с ролью `row`, которая есть по умолчанию у [`<tr>`](/html/tables/#tr).
Ячейка обязательно должна быть вложена в контейнер с ролью [`row`](/a11y/role-row/), которая есть по умолчанию у [`<tr>`](/html/tables/#tr).

Элементам с ролью `cell` можно задавать все [глобальные ARIA-атрибуты](/a11y/aria-attrs/#globalnye-atributy), а также некоторые [атрибуты связи](/a11y/aria-attrs/#atributy-svyazi) — [`aria-colindex`](/a11y/aria-colindex/), [`aria-colspan`](/a11y/aria-colspan/), [`aria-rowindex`](/a11y/aria-rowindex/) и [`aria-rowspan`](/a11y/aria-rowspan/).
2 changes: 1 addition & 1 deletion a11y/role-combobox/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ tags:

ARIA-роли не изменяют внешний вид и поведение элементов, поэтому не забудьте стилизовать список и добавить поддержку клавиатуры с помощью JavaScript и [`tabindex`](/html/global-attrs/#tabindex), когда используете неинтерактивный элемент.

Элемент `combobox` важно связать с выпадающим списком с опциями для выбора из элементов с `listbox`, [`tree`](/a11y/role-tree/), `grid` или [`dialog`](/a11y/role-dialog/) с помощью [`aria-controls`](/a11y/aria-controls/).
Элемент `combobox` важно связать с выпадающим списком с опциями для выбора из элементов с [`listbox`](/a11y/role-listbox/), [`tree`](/a11y/role-tree/), [`grid`](/a11y/role-grid/) или [`dialog`](/a11y/role-dialog/) с помощью [`aria-controls`](/a11y/aria-controls/).

У комбинированного списка обязательно должен быть атрибут [`aria-expanded`](/a11y/aria-expanded/).

Expand Down
2 changes: 1 addition & 1 deletion a11y/role-comment/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ description: "Роль для комментариев."
authors:
- doka-dog
related:
- a11y/aria-owns
- a11y/role-suggestion
- a11y/aria-level
- a11y/aria-details
tags:
Expand Down
2 changes: 1 addition & 1 deletion a11y/role-deletion/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ description: "Роль для удалённого содержимого."
authors:
- doka-dog
related:
- a11y/aria-roles
- a11y/role-insertion
- html/ins
- html/del
tags:
Expand Down
4 changes: 2 additions & 2 deletions a11y/role-feed/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ description: "Роль для части страницы с фидом."
authors:
- doka-dog
related:
- a11y/aria-roles
- a11y/role-article
- html/section
- html/article
tags:
Expand All @@ -22,7 +22,7 @@ tags:

Задайте тегу `role="feed"`, лучше всего [`<div>`](/html/div/), [`<span>`](/html/span/) или [`<section>`](/html/section/).

Внутри контейнера с ролью `feed` обычно помещают список из элементов с ролями `article`. Она есть по умолчанию у тега [`<article>`](/html/article/).
Внутри контейнера с ролью `feed` обычно помещают список из элементов с ролями [`article`](/a11y/role-article/). Она есть по умолчанию у тега [`<article>`](/html/article/).

Хорошо добавить элементы в фиде в порядок фокуса с помощью [`tabindex`](/html/global-attrs/#tabindex) или другим способом.

Expand Down
2 changes: 1 addition & 1 deletion a11y/role-figure/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ tags:

Задайте тегу `role="figure"`, лучше всего [`<div>`](/html/div/) или [`<span>`](/html/span/). В большинстве случаев лучше использовать `<figure>`.

У элементов с `figure` может быть подпись или подробное описание с ролью `caption`. Подпись можно добавить напрямую к `figure` с помощью [`aria-label`](/a11y/aria-label/). Когда используете `caption` с краткой подписью, не забудьте связать основной элемент с ней благодаря [`aria-labelledby`](/a11y/aria-labelledby/), а если это более расширенное описание — [`aria-describedby`](/a11y/aria-describedby/).
У элементов с `figure` может быть подпись или подробное описание с ролью [`caption`](/a11y/role-caption/). Подпись можно добавить напрямую к `figure` с помощью [`aria-label`](/a11y/aria-label/). Когда используете `caption` с краткой подписью, не забудьте связать основной элемент с ней благодаря [`aria-labelledby`](/a11y/aria-labelledby/), а если это более расширенное описание — [`aria-describedby`](/a11y/aria-describedby/).

Внутри элемента `figure` может быть интерактивный контент.

Expand Down
2 changes: 1 addition & 1 deletion a11y/role-grid/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ tags:

Задайте `role="grid"` любому тегу, но лучше всего [`<div>`](/html/div/), [`<span>`](/html/span/) или [`<table>`](/html/tables/).

Внутри элемента с ролью `grid` должно быть несколько ячеек с ролью `gridcell`.
Внутри элемента с ролью `grid` должно быть несколько ячеек с ролью [`gridcell`](/a11y/role-gridcell/).

ARIA-роли не изменяют внешний вид и поведение элементов, поэтому не забудьте стилизовать сетку с помощью CSS и добавить поддержку клавиатуры с помощью JavaScript и [`tabindex`](/html/global-attrs/#tabindex).

Expand Down