Цифровая доступность в Тильде

Делаем веб-среду доступной для всех и рассказываем, как вы можете повлиять на будущее интернета

Цифровая доступность в Тильде

Делаем веб-среду доступной для всех и рассказываем, как вы можете повлиять на будущее интернета
Цифровая доступность — это концепция, которая демократизирует технологии для людей, в том числе с инвалидностью и ограниченными возможностями здоровья
Цифровая доступность — это концепция, которая демократизирует технологии для людей, в том числе с инвалидностью и ограниченными возможностями здоровья
a11y — сокращение английского слова accessibility — доступность.
  • 1,3
    миллиарда людей в мире имеют значительные физические ограничения
  • 16%
    населения планеты живет с инвалидностью
  • 6
    это каждый шестой человек на планете. По данным ВОЗ в марте 2023
  • 1,3
    миллиарда людей в мире имеют значительные физические ограничения
  • 16%
    населения планеты живет с инвалидностью
  • 6
    это каждый шестой человек на планете. По данным ВОЗ в марте 2023

Создавайте сайты, которыми смогут пользоваться люди с физическими и когнитивными ограничениями

На Тильде создают сайты, которые дружелюбны для большинства людей, в том числе с инвалидностью и ограниченными возможностями здоровья. Платформа позволяет создавать проекты для всех людей. Рассказываем, как развивается цифровая доступность Тильды.

Создавайте сайты, которыми смогут пользоваться люди с физическими и когнитивными ограничениями

На Тильде создают сайты, которые дружелюбны для большинства людей, в том числе с инвалидностью и ограниченными возможностями здоровья. Платформа позволяет создавать проекты для всех людей. Рассказываем, как развивается цифровая доступность Тильды.

Сайты на Тильде учитывают концепцию цифровой доступности

Базовые блоки библиотеки обладают всеми параметрами, чтобы сайт могли использовать люди с ограниченными возможностями. Разметка и атрибуты позволяют сделать сайт понятным вспомогательным технологиям. Например, скринридеры будут корректно считывать контент на сайте.
Дизайн-система для людей
с разными возможностями восприятия информации
  • Видимый «фокус» на сайте при перемещении через клавиатуру
    Цветная рамка фокуса помогает ориентироваться на странице, человек понимает, с каким элементом на странице он взаимодействует.
  • Во всех блоках с заголовками есть теги H1-H6
    Заголовки разного уровня позволяют скринридеру корректно считывать структуру страницы и переключаться по ней через клавиатуру.
  • Альт-текст для изображений во всех блоках
    Посетители с ограничениями зрения услышат описание изображения. При временном ограничении, например, медленном интернете, зрячие посетители прочитают описание изображения.
  • Хедер и футер
    Скринридер поймет, что человек перешёл в блок с шапкой или подвалом, и будет озвучивать их соответственно. В хедере можно пропустить чтение пунктов меню и сразу перейти к основному контенту.
  • Навигация по меню и подменю
    Пункты меню и подменю размечены семантически верно, значит по ним можно будет перемещаться с помощью программы экранного доступа или клавиатуры.
  • Формы
    Большая часть полей доступна для скринридера и клавиатур. Озвучиваются сообщения об успехе и ошибках.
  • Поп-апы
    Посетители сайта, который пользуются программой экранного доступа, поймут, что открыли всплывающее окно и взаимодействуют с ним. Также поп-апы доступны для работы с клавиатуры.
  • Блоки со списками
    Семантически верная разметка позволяет скринридеру считывать такие блоки корректно, как список.
  • Видеоплееры
    Скринридер корректно считывает кнопку Play видеоплеера, поэтому человек сможет запускать ролики и ставить их на паузу.
  • Плитка и ссылка. Все блоки из категории.
    Доступно перемещение по блокам через клавиатуру. Для незрячих посетителей скринридер зачитает название кнопки или заголовок карточки, в зависимости от блока.
  • Табы и вкладки
    По табам и вкладкам можно перемещаться, используя клавиатуру. Контент будет озвучен скринридером для посетителей со зрительными ограничениями.
  • Блоки вида «Аккордеон»
    Пункты в аккорддеоне будут озвучиваться программой экранного доступа, перемещаться между ними можно с помощью клавиатуры.
  • Слайдеры
    Кнопки, стрелки и пагинация считываются скринридером и доступны для навигации с клавиатуры.
Мы провели большую работу и продолжаем делать платформу доступной. В планах доработать оставшиеся блоки из библиотеки, Zero Block, Каталог, Потоки и интерфейс Тильды. Также будет добавлено больше инструментов для проверки инклюзивности вашего сайта.
Развитие доступности в Тильде
лидер направления цифровой доступности в Тильде
Настя Скоблова,
Пользоваться интернетом должно быть не привилегией, а обычным рутинным делом. И мы в Тильде можем повлиять на это. Мы вносим свой вклад, чтобы каждый человек, вне зависимости от особенностей его тела или восприятия, мог комфортно чувствовать себя онлайн: пользоваться сайтами, находить информацию, совершать покупки и многое другое.

Инструменты для создания доступных сайтов — у вас под рукой

Эти действия положительно повлияют не только на доступность, но и на пользовательский опыт всех посетителей, конверсию страниц и оптимизацию для поисковых систем.
указывайте не только номера телефонов, но и email для связи и так далее
подберите шрифт, который позволяет легко считывать текст
используйте контрастные цвета для фона и текста
напишите h1-h6 теги для заголовков
заполните альт-теги для изображений
Доступность сайта для людей с ограничениями — это ответственность не только платформы, но и человека, который создаёт сайт. Рассказываем, что можно сделать, чтобы ваш сайт был более дружелюбным для всех посетителей.

Думать о посетителях сайта с ограниченными возможностями важно

Потому что любой человек может столкнуться с ситуацией, когда он временно или постоянно начинает воспринимать мир иначе.
когнитивное нарушение
Слух
Голос
Осязание
Слепота
Зрение
Катаракта
Слепящее солнце
Отсутствие руки
Перелом руки
Руки заняты
Немота
Ларингит
Сильный акцент
Глухота
Отит
Шум в метро
Дислексия, СДВГ
Черепно-мозговая травма
Тряска в транспорте
Ситуативное
Временное
Постоянное
Слепота
Катаракта
Слепящее солнце
Ситуативное
Временное
Постоянное
Отсутствие руки
Перелом руки
Руки заняты
Ситуативное
Временное
Постоянное
Немота
Ларингит
Сильный акцент
Ситуативное
Временное
Постоянное
Глухота
Отит
Шум в метро
Ситуативное
Временное
Постоянное
Дислексия, СДВГ
Черепно-мозговая травма
Тряска в транспорте
Ситуативное
Временное
Постоянное

Поделитесь своим мнением

Давайте работать над цифровой инклюзией вместе. Поделитесь, что думаете про доступность, пишите вопросы, предложения и замечания на почту team@tilda.cc.
Создавайте доступные сайты на Тильде
Made on
Tilda