Достъпни формуляри за контакт и Европейският акт за достъпността

Формулярът за контакт често е единствената врата между посетителя и вашия бизнес. Ако тази врата може да се отвори само с мишка, добро зрение и търпение за решаване на размазан пъзел с картинки, някои хора просто остават отвън. От средата на 2025 г. това вече не е само въпрос на използваемост: за много предприятия, продаващи на потребители в ЕС, то се превърна в правен въпрос.

Какво обхваща Европейският акт за достъпността

Европейският акт за достъпността (Директива (ЕС) 2019/882) се прилага от 28 юни 2025 г. Той определя изисквания за достъпност за определени продукти и услуги, предлагани на потребителите – сред тях електронна търговия, потребителски банкови услуги, електронни книги, електронни съобщения и части от пътническия транспорт. За уебсайт това означава онлайн магазина или банковата услуга като цяло, включително формулярите, които клиентите използват, за да се свържат с вас, да задават въпроси или да подават оплаквания. Микропредприятията, които предоставят услуги, са освободени: предприятия с по-малко от десет служители и годишен оборот или балансово число не повече от 2 милиона евро. Предложенията, насочени изцяло към други предприятия, по правило са извън приложното му поле.

Всяка държава членка е транспонирала директивата в националното си право. В Германия това е Barrierefreiheitsstärkungsgesetz (BFSG), в Полша – закон от 2024 г. за осигуряване на съответствието на определени продукти и услуги с изискванията за достъпност. Надзорните органи и санкциите се различават в отделните държави, но техническият критерий е общо взето един и същ: на практика европейският стандарт EN 301 549, който от своя страна се основава на Указанията за достъпност на уеб съдържанието (WCAG).

Защо си струва дори без законово задължение

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

Практически контролен списък с препратки към WCAG 2.2

• Видими етикети, свързани с полетата си (1.3.1, 3.3.2): всяко поле има видим етикет, свързан с него чрез for/id. Само placeholder не е етикет – той изчезва, щом някой започне да пише.
• Съобщения за грешки, които обясняват как да се поправи (3.3.1, 3.3.3): посочете полето, кажете какво не е наред и как да се коригира – с текст, а не само с червена рамка. „Моля, въведете имейл адрес във формат name@example.com“ е по-добре от „Невалидни данни“.
• Пълно управление с клавиатура (2.1.1, 2.1.2): всяко поле, квадратче за отметка, CAPTCHA и бутонът за изпращане могат да бъдат достигнати и използвани с Tab, интервал и Enter, без клавиатурни капани.
• Видим фокус (2.4.7): винаги може да се види кое поле е активно. Премахването на контура на фокуса в браузъра без заместител не отговаря на този критерий.
• Достатъчен контраст (1.4.3): текстът, етикетите и съобщенията за грешки имат съотношение на контраста най-малко 4,5:1 спрямо фона (3:1 за едър текст).
• Размер на целта (2.5.8): бутоните, квадратчетата за отметка и връзките са най-малко 24 × 24 CSS пиксела или около тях има достатъчно пространство.
• Алтернативи на CAPTCHA (1.1.1) и достъпно удостоверяване (3.3.8): 1.1.1 изисква текстова алтернатива и CAPTCHA в повече от една сетивна форма; 3.3.8 строго погледнато обхваща стъпките за вход, но идеята му е приложима – пъзел като повторно изписване на изкривени букви или решаване на сбор не бива да е единственият път. Предложете алтернатива или използвайте метод, който изобщо не изисква пъзел.
• Honeypot полета, скрити от помощните технологии: обвивката на полето капан получава aria-hidden="true", а самото поле – tabindex="-1", така че потребителите на екранни четци и клавиатура никога не попадат в него.

CAPTCHA и honeypot: където защитата от спам среща достъпността

Строго погледнато, критерий 3.3.8 се отнася до стъпките за вход и удостоверяване, а не до формулярите за контакт. Идеята зад него обаче е добре приложима: въвеждането на изкривени букви, решаването на сбор или избирането на светофари от мрежа от изображения изключва някои хора напълно. Вариантите, които обикновено работят без никакъв пъзел – като Cloudflare Turnstile, Friendly Captcha, honeypot в комбинация с проверка на времето или филтриране на сървъра като Akismet – държат спама настрана, без да изискват от посетителите да доказват каквото и да било. Honeypot е удобен само ако е наистина невидим – и за екранните четци, и за потребителите на клавиатура:

<div class="hp" aria-hidden="true">
  <label for="hp-website">Оставете това поле празно</label>
  <input type="text" id="hp-website" name="website"
         tabindex="-1" autocomplete="off">
</div>
<!-- CSS: .hp { position: absolute; left: -10000px; } -->

Тествайте собствения си формуляр за петнадесет минути

1. 1Оставете мишката настрана и попълнете целия формуляр само с клавиатурата. Можете ли да достигнете всяко поле и бутона за изпращане и винаги ли виждате къде се намирате?
2. 2Изпратете формуляра празен, а след това с грешен имейл адрес. Появяват ли се грешките като текст до съответното поле и ясно ли е какво трябва да направите?
3. 3Отворете страницата на телефон или увеличете мащаба на браузъра до 200%. Всичко ли се чете, лесно ли се докосват бутоните и не закрива ли банер за бисквитки или чат уиджет бутона за изпращане?
4. 4Включете екранен четец (VoiceOver, NVDA или TalkBack) и слушайте: обявява ли се всяко поле с етикета си и мълчи ли honeypot полето?
5. 5Изпълнете автоматизирана проверка, например с axe-core. Тя бързо открива липсващи етикети и проблеми с контраста, но не всичко – ръчните стъпки по-горе все още са необходими.

Ако предпочитате да започнете с общ преглед, formexposed разглежда публичните ви формуляри отвън, без да изпраща нищо. Проверките му за достъпност изпълняват axe-core за всеки формуляр, отбелязват CAPTCHA без достъпна алтернатива и honeypot полета, които екранните четци обявяват, и разглеждат формуляра на телефон – цели за докосване, наслагвания, закриващи бутона за изпращане, хоризонтално превъртане. Безплатната проверка показва общото ниво; тези подробности са в пълния доклад. Това е добра отправна точка за горния списък, а не заместител на тестването с реални хора.