Hi
The background image makes this unreadable for me.
And do you think each item of the results would be clickable? What do you think would happen on click? The content looks static to me, but I can see transitions as I touch each one on mobile, which makes me think they’re interactive
@SameerJS6
Posted
First of all, thank you @grace-snow for pointing this out. Here are some clarifications:
- In this whole component, there is only one clickable element, i.e. the Continue Button, but it does not take the user anywhere.
- Second, the results are not meant to be clicked, but they do interact when hovered or clicked on mobile.
- Third, regarding the background image, I agree with you. However, the whole intention of adding it was to make the component look nice.
@SameerJS6 the problem is, by doing this you have made it fail WCAG accessibility requirements. If it's unreadable, it becomes exclusionary to many
Similarly, adding hovers to non-interactive elements is unexpected UX. People try to click on them, but will then presume they are broken. I have had this exact bug reported several times when I was starting out over 10 years ago - You learn quickly to focus on eliminating confusion like that for users
