szit

Ez az oldal csak olvasható. Megtekintheted a forrását, de nem változtathatod meg. Ha úgy gondolod, hogy ez helytelen, kérdezd az Adminisztrátorokat!
[[:oktatas:web:html|< HTML]]

====== ARIA ======

  * **Szerző:** Sallai András
  * Copyright (c) 2024, Sallai András
  * Szerkesztve: 2024
  * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC BY-SA 4.0]]
  * Web: https://szit.hu

===== Bevezetés =====

Az **ARIA**, az **Accessible Rich Internet Applications** rövidítése. 
 
A webes alkalmazások hozzáférését segíti fogyatékkal élők számára.
A JavaScriptet és HTML5-t használó weboldalak számára jobb együttműködést
biztosítanak a segítő technológiák számára, mint a képernyőolvasók és a
speciális beviteli eszközök.


  * Az egyes HTML elemeknek szerepköröket határozhatunk meg.
  * A HTML elemek számára speciális attribútumokat használhatunk, amelyek állapotokról tájékoztatnak. Például elérhető, nem elérhető stb.

<code html>
<button aria-pressed="true">Kattints rám</button>
</code>




===== Példa =====

<code html index.html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ARIA Példa</title>
</head>
<body>

<!-- Normál gomb -->
<button onclick="alert('Hello World!')">Kattints rám!</button>

<!-- ARIA attribútumokkal ellátott gomb -->
<button 
    onclick="alert('Hello World!')" 
    aria-label="Kattints rám!" 
    aria-describedby="button-description">
    Kattints rám!
</button>

<div 
    id="button-description" 
    style="display: none;">
        Ez a gomb egy üdvözlő üzenetet jelenít meg.
</div>

</body>
</html>

</code>

===== Linkek =====

  * https://www.w3.org/TR/wai-aria/ (2024; Specifikáció)
  * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA (2024)