Hide offscreen input for A11y

TODO: collapasable, copyable, download, etc

If I hide an input offscreen with absolute positionign, what kind of A11y updates should I make to it so that screen readers ignore it?Hiding an input offscreen while ensuring it's ignored by screen readers involves a few key steps:

1. Use aria-hidden Attribute: Set the aria-hidden="true" attribute on the element. This explicitly tells assistive technologies like screen readers to ignore the element.

2. Add role="presentation" or role="none": These roles can be used to indicate that the element is purely presentational and should not be announced by screen readers.

3. Ensure Keyboard Inaccessibility: If the element should not be interactable, make sure it's not focusable. This can be done by removing or disabling any tabindex attributes.

4. Consider Using display: none or visibility: hidden: These CSS properties effectively remove the element from the accessibility tree when applied, making it ignored by screen readers. However, if you need the element to remain in the layout flow (which display: none doesn't allow), sticking with offscreen positioning is fine.

Remember that different screen readers may behave slightly differently, so testing with multiple screen readers (like NVDA, JAWS, VoiceOver) can be beneficial to ensure the element is consistently ignored.

Hide offscreen input for A11y created at Tue Jan 20 1970 17:43:53 GMT+0000 (Coordinated Universal Time)