Accessibility of the Combobox for choosing business type

[mohammad-suliman]

Problem description:

The Combobox for choosing business type suffers from the following accessibility issues:

• It doesn't seem that it has a proper label. There is however a placeholder, a technique which fails the accessibility standards due to several reasons:
  • The most obvious one is that it disappears when content is inputted to the field it corresponds to
  • The second reason is that the color of the placeholder text compared to the background color doesn't reach the required ratio by the standard
• It doesn't seem that the combobox can be operated with the keyboard
• No aria markup is defined for the component so a screen reader can report the currently selected value

Solution:

• Maybe the Combobox can be defined as the one in the following example
• If another Combobox type is desired, I think the site has all sorts of examples
• Please also note the accessibility features of the Combobox for different types of interactions, be it using only the keyboard with and without a screen reader