Keeping hidden text findable
Text that is visually hidden cannot be found by the browser's find-in-page feature and may not be visible to accessible technology like screen readers. This is a problem for screen reader users, who rely on this feature to navigate content. This post explains how to make hidden text findable for everyone. ## The problem hidden text in a web page is not searchable when you use the browser's built-in find-in-page feature. This is a problem for screen reader users, who rely on this feature to navigate content. For example, if a user is looking for a specific word or phrase in hidden sections of a document, they may not be able to find it if it is hidden from view. ## One possible solution One solution that avoids Javascript is to use the `hidden` attribute with the value `until-found`. This attribute is a new HTML feature that allows you to hide content until it is found by the user. When the user searches for a word or phrase, the hidden content will be revealed, making it accessible to everyone. This example lets you find content inside the `details` elements, even if they are not visible on the page. The first set of `summary` elements has the `hidden` attribute with the `until-found` value. These elements are visually hidden but are searchable and accessible to assistive technology. The second set of `details` elements are the ones that hold the content that will be searched. These elements make up a mutually exclusive accordion where only one of the `details` elements can be open at a time. ```html