skills.rest
UI5
UI5OFFICIAL
Explore all skills by this author →
WebsiteGitHub

accessibility

Implement ARIA attributes and keyboard navigation for UI5 Web Components.

1.8k|284|Updated Jan 24, 2019
Search Tags:#accessibility#screen reader#keyboard navigation#web components#aria#ui5
One-click install
npx skills add https://github.com/UI5/webcomponents --skill accessibility-ui5
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: accessibility
Source: https://github.com/UI5/webcomponents/tree/main/skills/accessibility
Command: npx skills add https://github.com/UI5/webcomponents --skill accessibility-ui5

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps developers understand and implement accessibility features for UI5 Web Components, ensuring applications are usable by everyone, including those with disabilities.

Core Features & Use Cases

  • ARIA Attributes: Learn how to use accessibleName, accessibleNameRef, accessibleDescription, accessibleRole, and accessibilityAttributes to provide semantic meaning.
  • Keyboard Navigation & Screen Reader Support: Understand how UI5 Web Components handle these out-of-the-box and how to enhance them.
  • Use Case: A developer needs to make an icon-only button accessible to screen readers. They can use the accessible-name property to provide a descriptive label.

Quick Start

Use the accessibility skill to learn how to set an accessible name for an icon-only button.

Frequently Asked Questions about accessibility

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I make UI5 Web Components accessible for screen readers?▼

Make UI5 Web Components accessible for screen readers by using built-in ARIA attributes like `accessibleName`, `accessibleNameRef`, and `accessibleDescription` to provide semantic meaning to custom elements.

How do I add an accessible name to an icon-only button in UI5?▼

Add an accessible name to an icon-only button in UI5 by setting the `accessible-name` property on the component, providing a descriptive text label that screen readers can announce to users.

Does UI5 handle keyboard navigation out of the box?▼

UI5 Web Components handle keyboard navigation and screen reader support out of the box, allowing developers to enhance default accessibility behaviors further using ARIA attributes for custom enterprise applications.

What ARIA attributes are available for UI5 Web Components?▼

Available ARIA attributes for UI5 Web Components include `accessibleName`, `accessibleNameRef`, `accessibleDescription`, `accessibleRole`, and `accessibilityAttributes` to ensure proper semantic meaning and label-input relationships.

When do I need to set accessibility attributes in enterprise web components?▼

Set accessibility attributes in enterprise web components when customizing standard elements, such as providing descriptive labels for icon-only buttons or modifying roles, to ensure applications are usable by everyone.

Related Skills

Explore More Software Engineering Skills→
balkhaevbalkhaev

shadcn

Manage shadcn/ui component lifecycle and enforce Tailwind CSS patterns.

Community
Advanced
pacphipacphi
6

accessibility-testing

Perform WCAG 2.2 accessibility testing on web applications with axe-core.

Community
Advanced
japurcelljapurcell

fixing-accessibility

Identify and fix accessibility issues in UI components to meet WCAG guidelines.

Community
Intermediate
kennedym-dskennedym-ds
14

accessibility-wcag

Evaluate and implement WCAG 2.1 AA accessibility patterns for frontend web development.

Community
Advanced