1.3.1; 3.3.2; 4.1.2 Polia e-mailu a mobilného čísla adresáta nemajú menovky

URL: agp.dev.slovensko.digital/bundles/4f808dd3-1070-4a99-9646-7df02adef1bd

Popis problému:

Vo formulári „Poslať na podpis“ na stránke balíka sú polia <input type="email" id="recipient_email" placeholder="jan.novak@example.com"> a <input type="tel" id="recipient_mobile_phone" placeholder="+421901234567">. Viditeľné texty „Email adresáta“ a „Mobilné číslo adresáta“ sú obyčajný text vedľa ikony a nie sú s poliami programovo prepojené. Prístupný názov polí preto tvorí iba zástupný text — čítač obrazovky oznámi „jan.novak@example.com, upraviť“ a „+421901234567, upraviť“. Vysvetlenie „Pri bežných žiadostiach je nepovinné …“ nie je s poľom mobilného čísla prepojené.

Dopad:

Používateľ čítača obrazovky nepočuje, čo má do poľa zadať, iba príklad, ktorý si môže pomýliť s už vyplnenou hodnotou. Nedozvie sa ani to, že mobilné číslo je nepovinné. Používatelia hlasového ovládania nemôžu pole aktivovať povelom podľa viditeľného textu („klikni Email adresáta“). Zástupný text po začatí písania zmizne, čo sťažuje kontrolu používateľom s kognitívnym znevýhodnením.

Závažnosť: vysoká — ide o hlavný formulár na odoslanie dokumentu na podpis.

Efektívne riešenie:

Pre splnenie kritérií úspešnosti je potrebné texty „Email adresáta“ a „Mobilné číslo adresáta“ vytvoriť ako <label for="recipient_email"> a <label for="recipient_mobile_phone">, poznámku o nepovinnosti prepojiť cez aria-describedby a zástupný text uviesť ako príklad („napr. jan.novak@example.com“) alebo ho vynechať:

<%= f.label :email, t('.email_label'), class: "…" %>
<%= f.email_field :email, autocomplete: "off", placeholder: t('.email_example'), class: "…" %>
<%= f.label :mobile_phone, t('.phone_label'), class: "…" %>
<%= f.telephone_field :mobile_phone, "aria-describedby": "recipient_phone_hint", class: "…" %>
<p id="recipient_phone_hint">Pri bežných žiadostiach je nepovinné. …</p>