Проверка на достъпността: какво може да направи собственикът сам

Достъпността на сайта не е само въпрос на закон, а и на уважение към всеки клиент. Много хора ползват интернет по различен начин - заради отслабено зрение, увреждане или временно счупена ръка - и ако сайтът ги спре, губите реални поръчки. Основните проверки можете да направите сами, без програмист: с клавиатурата и с очите си.

Тестът с клавиатурата: можете ли да поръчате без мишка?

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

Опитайте да минете през собствения си сайт само с клавиатурата: Tab за напред, Shift + Tab за назад, Enter за бутон или връзка. Докато го правите, следете три неща:

• Виждате ли къде се намирате? При всяко натискане на Tab около избрания бутон, връзка или поле трябва да се появява ясна рамка. Ако я няма, човекът пред екрана не знае къде е.
• Стигате ли до всички страници? Проверете дали падащите менюта се отварят с Enter или интервал. Честа грешка е меню, което се появява само когато посочите с мишката.
• Има ли „капани“? Понякога фокусът влиза в даден елемент, например чат прозорец или календар, и не може да излезе от него с Tab. Тогава на човека не му остава друго, освен да презареди страницата.

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

Контраст и четливост: виждат ли се текстовете на слънце?

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

За първата проверка не ви трябва дизайнерска програма. Обърнете внимание на тези места:

• Бутоните за действие: текстът върху тях („Купи сега“, „Изпрати запитване“) трябва ясно да се откроява от цвета на самия бутон.
• Формите за контакт: полетата, в които клиентът пише, трябва да имат ясни граници, а не тънки линии, които се сливат с фона.
• Долната част на страницата: там често стоят контактите и общите условия с дребен и блед шрифт. Точно тази информация клиентът търси, когато е готов да ви се обади.

При ресторантите често се срещат менюта със златисти букви на тъмен фон. На екрана изглежда елегантно, но на телефон в слънчева градина клиентът трудно разчита цените и съставките.

Текст към снимките: какво „чува“ незрящият клиент

Екранните четци прочитат на глас съдържанието на страницата. Когато стигнат до снимка, те четат нейния алтернативен текст. Ако такъв липсва, някои четци прочитат името на файла, например „IMG_5678.jpg“, а то не казва нищо на човека.

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

• Лош пример: „snimka1.jpg“ или само „обувка“.
• Добър пример: „Черни кожени мъжки обувки за официални поводи“.

При агенция за недвижими имоти това е особено важно. Ако снимката на хола няма описание, незрящият посетител, а и човек със слаба връзка, при която снимките не се зареждат, няма да разбере дали стаята е светла, каква е настилката и има ли тераса. Освен това Google използва алтернативния текст заедно със съдържанието на страницата, за да разбере какво има на снимката.

Форми и съобщения за грешка: помагате ли на клиента?

Формите са мястото, където най-често се губят клиенти. Ако човек пропусне поле и сайтът каже само „Има грешка“, без да посочи къде и как да се поправи, това е бариера. Хората с когнитивни затруднения, а и всеки забързан човек, се отказват лесно при неясни указания.

Тествайте формата си за контакт така:

1. Изпратете празна форма и вижте дали грешките са отбелязани само с цвят, например с червена рамка. Човек с нарушено цветно зрение може да не я забележи. До полето винаги трябва да има и текст, например „Моля, въведете валиден имейл“.
2. Проверете дали всяко поле има надпис, който стои постоянно над него или до него. Надпис, който е само вътре в полето и изчезва, щом започнете да пишете, кара човека да забрави какво точно се искаше.
3. Уверете се, че съобщението за успех или за грешка се вижда веднага, а не някъде в дъното на екрана, където никой не го очаква.

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

Заглавията: подредена ли е страницата?

Хората, които ползват екранен четец, често прескачат от заглавие на заглавие, за да разберат какво има на страницата. Това е като да прелистите вестник по заглавията. Ако заглавията са избрани заради размера на шрифта, а не заради мястото им в текста, тези хора се объркват.

Добрата практика е всяка страница да има едно основно заглавие (H1), което казва за какво е тя. Под него идват подзаглавията (H2), а под тях по-малките раздели (H3). Не прескачайте нива, например от H1 направо на H3, само защото по-малкият шрифт изглежда по-добре. Ето как изглежда подредена страница:

• H1: Ремонт на покриви
• H2: Хидроизолация на плоски покриви
• H3: Използвани материали
• H3: Как протича работата
• H2: Ремонт на керемидени покриви

Ако имате автосервиз и на началната страница пет различни текста са оформени като H1, екранният четец ще обяви пет „главни теми“, което обърква. Подредените заглавия помагат и на Google да разбере кое е основното на страницата.

Движение и звук: дайте контрола на човека

Видеата, които тръгват сами, въртящите се банери (слайдери) и мигащите елементи могат да са сериозна пречка. За хора с епилепсия или с нарушено внимание те могат да направят сайта неизползваем, а мигането - и опасен. За всички останали често са просто досадни и отвличат вниманието от поръчката.

Проверете следното:

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

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

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

Темидостъпностуеб сайтпроверкапотребителско преживяване