components
Header
v.1.0.0 | SaturnAccessibility is a crucial consideration when designing and developing components, as it ensures that all users, regardless of their abilities or limitations, can interact effectively with your project. In this section, we will explore how our header has been developed with accessibility in mind, ensuring that all users have a smooth and meaningful experience.
The following mencioned props and recommendations are optional, althougt at Kubit strongly recommend their use to meet accessibility standars.
Text
The title is a heading that should be clear and concise, and also the other links, breacrumbs or interactive text display.
Images
- If the image is decorative, this information should be hidden to the screen reader users so they don't have to lister the information twice.
- If the image is a button it needs a text description that will be the accessible label for screen reader users, and when possible will we include a visible text label to facilitate the interaction for people that uses speech recognition softwares. The accessible label has to include buttons functionality so screen reader users could receive an equivalent information.
Semantic markup
If the header and interactive elements within the Header Landing use a correct semantic markup:
- Screen readers will be informed about the level of the heading presented.
- Screen reader and keyboard users will be able to understand which interactive elements are present within the Header Landing and interact with them.
- Screen readers could use the shortcuts to access directly to the heading or interactive elements within the Header Landing.
Related components
Check other components specific accesibility recommendations:
