Przejdź do treści
Mera News

Poradnik dla wydawców, rozdział 3

Wyskakujące okna i zgody

Ostatnia weryfikacja: listopad 2026

Każde okno, które pojawia się nad artykułem, staje między czytelnikiem a powodem, dla którego przyszedł. Niektóre są wymagane prawem. Wiele nie. Ten rozdział omawia, czego oczekuje Google, co o zgodzie powiedzieli europejscy regulatorzy i jak zbudować komunikat, który działa z klawiaturą i czytnikiem ekranu. Nie jest to porada prawna, więc skonsultuj swój baner z własnym prawnikiem.

Czego oczekuje Google

Google opisuje uciążliwe nakładki (intrusive interstitials) jako elementy strony, które zasłaniają czytelnikowi treść, i ostrzega, że mogą prowadzić do gorszych wyników w wyszukiwarce. Jego wskazówki są konkretne:

  • Nie zasłaniaj całej strony.
  • Nie kieruj czytelnika na osobną stronę po zgodę lub dane. Jeśli każdy adres URL przekierowuje na jedną stronę zgody, wszystkie poza nią mogą zniknąć z wyników wyszukiwania.
  • Używaj banerów zajmujących niewielką część ekranu zamiast nakładek na całą stronę.
  • Zachowaj tę samą ostrożność wobec okien promocyjnych każdego rodzaju, w tym próśb o zapis na newsletter i o instalację aplikacji.

W przypadku instalacji aplikacji Google wskazuje opcje obsługiwane przez przeglądarki, takie jak Smart App Banners w Safari, lub zwykły baner HTML z linkiem do właściwego sklepu.

Nakładki wymagane prawem są wyłączone spod tych wskazówek. Przykładem Google są bramki wiekowe. Jeśli potrzebujesz takiej, zostaw treść na stronie pod nakładką, aby nadal mogła być indeksowana.

Better Ads Standards dotyczą reklam. Reklamy pop-up są wymienione zarówno na komputerze, jak i na telefonie. Na telefonie reklamy prestitial są wymienione z odliczaniem lub bez. Na komputerze wymieniony jest format prestitial z odliczaniem, a taki, który można zamknąć od razu, nie spada poniżej standardu.

Co o zgodzie powiedzieli europejscy regulatorzy

Europejska Rada Ochrony Danych (EDPB) opublikowała wytyczne dotyczące zgody oraz raport swojej grupy zadaniowej ds. banerów cookie. Raport grupy zapisuje minimalny próg uzgodniony przy rozpatrywaniu skarg, a przepisy krajowe nadal obowiązują, więc traktuj te punkty jako podstawę.

  • Nic, co wymaga zgody, nie uruchamia się jako pierwsze. Plików cookie wymagających zgody nie można ustawić, dopóki czytelnik nie wyrazi zgody wyraźnym działaniem.
  • Przewijanie nie jest zgodą. Wytyczne mówią, że przewijanie ani przesuwanie palcem nie będzie w żadnych okolicznościach uznane za jasne i potwierdzające działanie.
  • Zaznaczone z góry pola nie są zgodą. To samo dotyczy milczenia lub zwykłego dalszego korzystania z usługi.
  • Zaoferuj sposób odmowy. Zdecydowana większość organów w grupie zadaniowej uznała baner bez opcji odmowy na żadnej warstwie z przyciskiem zgody za naruszenie.
  • Nie ukrywaj odmowy. Link do odmowy ukryty w akapicie, bez niczego, co zwracałoby na niego uwagę, nie prowadzi do ważnej zgody. Kolory przycisków i kontrast są oceniane indywidualnie.
  • Dostęp nie może zależeć od akceptacji. Wytyczne podają jako przykład zgody, która nie jest dobrowolna, stronę blokującą całą treść, dopóki czytelnik nie kliknie „Akceptuj pliki cookie”.
  • Wycofanie zgody musi być tak łatwe jak jej udzielenie. Jeśli zgoda wymagała jednego kliknięcia, jej wycofanie też powinno. Jedną z opcji jest stały link w widocznym, standardowym miejscu, a grupa zadaniowa wspomina także o małej ikonie.

Zbuduj komunikat, z którego każdy może skorzystać

Baner, który nie blokuje strony

Mały baner pozwala czytelnikowi czytać dalej, co Google woli. Nadal musi spełniać WCAG 2.2. Kryterium sukcesu 2.4.11, Focus Not Obscured (Minimum), nie jest spełnione, jeśli przypięty baner całkowicie zasłania element z fokusem klawiatury. Dodaj margines przewijania równy wysokości banera:

html {
  scroll-padding-bottom: 96px; /* the banner's height */
}

Nałóż baner na stronę albo zarezerwuj dla niego miejsce, aby nie spychał artykułu w dół i nie powodował przesunięcia układu.

Okno modalne

Jeśli komunikat musi zatrzymać czytelnika, zbuduj go jako prawdziwe okno modalne według wzorca W3C.

<div role="dialog" aria-modal="true"
     aria-labelledby="consent-title" aria-describedby="consent-text">
  <h2 id="consent-title">Your privacy choices</h2>
  <p id="consent-text">Choose whether this site may use cookies for advertising.</p>
  <button type="button">Reject all</button>
  <button type="button">Accept all</button>
  <button type="button">Choose settings</button>
</div>
  • Przenieś fokus do okna, gdy się otwiera.
  • Tab i Shift + Tab przechodzą po kontrolkach wewnątrz okna i zawijają się na obu końcach.
  • Escape zamyka okno. Traktuj to jako brak dokonanego wyboru, nigdy jako akceptację.
  • Gdy okno się zamyka, zwróć fokus do elementu, który je otworzył. Jeśli okno otworzyło się przy wczytaniu strony, przenieś fokus na początek treści.

Na telefonie

  • Zakotwicz baner na dole ekranu i zostaw nad nim widoczny nagłówek.
  • Ułóż przyciski jeden pod drugim na pełną szerokość, aby każdy łatwo było dotknąć, z przyciskami Akceptuj i Odrzuć w tym samym rozmiarze.
  • Utrzymuj krótki tekst, a szczegóły przenieś na drugą warstwę.
  • Sprawdź układ przy szerokości 320 pikseli CSS i przy tekście powiększonym do 200%. Przyciski muszą pozostać dostępne bez przewijania w bok.

Na komputerze

  • Użyj dolnego paska lub panelu w rogu i zostaw artykuł wolny.
  • Zadbaj, by każda kontrolka działała z klawiaturą, z widocznym wskaźnikiem fokusu.
  • Utrzymuj kontrast tekstu co najmniej 4,5:1, a dla dużego tekstu 3:1.

Lista kontrolna

  • Wczytaj stronę główną i artykuł na świeżym profilu przeglądarki, na telefonie i na komputerze. Policz, co pojawia się nad treścią.
  • Usuń każdą nakładkę na całą stronę, której nie wymaga prawo.
  • Usuń każde przekierowanie na osobną stronę zgody.
  • Upewnij się, że żaden tag wymagający zgody nie uruchamia się przed zgodą czytelnika.
  • Dodaj opcję odmowy wszędzie tam, gdzie jest opcja akceptacji, jako przycisk o równej wadze.
  • Usuń zaznaczone z góry pola i każdą logikę, która uznaje przewijanie za zgodę.
  • Dodaj stały link lub ikonę do zmiany wyborów dotyczących prywatności, na każdej stronie.
  • Przejdź przez baner klawiszem Tab, bez myszy, i upewnij się, że fokus pozostaje widoczny i nigdy nie znika za banerem.
  • Przetestuj okno modalne z czytnikiem ekranu, w tym Escape i zwrot fokusu.
  • Zastąp własne wyskakujące okna z prośbą o instalację aplikacji małym banerem.

Źródła