Skip to content
Back to Learn
Pulseaccessibility

aria-hidden Is Not on the Body

Ensure aria-hidden is not present on the document body.

What This Audit Checks

This audit verifies that aria-hidden="true" is not set on the <body> element. When the body is marked as hidden from assistive technologies, the entire page becomes invisible to screen readers.

Why It Matters

Setting aria-hidden="true" on the body hides every element on the page from screen readers. Users who rely on assistive technology will perceive a completely blank page and cannot interact with any content.

How to Fix It

  • Remove aria-hidden from the <body> element immediately. This is always a critical bug.
  • Audit your modal/dialog logic. This issue most commonly occurs when a modal script adds aria-hidden="true" to the body to hide background content, then fails to remove it when the modal closes.
  • Use inert instead. The inert attribute is a better way to disable background content behind modals without hiding the body.
<!-- Bad: entire page hidden from assistive tech -->
<body aria-hidden="true">...</body>

<!-- Good: no aria-hidden on body -->
<body>...</body>

<!-- Better for modals: use inert on the background wrapper -->
<div id="main-content" inert>...</div>
<div role="dialog" aria-label="Settings">...</div>

How Pulse Tracks This

Pulse flags this audit in your Lighthouse accessibility score. When the audit fails, Pulse shows which elements triggered it so you can fix them directly.

Resources

aria-hidden Is Not on the Body