1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
|
---
title: Доступность
slug: Learn/Доступность
tags:
- CSS
- HTML
- JavaScript
- Удобство
- доступность
translation_of: Learn/Accessibility
---
<div>{{LearnSidebar}}</div>
<p class="summary">Изучение HTML, CSS, и JavaScript полезно, если вы хотите стать веб-разработчиком, но ваши знания должны быть глубже обычного использования технологий — вы должны быть ответственны и максимизировать доступность ваших веб-приложений, не лишая никого возможности их использования. Чтобы достигнуть этого, вы можете следовать общепринятым лучшим практикам (которые демонстрируются в статьях посвященных <a href="/ru-RU/docs/Learn/HTML">HTML</a>, <a href="/ru-RU/docs/Learn/CSS">CSS</a> и <a href="/ru-RU/docs/Learn/JavaScript">JavaScript</a>), проводить <a href="/ru-RU/docs/Learn/Tools_and_testing/Cross_browser_testing">кросс-браузерное тестирование</a> и обращать внимание на доступность с самого начала. В этом модуле мы рассмотрим эту тему в деталях.</p>
<h2 id="Прежде_чем_начать">Прежде чем начать</h2>
<p>Чтобы разобраться с большей частью материалов этого модуля, хорошей идеей будет проходить одновременно один или несколько из модулей других тем (<a href="/ru-RU/docs/Learn/HTML">HTML</a>, <a href="/ru-RU/docs/Learn/CSS">CSS</a> или <a href="/ru-RU/docs/Learn/JavaScript">JavaScript</a>), или, что ещё лучше, пройти соответствующие части данного модуля во время изучения этих технологий.</p>
<div class="note">
<p><strong>Примечание</strong>: Если вы работаете на компьютере/планшете/другом устройстве, на котором у вас нет возможности создавать файлы, вы можете попробовать большую часть примеров кода в онлайн программах, таких как <a href="http://jsbin.com/">JSBin</a> или <a href="https://thimble.mozilla.org/">Thimble</a>.</p>
</div>
<h2 id="Справочники">Справочники</h2>
<dl>
<dt><a href="/ru/docs/Learn/Accessibility/What_is_accessibility">Что такое доступность?</a></dt>
<dd>Данная статья открывает модуль, в котором рассматривается, что такое доступность на самом деле — она включает в себя группы людей, которые нам нужно учитывать и почему, какие инструменты используют разные пользователи для взаимодействия с вебом, и как мы можем сделать доступность частью нашего рабочего процесса веб-разработки.</dd>
<dt><a href="/ru-RU/docs/Learn/Accessibility/HTML">HTML: Хорошая основа для доступности</a></dt>
<dd>Большая часть содержимого интернета может быть сделана доступной просто благодаря использованию HTML элементов по назначению. В этой статье подробно рассмотрено как HTML может быть использован для обеспечения максимальной доступности.</dd>
<dt><a href="/ru-RU/docs/Learn/Accessibility/CSS_and_JavaScript">Лучшие практики CSS и JavaScript для обеспечения доступности</a></dt>
<dd>CSS и JavaScript, при правильном использовании, также имеют потенциал для обеспечения доступности, но при неправильном использовании они могут существенно ухудшить доступность. Эта статья раскрывает некоторые из лучших практик CSS и JavaScript которые должны помочь сделать даже очень сложное содержимое как можно более доступным.</dd>
<dt><a href="/ru-RU/docs/Learn/Accessibility/WAI-ARIA_basics">Основы WAI-ARIA</a></dt>
<dd><em>Web Accessibility Initiative - Accessible Rich Internet Applications </em>— это технологический стандарт для предоставления возможности полноценного использования Интернета людьми с физическими ограничениями.<br>
Исходя из предыдущей статьи, иногда создание сложных элементов управления пользовательским интерфейсом, которые включают в себя не семантический HTML и динамический контент, обновляемый с помощью JavaScript, может быть затруднено. WAI-ARIA — это технология, которая может помочь в решении таких проблем, добавляя дополнительную семантику, которую браузеры и вспомогательные технологии могут распознавать и использовать, чтобы пользователи знали, что происходит. Здесь мы покажем, как использовать его на базовом уровне для улучшения доступности.</dd>
<dt><a href="/ru-RU/docs/Learn/Accessibility/Multimedia">Доступный мультимедиа контент</a></dt>
<dd>Другая категория контента, которая может создавать проблемы с доступностью, это мультимедиа — видео, аудио и изображения, которые должны быть предоставлены с надлежащей текстовой альтернативой, чтобы их могли понять с помощью вспомогательных технологий и их пользователи. В этой статье показано, как это можно сделать.</dd>
<dt><a href="/ru-RU/docs/Learn/Accessibility/Mobile">Доступность на мобильных устройствах</a></dt>
<dd>Поскольку веб-доступ на мобильных устройствах является настолько популярным, и на популярных платформах, таких как iOS и Android, есть полноценные средства обеспечения доступности, важно учитывать доступность вашего веб-контента для этих платформ. В этой статье рассматриваются соображения доступности для мобильных устройств.</dd>
</dl>
<h2 id="Проверка_знаний">Проверка знаний</h2>
<dl>
<dt><a href="/ru-RU/docs/Learn/Accessibility/Accessibility_troubleshooting">Найди недочеты в доступности</a></dt>
<dd>В этом блоке представлен достаточно простой сайт, в котором, однако, есть множество недочетов в доступности. Необходимо найти их и починить.</dd>
</dl>
<h2 id="Также_советуем_посмотреть">Также советуем посмотреть</h2>
<ul>
<li><a href="https://egghead.io/courses/start-building-accessible-web-applications-today">Начать создание доступных веб-приложений сегодня</a> — отличная серия видеоуроков Марси Саттона.</li>
<li><a href="https://dequeuniversity.com/resources/">Ресурсы университета Deque</a> — включает примеры кода, ссылки для чтения с экрана и другие полезные ресурсы.</li>
<li><a href="http://webaim.org/resources/">Ресурсы WebAIM</a> — включает руководства, контрольные списки, инструменты и многое другое.</li>
</ul>
|
