The Hidden Helper visually hides an element.
Though the element is hidden from visual media, it is kept
in the accessibility tree so that assistive technology such as screen readers
can still expose it to users.
A skip link
is a common use case for this pattern.
Note: The [aria-hidden] attribute
has the opposite effect:
it hides an element from the accessibility tree while keeping it visually exposed.
To hide the element from both the accessibility tree and visual media, you can use
[class="h-Hidden" aria-hidden="true"], or you can use the
[hidden] attribute,
which is the preferred approach if the element is not
directly relevant.