---
title: ARIA
slug: Web/Accessibility/ARIA
tags:
  - ARIA
  - Accessibility
  - NeedsTranslation
  - TopicStub
  - Web
translation_of: Web/Accessibility/ARIA
---
<p class="summary"><span class="seoSummary">Accessible Rich Internet Applications <strong>(ARIA)</strong> jest zbiorem atrybutów, które umożliwiają rozwój aplikacji webowych (szczególnie tych, które wykorzystują AJAX, Javascript itp.) w taki sposób, iż są one przyjaźniejsze ludziom z niepełnosprawnościami.  Dla przykładu, ARIA umożliwia bezproblemową nawigację po stronie, pomoce przy typowaniu, przyjazne użytkownikowi aktualizacje treści, i wiele, wiele więcej. </span></p>

<p>ARIA jest zbiorem specjalnych atrybutów poprawiajacych dostępność aplikacji, które mogą zostać dodane do dowolnego języka znaczników. Jednakże atrybuty te są przystosowane głównie pod HTML, co powoduje, iż są one wyłącznie tam stosowane.<br>
 Atrybut <code>role</code> definiuje specjalne role dla obiektów (takich jak <code>article</code> , <code>alert</code> , <code>slider</code> , czy <code>button</code> ). Dodatkowo atrubuty ARIA dostarczają inne przydatne opcje, takie jak opis do <code>form</code> , albo właściwą długość pasku postępu (np. instalacji, aktualizacji lub innego działania). Atrybuty aria moga także zostać użyte w celu aktywacji, deaktywacji, czy ustalenia innego stanu obiektów (np. stanu <code>button</code>)<br>
  </p>

<p>ARIA jest zaimplementowana w najbardziej popularnych przeglądarkach i czytnikach ekranowych. Jednakże, implementacje różnią się między sobą i starsze technologie mogą takich atrybutów dobrze nie wspierać. Oczywiście jeśli w ogóle wspierają.</p>

<div class="note">
<p><strong>Note</strong>: Please contribute and make ARIA better for the next person! Not enough time? Send suggestions to Mozilla's <a href="https://lists.mozilla.org/listinfo/accessibility">accessibility mailing list</a>, or #accessibility <a href="https://wiki.mozilla.org/IRC">IRC channel</a>.</p>
</div>

<div class="row topicpage-table">
<div class="section">
<h3 id="Zacznij_z_ARIĄ">Zacznij z ARIĄ</h3>

<dl>
 <dt>Instrukcje do ARI</dt>
 <dd>A quick introduction to making dynamic content accessible with ARIA. See also the classic <a class="external" href="http://dev.opera.com/articles/view/introduction-to-wai-aria/">ARIA intro by Gez Lemon</a>, from 2008.</dd>
 <dt><a href="/en-US/docs/Accessibility/ARIA/Web_applications_and_ARIA_FAQ">Web Applications and ARIA FAQ</a></dt>
 <dd>Answers common questions about WAI-ARIA and why it's needed to make web applications accessible.</dd>
 <dt><a class="external" href="http://zomigi.com/blog/videos-of-screen-readers-using-aria-updated/">Videos of Screen Readers Using ARIA</a></dt>
 <dd>See both real and simplified examples from around the web, including "before" and "after" ARIA videos.</dd>
 <dt><a class="external" href="http://w3c.github.io/aria-in-html/">Using ARIA in HTML</a></dt>
 <dd>A practical guide for developers. It suggests what ARIA attributes to use on HTML elements. Suggestions are based on implementation realities.</dd>
</dl>

<h3 id="Simple_ARIA_Enhancements">Simple ARIA Enhancements</h3>

<dl>
 <dt><a class="external" href="https://www.paciellogroup.com/blog/2013/02/using-wai-aria-landmarks-2013/">Enhancing Page Navigation with ARIA Landmarks</a></dt>
 <dd>A nice intro to using ARIA landmarks to improve web page navigation for screen reader users. <a class="external" href="http://www.paciellogroup.com/blog/2011/07/html5-accessibility-chops-aria-landmark-support/">See also, ARIA landmark implementation notes</a> and examples on real sites (updated as of July 2011).</dd>
 <dt><a href="/en-US/docs/ARIA/forms">Improving Form Accessibility</a></dt>
 <dd>ARIA is not just for dynamic content! Learn how to improve accessibility of HTML forms using additional ARIA attributes.</dd>
 <dt><a href="/en-US/docs/Accessibility/ARIA/ARIA_Live_Regions" title="Live Regions">Live regions (work-in-progress)</a></dt>
 <dd>Live regions provide suggestions to screen readers about how to handle changes to the contents of a page.</dd>
 <dt><a class="external" href="http://www.freedomscientific.com/Training/Surfs-up/AriaLiveRegions.htm">Using ARIA Live Regions to Announce Content Changes</a></dt>
 <dd>A quick summary of live regions, by the makers of JAWS screen reader software. Live regions are also supported by NVDA with Firefox, and VoiceOver with Safari.</dd>
</dl>

<h3 id="ARIA_for_Scripted_Widgets">ARIA for Scripted Widgets</h3>

<dl>
 <dt><a class="external" href="/en-US/docs/Accessibility/Keyboard-navigable_JavaScript_widgets">Keyboard Navigation and Focus for JavaScript Widgets</a></dt>
 <dd>The first step in developing an accessible JavaScript widget is to make it keyboard navigable. This article steps through the process. The <a class="external" href="http://www.yuiblog.com/blog/2009/02/23/managing-focus/">Yahoo! focus management article</a> is a great resource as well.</dd>
 <dt><a class="external" href="http://access.aol.com/dhtml-style-guide-working-group/">Style Guide for Keyboard Navigation</a></dt>
 <dd>A challenge with ARIA is getting developers to implement consistent behavior — clearly best for users. This style guide describes the keyboard interface for common widgets.</dd>
</dl>

<h3 id="ARIA_Resources">ARIA Resources</h3>

<dl>
 <dt><a href="/en-US/docs/Accessibility/ARIA/widgets/overview">Widget Techniques, Tutorials, and Examples</a></dt>
 <dd>Need a slider, a menu, or another kind of widget? Find resources here.</dd>
 <dt><a class="external" href="http://www.paciellogroup.com/blog/2009/07/wai-aria-implementation-in-javascript-ui-libraries/">ARIA-Enabled JavaScript UI Libraries</a></dt>
 <dd>If you're starting a new project, choose a UI widget library with ARIA support already built-in. Warning: this is from 2009 — content should be moved to an MDN page where it can be updated.</dd>
</dl>
</div>

<div class="section">
<h3 id="Mailing_List">Mailing List</h3>

<dl>
 <dt><a class="link-https" href="https://groups.google.com/forum/#!forum/free-aria">Free ARIA Google Group</a></dt>
 <dd>A place to ask questions about ARIA, as well as make suggestions for improving the ARIA documentation found on these pages.</dd>
</dl>

<h3 id="Blogs">Blogs</h3>

<p>ARIA information on blogs tends to get out of date quickly. Still, there is some great info out there from other developers making ARIA work today.</p>

<p><a class="external" href="https://www.paciellogroup.com/blog/archive/">Paciello Group</a></p>

<p><a class="external" href="http://www.accessibleculture.org/tag/wai-aria/">Accessible Culture</a></p>

<h3 id="Filing_Bugs">Filing Bugs</h3>

<p><a href="/en/Accessibility/ARIA/How_to_file_ARIA-related_bugs" title="https://developer.mozilla.org/en/ARIA/How_to_file_ARIA-related_bugs">File ARIA bugs on browsers, screen readers, and JavaScript libraries.</a></p>

<h3 id="Examples">Examples</h3>

<dl>
 <dt><a class="external" href="/en-US/docs/Accessibility/ARIA/ARIA_Test_Cases">ARIA Examples Library</a></dt>
 <dd>A set of barebones example files which are easy to learn from.</dd>
 <dt>Accessible JS Widget Library Demos</dt>
 <dd><a class="external" href="http://hanshillen.github.com/jqtest/">jQuery</a>, <a class="external" href="http://yuilibrary.com/gallery/">YUI</a></dd>
 <dt><a class="external" href="http://mail.yahoo.com">Yahoo! Mail</a></dt>
 <dd>Yahoo! puts it all together with Yahoo! Mail, a web app that almost looks like a native app. It works very well. As a <a class="external" href="http://www.marcozehe.de/2011/09/21/review-the-all-new-yahoo-mail-web-application/">review of Yahoo! Mail</a> by screen reader Marco Zehe says, "Keep up the good work!".</dd>
 <dt><a class="external" href="http://search.yahoo.com">Yahoo! Search</a></dt>
 <dd>Yahoo! has done an amazing job of advancing ARIA here, by exercising ARIA's full capabilities and <a class="external" href="http://ycorpblog.com/2011/03/23/searchdirect/">sharing their techniques</a>. Yahoo! Search uses a combination of ARIA landmarks, live regions, and widgets.</dd>
</dl>

<h3 id="Standardization_Efforts">Standardization Efforts</h3>

<dl>
 <dt><a class="external" href="http://www.w3.org/WAI/intro/aria.php">WAI-ARIA Activities Overview at W3C</a></dt>
 <dd>Authoritative Overview of WAI-ARIA Standardization efforts by the Web Accessibility Initiative (WAI)</dd>
 <dt><a class="external" href="http://www.w3.org/TR/wai-aria/">WAI-ARIA Specification</a></dt>
 <dd>The W3C specification itself, useful as a reference. Note that, at this stage, it is important to test compatibility, as implementations are still inconsistent.</dd>
 <dt><a class="external" href="http://www.w3.org/WAI/PF/aria-practices/">WAI-ARIA Authoring Practices</a></dt>
 <dd>
 <p>Like the W3C WAI-ARIA specification, the official best practices represents a future ideal — a day when authors can rely on consistent ARIA support across browsers and screen readers. The W3C documents provide an in-depth view of ARIA.</p>

 <p>For now, web developers implementing ARIA should maximize compatibility. Use best practices docs and examples based on current implementations.</p>
 </dd>
 <dt><a class="external" href="http://www.openajax.org/member/wiki/Accessibility">Open AJAX Accessibility Task Force</a></dt>
 <dd>The Open AJAX effort centers around developing tools, sample files, and automated tests for ARIA.</dd>
 <dt><a href="/en-US/docs/Accessibility/ARIA/ARIA_Techniques" title="ARIA Techniques">Under Construction: WCAG 2.0 ARIA Techniques</a></dt>
 <dd>The community needs a complete set of WCAG techniques for WAI-ARIA + HTML, so that organizations can be comfortable claiming their ARIA-enabled content is WCAG compliant. This is important when regulations or policies are based on WCAG.</dd>
</dl>
</div>
</div>

<h3 id="Related_Topics" name="Related_Topics">Related Topics</h3>

<p><a href="/en-US/docs/Accessibility">Accessibility</a>, <a href="/en-US/docs/AJAX">AJAX</a>, <a href="/en-US/docs/JavaScript">JavaScript</a></p>