Пълното ръководство за уеб достъпност

Уеб достъпността е практиката да се изграждат сайтове, които всеки може да използва, включително хората с увреждания. Това обхваща широк кръг от хора: някой, който навигира с клавиатура вместо с мишка, потребител на екранен четец, който чува страницата, вместо да я вижда, човек с намалено зрение, който се нуждае от силен контраст, и всеки, който гледа видео с изключен звук. Това ръководство обяснява какво означава достъпност, защо си заслужава вниманието ви и как да я постигнете без жаргона.

Какво всъщност означава достъпност

Международният ориентир са Насоките за достъпност на уеб съдържанието, известни като WCAG. Актуалната версия е WCAG 2.2 и повечето организации се стремят към ниво AA, което е нивото, посочено в закони като Европейския акт за достъпност. Не е нужно да наизустявате насоките, но е полезно да познавате четирите принципа, на които те стъпват. Една страница трябва да бъде:

• Възприемаема. Хората могат да възприемат съдържанието, независимо дали го виждат, чуват или усещат. Изображенията имат текстови алтернативи, видеото има субтитри, а текстът има достатъчен контраст.
• Използваема. Хората могат да работят със страницата с каквото разполагат, мишка, само клавиатура, превключвател или глас. Нищо не ги блокира и нищо не зависи от сетиво или действие, което те не могат да изпълнят.
• Разбираема. Съдържанието се чете ясно и интерфейсът се държи предвидимо, така че хората не са изненадани или объркани.
• Стабилна. Страницата е изградена така, че браузърите и помощните технологии, сега и в бъдеще, да могат да я интерпретират надеждно.

Почти всичко практическо в това ръководство се свежда до една от тези четири идеи.

За кого е предназначена

Изкушаващо е да си представим малка група потребители, но достъпността е по-широка от това. Около един на всеки шест души живее със значително увреждане, а много повече се възползват от достъпния дизайн, без да се определят като хора с увреждания: по-възрастен клиент, някой с временна травма, човек с бавна връзка или всеки, който използва телефон под ярко слънце. Изграждането за крайните случаи прави преживяването по-добро и за средата. Субтитрите помагат в шумно помещение, силният контраст помага на евтин екран, а ясният ред на фокуса помага на всеки, който предпочита клавиатурата.

Основите, които имат най-голямо значение

Добрата новина е, че работата с най-голямо въздействие е структурна, а не декоративна. Направете тези основи правилно и сте изминали по-голямата част от пътя към AA.

Използвайте правилния HTML елемент

Истинският бутон, истинската връзка и истинският списък идват с вградено поведение и значение, безплатно. Изградите ли ги наново от общи стилизирани кутии, трябва ръчно да добавите фокус, поддръжка на клавиатура и правилното обявяване, а повечето екипи пропускат нещо. Това е навикът с най-висока възвръщаемост в достъпността. Разглеждаме го подробно в защо семантичният HTML все още има значение.

Направете всичко да работи от клавиатурата

Много хора никога не използват мишка. Всеки контрол трябва да бъде достижим и използваем само с клавиатурата, в логичен ред, с очертание на фокуса, което наистина се вижда. Това е и най-бързият ръчен тест, който можете да направите на собствения си сайт. Вижте навигация с клавиатура, тестът, който повечето сайтове не издържат.

Изберете цветове, които всеки може да чете

Текстът се нуждае от достатъчен контраст спрямо фона си, а цветът никога не трябва да бъде единственият начин, по който сигнализирате значение. Това е един от най-честите пропуски и един от най-лесните за поправяне, щом познавате целевите стойности. Нашето ръководство за избор на достъпен цветови контраст минава през числата.

Пишете истински текстови алтернативи

Изображенията, които носят значение, се нуждаят от алтернативен текст, за да получат потребителите на екранни четци същата информация, а декоративните изображения трябва да бъдат отбелязани като декоративни, за да бъдат пропускани. Добрият alt текст помага и на търсачките да разберат вашите изображения. Вижте alt текст за SEO и достъпност.

Изграждайте форми, които хората могат да завършат

Формите са мястото, където много посетители решават да станат клиенти, така че объркваща или недостъпна форма ви струва директно. Полета с етикети, ясни грешки и разумно групиране помагат на всеки да стигне до края. Обясняваме как в достъпните форми печелят повече запитвания.

Защо е добра за вашия бизнес

Достъпността често се представя като съответствие, но тя е преди всичко по-голяма аудитория и по-добро преживяване. Достъпният сайт достига до повече клиенти, конвертира повече от тях и ви излага на по-малък правен риск, докато законите за достъпност се затягат в Европейския съюз и отвъд него. Излагаме търговските аргументи в достъпността е добра за бизнеса.

Има и един тих бонус. Същата структура, която помага на помощните технологии, смислени заглавия, истински ориентири, описателни връзки и правилни алтернативи, е точно това, което търсачките четат, за да разберат една страница. Достъпността и SEO са изградени върху едни и същи основи, така че работата се отплаща двойно.

Бележка за електронната търговия

Онлайн магазините имат специфични точки на напрежение: продуктови галерии, филтри, избор на варианти и каса, която не трябва да губи никого. Недостъпната каса е изоставена продажба. Ако продавате онлайн, чеклистът за достъпност в електронната търговия покрива частите, които имат най-голямо значение.

Как да тествате

Не ви трябва лаборатория, за да започнете. Кратка, повторяема рутина улавя повечето проблеми:

1. Оставете мишката настрана и преминете през цялата страница с клавиша Tab. Можете ли да достигнете и използвате всичко и винаги ли виждате къде се намирате?
2. Пуснете автоматичен инструмент за проверка като axe или Lighthouse. Той няма да улови всичко, но бързо отбелязва очевидните пропуски.
3. Проверете цветовия си контраст спрямо целевите стойности за AA.
4. Опитайте екранен четец за десет минути. На повечето системи вече има вграден.

Автоматичните инструменти откриват може би една трета от проблемите, така че ги съчетавайте с ръчните проверки по-горе. Целта не е перфектен резултат, а сайт, който реален човек наистина може да използва.

Откъде да започнете

Ако това ви се струва много, започнете с основите: правилен HTML, работещ ред на клавиатурата и достатъчен контраст. Само тези три неща премахват повечето бариери. Оттам нататък минете през alt текста, формите и останалото като постоянен навик, а не като еднократен проект.

Ако искате помощ, достъпността е вградена във всичко, което правим, а я предлагаме и като самостоятелна услуга. Вижте уеб достъпност или започнете проект и ни кажете къде стои вашият сайт днес.