What component has

Roles and attributes

Roles & attributes

Attribute	Usage
aria-busy="true"	Indicates that the element is being modified and that assistive technologies may want to wait until the changes are complete before informing the user about the update.
aria-label="Loading…"	Sets an accessible name for the element.

Considerations for developers and designers

• When displaying Skeleton in place of a heading, avoid semantic heading markup, as this can make navigation confusing for screen reader users.
• Place Skeleton inside a container with role="status" and aria-live="polite" attributes for the screen reader to announce the start of the loading process (example).

Resources

• Detailed information about aria-busy state you can find in the W3's guide.
• MDN's guide for aria-busy describes core information for this state.

Other recommendations

See more accessibility recommendations in the common Accessibility guide.