aria-hidden 属性

aria-hidden 属性は、要素がアクセシビリティ API に公開されているかどうかを示します。

ユーザーエージェントがある要素をレンダリングするかを決定する際、通常 CSS の指定によって判断されます。例えば、display: none; が指定されている要素はレンダリングされません。また、レンダリングされていない要素は、アクセシビリティ API によっても公開されません。

aria-hidden 属性は、その要素、あるいは先祖となる要素がレンダリングされている状態で、アクセシビリティ API によって要素を公開するかを指定します。つまり、aria-hidden 属性の値が true に設定されている場合、その要素がレンダリングされていたとしても、アクセシビリティ API においては hidden とみなされます。

aria-hidden="true" がある要素に指定されると、その子孫要素はすべてアクセシビリティ API によって非表示の扱いになることに注意してください。例えば、aria-hidden="true" を指定した要素内で、子要素に aria-hidden="false" を指定しても、その要素はアクセシビリティ API によって公開されません。

aria-hidden 属性は、冗長なコンテンツや、余計なコンテンツを取り除くことによって、支援技術の利用者の利便性や体験を向上させると考えられる場合のみ使用してください。