Smart.Splitter - Accessibility

Accesibility Attributes

Web accessibility makes web content and web applications more accessible to disabled people. It's especially helpful in dynamic content changes and development of advanced user interface components with HTML, Javascript and related technologies. Smart HTML elements framework offers full accessibility support for it's web components.

Splitter provides a built-in compliance with WAI-ARIA specification. This is achieved through attributes like role, aria-orientation, aria-controls and others. The role of the component is group. Group elements are user interface objects which are not intended to be included in a page summary or table of contents by assistive technologies.

The purpose of the ARIA attributes is to help disabled people by providing the information specific to the component to assistive technology in the screen readers.

The Splitter component contains controls that determine the behavior of the element. Each of them has a different role:

• region - the splitter items inside the Splitter contain the actual content of the component. They represent a perceivable section containing content that is relevant to a specific, author-specified purpose and sufficiently important that users will likely want to be able to navigate to the section easily and to have it listed in a summary of a page.
• separator - the splitter bars inside the Splitter that split the content into multple items. They act as dividers that separate and distinguish sections of content or groups of items.

The following ARIA attributes are in use by the component:

• aria-disabled - indicates that the interaction with the Splitter component is disabled.
• aria-hidden - indicates that an element does not provide feedback to the user and as such it does not take part in the accessibility support. The arrow icons in the collapse/expand buttons inside the splitter bars and the resize button have the attribute applied.
• aria-controls - applied to the splitter bars inside the Splitter, this attribute indicates the splitter items that are controlled by the splitter bar. The attribute references the items by their id.
• aria-label - applied to the splitter bars in order to provide a textual representation of the elements to the assistive technologies since they do not have any content.
• aria-orientation - applied to the splitter items and bars, this property indicates the orientation of the Splitter. The Splitter component can be 'horizontal' or 'vertical'.

Keyboard Interaction

The following keyboard shortcuts are available for interaction with the Splitter:

Additional information on WAI-ARIA for the SMART Framework can be found here.