Що таке HTML5 ARIA?

Що таке HTML5 ARIA? Я не розумію, як це здійснити.

WAI-ARIA - це специфіка, що визначає підтримку доступних веб-додатків. Він визначає купу розширень розмітки (здебільшого як атрибути на елементах HTML5), які може використовувати розробник веб-додатків для надання додаткової інформації про семантику різних елементів для допоміжних технологій, таких як читачі екранів. Звичайно, щоб ARIA працювала, агент користувача HTTP, який інтерпретує розмітку, повинен підтримувати ARIA, але специфікація створюється таким чином, щоб дозволити користувачам нижчого рівня безпечно ігнорувати специфічну для ARIA розмітку, не впливаючи на функціональність веб-програми.

Ось приклад зі специфікації ARIA:

<ul role="menubar">

  <!-- Rule 2A: "File" label via aria-labelledby -->
  <li role="menuitem" aria-haspopup="true" aria-labelledby="fileLabel"><span id="fileLabel">File</span>
    <ul role="menu">

      <!-- Rule 2C: "New" label via Namefrom:contents -->
      <li role="menuitem" aria-haspopup="false">New</li>
      <li role="menuitem" aria-haspopup="false">Open…</li>
      ...
    </ul>
  </li>
  ...
</ul>

Зверніть увагу на roleатрибут на зовнішньому <ul>елементі. Цей атрибут жодним чином не впливає на те, як розмітка відображається на екрані браузером; однак браузери, які підтримують ARIA, додаватимуть інформацію про доступність ОС до виведеного елемента інтерфейсу, щоб екранний зчитувач міг інтерпретувати його як меню та читати його вголос з достатньою кількістю контексту, щоб кінцевий користувач міг зрозуміти (наприклад, явний "меню" аудіо натяк) і здатний взаємодіяти з ним (наприклад, голосова навігація).

ARIA розшифровується як Accessible Rich Internet Applications.

WAI-ARIA - це неймовірно потужна технологія, яка дозволяє розробникам легко описувати призначення, стан та інші функціональні можливості візуально багатих користувальницьких інтерфейсів - таким чином, що вони можуть зрозуміти Assistive Technology. Нарешті WAI-ARIA було інтегровано в поточний робочий проект специфікації HTML 5.

А якщо вам цікаво, що таке WAI-ARIA, це те саме.

Зверніть увагу, що умови WAI-ARIA та ARIA відносяться до одного і того ж. Однак правильніше використовувати WAI-ARIA для підтвердження свого походження в WAI.

WAI = Ініціатива доступу до Інтернету

З точки зору цього, ARIA використовується для допоміжних технологій і переважно зчитування екрана.

Більшість ваших сумнівів буде усунуто, якщо ви прочитаєте цю статтю

http://www.w3.org/TR/aria-in-html/

Що це?

WAI-ARIA розшифровується як «Ініціатива доступу до Інтернету - Доступні додатки для багатого Інтернету» . Це набір атрибутів, що допомагають покращити семантику веб-сайту чи веб-програми, щоб допомогти допоміжним технологіям, таким як зчитувачі екрану для сліпих, зрозуміти певні речі, які не є власними для HTML. Інформація, що відкривається, може варіюватися від чогось простого, як сказати зчитувачу екрана, що активація посилання або кнопки просто показала або приховала більше елементів, до складних віджетів, як цілі системи меню, або ієрархічні погляди на дерево.

Це досягається шляхом застосування ролей та атрибутів стану до розмітки HTML 4.01 або новішої версії, яка не стосується компонування чи функціональності браузера, але надає додаткову інформацію для допоміжних технологій.

Одним з наріжних каменів WAI-ARIA є атрибут ролі. Він повідомляє браузеру розповісти допоміжної технології, що використовуваний HTML-елемент - це насправді не те, що пропонує ім’я елемента, а щось інше. Хоча він спочатку є лише елементом div, цей елемент div може бути контейнером до списку елементів автоматичного заповнення, і в цьому випадку доцільно використовувати роль "listbox". Крім того, інший div, який є дочірньою частиною цього контейнера div і містить один елемент опції, повинен потім отримати роль "option". Два діви, але через ролі, зовсім інше значення. Ролі моделюються після часто використовуваних аналогів настільних додатків.

Винятком з цього є ролі орієнтиру документа, які не змінюють фактичного значення відповідного елемента, але надають інформацію про це конкретному місці в документі.

Другий наріжний камінь - стан та властивості WAI-ARIA. Вони визначають стан певних нативних або WAI-ARIA елементів, наприклад, якщо щось згортається або розгортається, потрібен елемент форми, щось має додане до нього спливаюче меню тощо. Вони часто є динамічними і змінюють свої значення протягом життєвого циклу веб-програми та зазвичай маніпулюють через JavaScript.

Що це не так?

WAI-ARIA не призначений для впливу на поведінку браузера. На відміну від реального елемента кнопки, наприклад, div, на який ви переливаєте роль "кнопки", не дає вам фокусируемості клавіатури, автоматичного обробника клацань, коли на нього натискають клавішу Пробіл або Enter, та інших властивостей, властивих для кнопка. Сам браузер не знає, що діва з роллю "кнопки" є кнопкою, це робить лише його частина API доступності.

Як наслідок, це означає, що вам абсолютно доведеться самостійно реалізовувати навігацію по клавіатурі, фокусируемость та інші поведінкові моделі, відомі з настільних додатків. Ви можете знайти деякі методи Advanced ARIA Тут .

Коли я не повинен його використовувати?

Так, це правильно, цей розділ на першому місці! Тому що перше правило використання WAI-ARIA: Не використовуйте його, якщо ви абсолютно не повинні! Чим менше у вас WAI-ARIA, і чим більше ви можете розраховувати на використання вбудованих HTML-віджетів, тим краще! Є ще кілька правил, яких слід дотримуватись, ви можете перевірити їх тут .

Що таке ARIA?

ARIA з'явилася як спосіб вирішити проблему доступності використання мови розмітки, призначеної для документів, HTML, для побудови інтерфейсів користувача (UI). HTML включає в себе безліч функцій для роботи з документами (P, h3, UL, TABLE), але лише основні елементи інтерфейсу, такі як A, INPUT та BUTTON. Windows та інші операційні системи підтримують API, які дозволяють (Assistive Technology) AT отримувати доступ до функцій елементів управління інтерфейсом. Internet Explorer та інші веб-переглядачі відображають вбудовані елементи HTML в API доступності, але керування html не настільки багате, як елементи керування, поширені в операційних системах настільних ПК, і їх недостатньо для сучасних веб-додатків. Інтерфейс, необхідний для сучасних веб-додатків. До ARIA браузер не мав можливості розкрити це додаткове багатство API доступності або AT. Класичний приклад цього питання - додавання обробника кліків до зображення. Він створює те, що користувачеві миші є кнопкою, яку можна натискати, але все ще є лише зображенням клавіатури або користувача AT.

Рішення полягало у створенні набору атрибутів, що дозволяють розробникам розширювати HTML за допомогою семантики інтерфейсу користувача. Термін ARIA для групи елементів HTML, які мають власні функціональні можливості та використовують атрибути ARIA для відображення цих функцій в API доступності, - це віджет. ARIA також пропонує авторам спосіб документувати роль самого контенту, що, в свою чергу, дозволяє AT побудувати альтернативні механізми навігації для вмісту, який набагато простіше у використанні, ніж читання повного тексту або лише ітерація над списком посилань.

Важливо пам’ятати, що в простих випадках набагато переважніше використовувати вбудовані елементи керування HTML та стилювати їх, а не використовувати ARIA. Тобто не вигадуйте колеса чи прапорці, якщо цього не потрібно.

На щастя, розмітка ARIA може бути додана до існуючих сайтів, не змінюючи поведінку для основних користувачів. Це значно знижує витрати на зміну та тестування веб-сайту чи програми.

У мене виникло інше питання щодо ARIA. Але його зміст виглядає більш перспективним для цього питання. хотів би ними поділитися

Що таке ARIA?

Якщо ви докладете зусиль для того, щоб зробити свій веб-сайт доступним для користувачів із різними звичками перегляду та фізичними вадами, ви, ймовірно, визнаєте роль та атрибути арії. WAI-ARIA (Accessible Rich Internet Applications) - це метод надання способів визначення динамічного веб-контенту та додатків, щоб люди з обмеженими можливостями могли ідентифікувати та успішно взаємодіяти з ним. Це робиться за допомогою ролей, які визначають структуру документа чи програми, або через атрибути aria- *, що визначають віджет-роль, взаємозв'язок, стан чи властивість.

Використання ARIA рекомендується в специфікаціях, щоб зробити додатки HTML5 більш доступними. Використовуючи смислові елементи HTML5, слід встановити їх відповідну роль.

І дивіться це ви на відео в прямому ефірі для ARIA.