You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The input needs proper, accessible labelling readable for screenreaders
Link needs proper labelling readable for screenreaders
Search field should have sufficient contrast making it clearly visible for people with low vision
Placeholder text should have better contrast with the input's background colour
All these changes should improve the UX for users with screenreaders.
Proposal & Constraints
SVGs to be made invisible for screenreaders with aria-hidden="true", they should also be made unfocusable (for the few IE users who still exist). See W3's support resource (under the examples tab)
Replace fieldset with a div
Remove the invisible label and instead add an aria-label="Search the Wayback Machine" attribute to the input
Add an aria-label="Go to Wayback Machine homepage" attribute to the
Either change the colour of the background of the input's parent element OR add a contrasting colour border to the input (see attached image below)
Change input's BG colour to white. Unfortunately this will still be insufficient contrast but that is the nature of the placeholder attribute (hence it's often not advised to be used) (see attached image below)
+1 Make the border radius of the input field the same as the background element (currently fieldset) for a better visual harmony (see attached image below)
Stakeholders
Unsure, but I'm more than happy to pick this issue up (already have most of it done on my local fork)
The text was updated successfully, but these errors were encountered:
Description
ia-wayback-search package has some accessibility issues:
<fieldset>
display:none
which makes it invisible for screenreaders+1 Border radius mismatch (this is really just a visual/design thing)
Expectation
All these changes should improve the UX for users with screenreaders.
Proposal & Constraints
aria-hidden="true"
, they should also be made unfocusable (for the few IE users who still exist). See W3's support resource (under the examples tab)aria-label="Search the Wayback Machine"
attribute to theinput
+1 Make the border radius of the input field the same as the background element (currently fieldset) for a better visual harmony (see attached image below)
Stakeholders
Unsure, but I'm more than happy to pick this issue up (already have most of it done on my local fork)
The text was updated successfully, but these errors were encountered: