Hide and Seek

No walls before the content

Does a cookie banner, age gate, or sign-up box come before the content in the page?

Readability · 20 of 120 in Readability · yours to do · walls

What we check

On the home page and the sampled pages, we look for an overlay that comes before your content in the page’s HTML: a cookie or consent banner, an age check, a newsletter sign-up, a paywall, or any pop-up or dialog. We find these by their usual markup (a dialog element, a modal role) and their usual names (cookie, consent, newsletter, paywall, popup, and so on).

A page fails if such an overlay comes before the main content and has more text than the content does, or if the page’s text opens with it. An overlay inside the main content is treated as part of the content. Otherwise, the page passes. The check scores the average across pages, and the report names the pages with a wall.

Why it matters

People see a banner floating over the page. A bot reading the HTML sees text in order, and if the first thing on the page is three paragraphs of cookie policy, that’s what it reads first — and sometimes all it reads. An assistant summarizing your site may describe your consent banner.

How to pass

  1. Put the content first in the HTML, and the overlay after it. Its position on screen is set by the stylesheet, so moving it in the source doesn’t change how it looks:
    <body>
      <main>…your content…</main>
      <div class="cookie-banner" role="dialog">…</div>
    </body>
  2. Or load the overlay with JavaScript after the page has loaded, or when someone scrolls or clicks.
  3. Keep consent text short and link to the full policy rather than including it.
  4. If your consent tool injects its banner at the top of the body, look for a setting that loads it at the end instead.

Last changed .

All the checks