Тебе не нужна версия для слабовидящих

by Lena Ryan

Тебе не нужна версия для слабовидящих

Лена Райан

vegan cat pasta girl cat why
expert
glasha talk vadim talk zahar talk ally info ally info course

Lena Ryan

@russian_plazma_drink
Lena Ryan

Поговорим про:

Yury Dud

Основные заблуждения

oxxxymiron
disabilities

Нет таких клиентов? Точно?

blind activities blind activities blind activities

tabindex — зло

Легко внедрить после релиза

rick and morty rick and morty

Долго и дорого?

Почему только слабовидящие?

Konstantin Deblikov @bionic_russia

Доступностьnot equalВДС

Что такое ВДС?

blind-version

Для кого
делается ВДС?

dyslexic Jason

Предполагаемая польза

no god please no

Почему внедряют версии для слабовидящих?

ГОСТ Р 52872-2012

Интернет-ресурсы. Требования доступности для инвалидов по зрению

Введён 01.01.2014

ГОСТ Р 52872-2012

Приказ Минкомсвязи России №483

Об установлении Порядка обеспечения условий доступности для инвалидов по зрению официальных сайтов федеральных органов государственной власти, органов государственной власти субъектов Российской Федерации и органов местного самоуправления в сети «Интернет»

От 30.11.2015

Приказ Минкомсвязи России №483

Подытог

oxxxymiron versus johnyboy

ГОСТ Р 52872-2012 ГОСТ Р 52872-2019

ГОСТ Р 52872-2019

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

Введён 01.04.2020. Разработан на основе WCAG 2.0.

ГОСТ Р 52872-2019
Органы государственной власти в технических заданиях на проектирование и разработку интерфейсов своих официальных сайтов предусматривают наличие альтернативных текстовых версий таких сайтов (далее – версия для инвалидов по зрению), переход к которым осуществляется с главной страницы официального сайта в случае, если сам официальный сайт исходно не соответствует требованиям пункта 4 настоящего Порядка

Требования формальным языком

Перевод на человеческий язык

Отдельная версия не понадобится!

И зачем тогда отдельная версия?

На что обратить внимание

Какие инструменты нужны
слабовидящему

Масштабирование
и большие мониторы

monitor

Экранная лупа

screen magnifier

Тёмная тема /
режим высокой контрастности

high contract dark theme

Cкринридеры

nvda
gogen solntsev

Скрин-зум
+ голосовые синтезаторы

zoomtext

Как слабовидящие просматривают сайты?

Нейропатия Лебера

healthy vision
Обычное зрение
leber vision
Зрение человека
с нейропатией Лебера

Что такое "плохо"

Сайт РЖД

rzd rzd Сайт РЖД

Сайт РЖД и ВДС

rzd rzd rzd Сайт РЖД
mem chinese looks at the piece of paper

Спортшкола

school school Спортивная школа "Юность"

Спортшкола и ВДС

school school Спортивная школа "Юность"

Сайт Мончегорской теплосети

rzd rzd Мончегорские теплосети

Мончегорская теплосеть и ВДС

rzd rzd Мончегорские теплосети

Нет оформления= Нет информации

Вместо инклюзивности дискриминация

cat and lamp

Bershka

bershka site Bershka
ally panel ally panel
ally panel
skip link skip link menu skip link info
ramp

Почему ВДС — это плохая идея?

И зачем тогда отдельная версия?

Что такое "хорошо"

Aviasales

aviasales aviasales Aviasales

GOV.UK

gov.uk gov.uk GOV.UK
            <li>
                <button
                  aria-controls="super-navigation-menu"
                  aria-expanded="false"
                  aria-label="Show Government activity menu"
                  data-text-for-hide="Hide Government activity menu"
                  data-text-for-show="Show Government activity menu"
                  type="button">
                  Government activity
                </button>
            </li>
        
GOV.UK

accessibilityunity.com

kurmak info kurmak info kurmak info accessibilityunity.com
            <form method="POST" target="feedback">
              <label>
                  <span>Электронная почта</span>
                  <input type="email" name="email">
                  <span aria-live="assertive">Укажите почту</span>
              </label>
              <label>
                  <span>Что интересует</span>
                  <textarea name="message" placeholder="Вопрос..."></textarea>
              </label>
              <button type="submit">Отправить</button>
              <span>Спасибо! Ответим в почте)</span>
            </form>
        
accessibilityunity.com

А как у них?

Российские компании

ВК

Сбер

Яндекс

Как проверить сайт

Имитаторы нарушений зрения

browser extensions
Браузерные расширения
developer tools
Инструменты разработчика

Контрастный текст

devtools contrast devtools contrast
Contrast and Color Accessibility

Навигация с клавиатуры

Управление фокусом и атрибут inert

Валидаторы и чек-листы

Нужно больше знаний?

Что дальше?

where are tasks

Выводы

you dont need

Канал Валерии Курмак

Дима Волжский

qr-code for slides

Дизайн слайдов

keanu thank you qr-code for slides

Делая сайты доступными, вы делаете вклад в своё будущее