Aria 1 Flashcards
What does ARIA stand for?
Web Accessibility Initiative – Accessible Rich Internet Applications
What is the primary purpose of ARIA?
To improve accessibility for complex and dynamic web content that standard HTML cannot fully support
What are ARIA roles used for?
They define the purpose of an element to assistive technologies like screen readers
What ARIA role should be used for a modal dialog?
role=”dialog”
Which ARIA attribute is used to indicate whether an element is expanded or collapsed?
aria-expanded
What ARIA attribute should be used to provide a description for an element?
aria-describedby
How does aria-live=”assertive” affect screen readers?
It announces updates immediately
What is the best ARIA alternative to a <button> when using a <div>?</button>
role=”button” along with tabindex=”0” and aria-pressed if toggleable
What ARIA attribute hides content from screen readers?
aria-hidden=”true”
When should ARIA be avoided?
When native HTML elements already provide the required accessibility
What does aria-labelledby do?
It associates an element with another element that serves as its label
How can you ensure ARIA attributes update dynamically?
By using JavaScript to modify ARIA states and properties in response to user interactions
What ARIA attribute should be used for a notification area?
aria-live=”polite”
What is aria-haspopup used for?
It indicates that an element opens a menu
Which ARIA role should be used for a collapsible navigation section?
role=”navigation” with aria-expanded
What does aria-controls do?
It specifies the ID of the element being controlled by another element
What ARIA role should be used for a tab panel?
role=”tabpanel”
What does aria-current=”page” indicate?
It marks the current page or section in navigation
Why should native HTML elements be preferred over ARIA?
Because built-in HTML elements provide better browser and assistive technology support
