Мета використання “aria-labelledby” на вже позначених елементах введення?

84

Багато демонстраційних веб-сайтів ARIA використовують такий код, як:

<label for="name" id="label-name">Your Name</label>
<input id="name" aria-labelledby="label-name" type="text">

Але яка мета використання aria-labelledbyатрибута в цьому випадку? inputЕлемент вже позначений labelелементом , який використовує forатрибут, чи не так?

— Ян Й.
джерело

1

w3.org/TR/2010/WD-wai-aria-20100916/…

— Сарфраз

8

Дякую @Sarfraz. Однак ця сторінка не ілюструє мету такого використання вже позначених елементів введення.

— Ян Й.

69

На сторінках розробників Mozilla є кілька хороших прикладів його використання . Мабуть, найкращим з їх прикладів є те, де воно використовується для асоціювання спливаючого меню з батьківським пунктом меню - це Приклад 7 на сторінці:

<div role="menubar">  
    <div role="menuitem" aria-haspopup="true" id="fileMenu">File</div>  
    <div role="menu" aria-labelledby="fileMenu">  
        <div role="menuitem">Open</div>  
        <div role="menuitem">Save</div>  
       <div role="menuitem">Save as ...</div>  
       ...  
    </div>  
    ...

Атрибути ARIA, як правило, найбільше корисні у створенні доступних розширених Інтернет-додатків : поки ви дотримуєтесь стандартного семантичного HTML - використовуєте форми зі стандартними мітками - вам це взагалі не потрібно: тому немає причин використовувати його на пара LABEL / INPUT. Але якщо ви створюєте "багатий інтерфейс" з нуля (DIV та інші елементи низького рівня з javascript, що додає інтерактивність), тоді важливо, щоб читач екрану знав, що таке намір вищого рівня.

— BrendanMcK
джерело

11

Дякую @BrendanMcK. Те, що ви сказали, правда. Я запитав когось, хто працює на ARIA, і він теж сказав, що в цьому випадку не потрібно використовувати aria-labelledby. Для позначення <input> s він сказав, що використовуйте його лише тоді, коли нам потрібно позначити <input> кількома <label> s. Ось приклад, який він надав: html5accessibility.com/tests/mulitple-labels.html

— Ян Й.

1

Більше однієї LABEL можуть бути пов'язані з одним і тим же елементом управління шляхом створення декількох посилань через атрибут for . Гаразд, WAVE / WebAIM це не любить, і виявляється, є проблема із підтримкою UA . Але його пропозиція просто дивна , і я не думаю, що вона має якусь реальну перевагу. Принаймні IE <= 8 не підтримує кілька ідентифікаторів в aria-labelledby .

— sourcejedi

1

це посилання ПОВИННО бути тут: developer.mozilla.org/en-US/docs/Accessibility/ARIA

— Facundo Colombier

5

Завжди виникають проблеми з підтримкою UA щодо чогось нового, тому розробники сподіваються на поступове вдосконалення. Ця методика ARIA надає можливість покінчити з атрибутом «for» та дозволяє іншим елементам стати частиною багатої форми. Ці методи стануть звичною практикою.

— користувач2323922
джерело

1

Чи фокусує він елемент при натисканні, як це робить атрибут for? Гадаю, ні

— Домінік

3

Цілком помилковий. Атрибути aria НЕ повинні замінювати інші атрибути, оскільки їх єдиною метою є допомогти зробити елементи більш доступними. Елементи НЕ повинні бути сфокусованими через будь-який атрибут aria.

— Густ ван де Валь

1

На сьогодні звичайна практика (на жаль?), На мій погляд, все ще не відповідає дійсності. Найкраща практика, може бути кращим вибором. Можливо, у майбутньому, коли загальноприйнятою практикою буде високий рівень штучного інтелекту, який пише HTML замість людей :)

— Майкл