New window buttons were not identified

[mkdir-washington-edu]

From the HighWire Press / McGraw-Hill Accessibility spreadsheet: https://hypothes-is.slack.com/archives/C8TPC8XMK/p1736535764817829

Highwire Press Reproduction

1. Using screen reader, navigate to the ""Annotation Sidebar"" button and activate it.
2. 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 tag and specify alt as ""Opens in a new tab"".

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>