hypothesis
New window buttons were not identified
From the HighWire Press / McGraw-Hill Accessibility spreadsheet: https://hypothes-is.slack.com/archives/C8TPC8XMK/p1736535764817829
Highwire Press Reproduction
- Using screen reader, navigate to the ""Annotation Sidebar"" button and activate it.
- Navigate to the ""Sign up"" and ""Log in"" buttons and listen that the new window information is not announced.
HighWire Expected Result New window information should be announced to all the users.
HghWire Actual Result Users were not informed about ""Sign up"" and ""Login buttons displaying information in a new tab.
Code Snippet:
<button role=""button"" data-component=""LinkButton"" type=""button"" class=""focus-visible-ring transition-colors whitespace-nowrap rounded flex items-center no-underline hover:no-underline aria-pressed:font-semibold aria-expanded:font-semibold text-brand enabled:hover:text-brand-dark inline"">Sign up</button>
HighWire Rationale New window buttons when used without informing users in advance lead to confusion for users with learning and visual disabilities as all of a sudden "Back" button of the browser becomes disabled.
HighWire Recommendation Inform users in advance about buttons opening in a new tab. This can be done by providing an image icon depicting new window besides the buttons. The image icon must be inside the
Suggested code:
<button role=""button"" data-component=""LinkButton"" type=""button"" aria-label=""Sign up (opens in a new tab)"" class=""focus-visible-ring transition-colors whitespace-nowrap rounded flex items-center no-underline hover:no-underline aria-pressed:font-semibold aria-expanded:font-semibold text-brand enabled:hover:text-brand-dark inline"">Sign up</button>
