Co to jest ARIA HTML5?

Co to jest ARIA HTML5? Nie rozumiem, jak to wdrożyć.

WAI-ARIA to wsparcie definiujące specyfikację dostępnych aplikacji internetowych. Definiuje wiele rozszerzeń znaczników (głównie jako atrybuty elementów HTML5), które mogą być używane przez programistę aplikacji internetowych do dostarczania dodatkowych informacji na temat semantyki różnych elementów technologiom pomocniczym, takim jak czytniki ekranu. Oczywiście, aby ARIA działała, agent użytkownika HTTP interpretujący znaczniki musi obsługiwać ARIA, ale specyfikacja jest tworzona w taki sposób, aby umożliwić agentom użytkownika niższego poziomu bezpieczne ignorowanie znaczników specyficznych dla ARIA bez wpływu na funkcjonalność aplikacji internetowej.

Oto przykład ze specyfikacji 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>

Zwróć uwagę na roleatrybut na <ul>elemencie zewnętrznym . Ten atrybut nie wpływa w żaden sposób na sposób renderowania znaczników na ekranie przez przeglądarkę; jednak przeglądarki obsługujące ARIA dodają informacje o dostępności specyficzne dla systemu operacyjnego do renderowanego elementu interfejsu użytkownika, dzięki czemu czytnik ekranu może zinterpretować je jako menu i odczytać na głos z wystarczającym kontekstem, aby użytkownik końcowy mógł to zrozumieć (na przykład wyraźne wskazówka dźwiękowa „menu”) i jest w stanie z nią wchodzić w interakcje (na przykład nawigacja głosowa).

ARIA oznacza Accessible Rich Internet Applications.

WAI-ARIA to niezwykle potężna technologia, która pozwala programistom łatwo opisać cel, stan i inne funkcje wizualnie bogatych interfejsów użytkownika - w sposób zrozumiały dla technologii wspomagających. WAI-ARIA została wreszcie zintegrowana z bieżącym roboczym szkicem specyfikacji HTML 5.

A jeśli zastanawiasz się, czym jest WAI-ARIA, to to samo.

Uwaga: terminy WAI-ARIA i ARIA odnoszą się do tej samej rzeczy. Jednak bardziej poprawne jest użycie WAI-ARIA, aby potwierdzić jej pochodzenie w WAI.

WAI = Inicjatywa dostępności sieci

Wygląda na to, że ARIA jest używana do technologii wspomagających, a przede wszystkim do odczytu ekranu.

Większość wątpliwości zostanie wyjaśnionych, jeśli przeczytasz ten artykuł

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

Co to jest?

WAI-ARIA oznacza „Inicjatywa na rzecz dostępności sieci - bogate aplikacje internetowe dostępne” . Jest to zestaw atrybutów, które pomagają poprawić semantykę strony internetowej lub aplikacji internetowej, aby pomóc technologiom wspomagającym, takim jak czytniki ekranu dla osób niewidomych, w zrozumieniu pewnych rzeczy, które nie są natywne dla HTML. Odsłonięte informacje mogą wahać się od czegoś tak prostego, jak poinformowanie czytnika ekranu, że aktywacja linku lub przycisku po prostu pokazała lub ukryła więcej elementów, aż do widżetów tak złożonych jak całe systemy menu lub hierarchiczne widoki drzewa.

Osiąga się to poprzez zastosowanie ról i atrybutów stanu do znaczników HTML 4.01 lub nowszych, które nie mają wpływu na układ ani funkcje przeglądarki, ale zapewniają dodatkowe informacje na temat technologii wspomagających.

Kamieniem węgielnym WAI-ARIA jest atrybut roli. Informuje przeglądarkę, aby poinformowała technologię wspomagającą, że użyty element HTML nie jest tak naprawdę sugerowany przez nazwę elementu, ale coś innego. Chociaż pierwotnie jest to element div, ten element div może być kontenerem do listy autouzupełniania, w którym to przypadku należałoby użyć roli „listbox”. Podobnie inny div, który jest dzieckiem tego kontenera div i który zawiera pojedynczy element opcji, powinien następnie otrzymać rolę „opcji”. Dwa divy, ale poprzez role mają zupełnie inne znaczenie. Role są modelowane na podstawie często używanych odpowiedników aplikacji komputerowych.

Wyjątkiem są role punktów orientacyjnych w dokumencie, które nie zmieniają faktycznego znaczenia danego elementu, ale dostarczają informacji o tym konkretnym miejscu w dokumencie.

Drugim kamieniem węgielnym są stany i właściwości WAI-ARIA. Definiują stan niektórych elementów natywnych lub WAI-ARIA, np. Jeśli coś jest zwinięte lub rozwinięte, wymagany jest element formularza, coś ma dołączone menu podręczne lub tym podobne. Często są one dynamiczne i zmieniają swoje wartości przez cały cykl życia aplikacji internetowej i zwykle są manipulowane przez JavaScript.

Co to nie jest

WAI-ARIA nie ma wpływu na zachowanie przeglądarki. W przeciwieństwie do prawdziwego elementu przycisku, na przykład div, na który wylewasz rolę „przycisku”, nie daje możliwości ustawiania ostrości na klawiaturze, automatycznej obsługi kliknięć po naciśnięciu spacji lub Enter oraz innych właściwości, które są charakterystyczne dla przycisk. Sama przeglądarka nie wie, że div z rolą „przycisku” jest przyciskiem, tylko jego część interfejsu API dostępności.

W konsekwencji oznacza to, że absolutnie musisz samodzielnie wprowadzić nawigację za pomocą klawiatury, możliwość ustawiania ostrości i inne wzorce zachowań znane z aplikacji komputerowych. Można znaleźć kilka technik zaawansowane ARIA tutaj .

Kiedy nie powinienem go używać?

Tak, zgadza się, ta sekcja jest na pierwszym miejscu! Ponieważ pierwszą zasadą korzystania z WAI-ARIA jest: Nie używaj jej, chyba że absolutnie musisz! Im mniej WAI-ARIA posiadasz i im więcej możesz liczyć na używanie natywnych widżetów HTML, tym lepiej! Istnieje kilka innych zasad, których należy przestrzegać, możesz je sprawdzić tutaj .

Co to jest ARIA?

ARIA pojawiła się jako sposób na rozwiązanie problemu dostępności przy użyciu języka znaczników przeznaczonego dla dokumentów, HTML, do tworzenia interfejsów użytkownika (UI). HTML zawiera wiele funkcji do obsługi dokumentów (P, h3, UL, TABELA), ale tylko podstawowe elementy interfejsu użytkownika, takie jak A, WEJŚCIE i PRZYCISK. Windows i inne systemy operacyjne obsługują interfejsy API, które umożliwiają (Assistive Technology) AT dostęp do funkcjonalności kontrolek interfejsu użytkownika. Internet Explorer i inne przeglądarki mapują natywne elementy HTML na interfejs API ułatwień dostępu, ale formanty html nie są tak bogate, jak formanty typowe w komputerowych systemach operacyjnych i nie wystarczają w nowoczesnych aplikacjach internetowych. Formanty niestandardowe mogą rozszerzać elementy html, aby zapewnić bogate Interfejs potrzebny do nowoczesnych aplikacji internetowych. Przed ARIA przeglądarka nie miała możliwości ujawnienia tego dodatkowego bogactwa w interfejsie API dostępności lub AT. Klasycznym przykładem tego problemu jest dodanie modułu obsługi kliknięć do obrazu. Tworzy to, co wydaje się klikalnym przyciskiem dla użytkownika myszy, ale nadal jest tylko obrazem dla klawiatury lub użytkownika AT.

Rozwiązaniem było stworzenie zestawu atrybutów, które umożliwią programistom rozszerzenie HTML przy użyciu semantyki interfejsu użytkownika. Termin ARIA dla grupy elementów HTML, które mają niestandardową funkcjonalność i używają atrybutów ARIA do mapowania tych funkcji na interfejsy API ułatwień dostępu, to „widżet. ARIA zapewnia również autorom środki do dokumentowania roli samej treści, co z kolei pozwala AT budować alternatywne mechanizmy nawigacji dla treści, które są znacznie łatwiejsze w użyciu niż czytanie pełnego tekstu lub tylko iteracja po liście linków.

Ważne jest, aby pamiętać, że w prostych przypadkach znacznie lepiej jest używać rodzimych kontrolek HTML i stylizować je niż używać ARIA. Nie wymyślaj na nowo kół ani pól wyboru, jeśli nie musisz.

Na szczęście znaczniki ARIA można dodawać do istniejących witryn bez zmiany zachowania głównych użytkowników. To znacznie obniża koszty modyfikacji i testowania strony internetowej lub aplikacji.

Zadałem inne pytanie dotyczące ARIA. Ale treść tego pytania wygląda bardziej obiecująco. chciałbym się nimi podzielić

Co to jest ARIA?

Jeśli dołożysz wszelkich starań, aby Twoja witryna była dostępna dla użytkowników z różnymi nawykami przeglądania i niepełnosprawnościami fizycznymi, prawdopodobnie rozpoznasz rolę i atrybuty aria- *. WAI-ARIA (Accessible Rich Internet Applications) to metoda zapewniająca sposoby definiowania dynamicznych treści i aplikacji internetowych, aby osoby niepełnosprawne mogły je zidentyfikować i skutecznie z nimi współpracować. Odbywa się to za pomocą ról, które definiują strukturę dokumentu lub aplikacji, lub poprzez atrybuty aria- * definiujące rolę widgetu, relację, stan lub właściwość.

W specyfikacjach zalecane jest użycie ARIA, aby aplikacje HTML5 były bardziej dostępne. Korzystając z semantycznych elementów HTML5, powinieneś ustawić ich odpowiednią rolę.

I zobacz to wideo z YouTube dla ARIA na żywo.