Yayıncı rehberi, bölüm 3
Açılır pencereler ve onay
Son gözden geçirme: Kasım 2026
Bir makalenin üzerinde beliren her kutu, okur ile onu getiren sebep arasında durur. Bazıları yasayla zorunludur. Çoğu değildir. Bu bölüm Google'ın neler istediğini, Avrupalı düzenleyicilerin onay konusunda neler söylediğini ve klavye ile ekran okuyucuyla çalışan bir istemin nasıl kurulacağını ele alır. Hukuki tavsiye değildir; bu yüzden bandınızı kendi hukuk danışmanınızla kontrol edin.
Google'ın istedikleri
Google, müdahaleci ara sayfaları okurun içeriği görmesini engelleyen sayfa ögeleri olarak tanımlar ve bunların kötü arama performansına yol açabileceği konusunda uyarır. Rehberi nettir:
- Sayfanın tamamını kaplamayın.
- Okuru onay veya girdi için ayrı bir sayfaya göndermeyin. Her URL tek bir onay sayfasına yönleniyorsa, o sayfa dışındakilerin hepsi arama sonuçlarından düşebilir.
- Tam sayfa ara sayfalar yerine ekranın küçük bir kısmını kaplayan bantlar kullanın.
- Bülten istemleri ve uygulama yükleme istemleri dahil her türlü tanıtım iletişim kutusuna aynı özeni gösterin.
Uygulama yüklemeleri için Google, Safari'deki Smart App Banner'lar gibi tarayıcının desteklediği seçeneklere veya doğru mağazaya bağlanan düz bir HTML bandına işaret eder.
Yasayla zorunlu olan ara sayfalar bu rehberin dışındadır. Yaş doğrulaması Google'ın örneğidir. Birine ihtiyacınız varsa, dizine eklenebilmesi için içeriği katmanın altında sayfada tutun.
Better Ads Standards reklamcılığı kapsar. Açılır pencere reklamlar hem masaüstünde hem mobilde listelenir. Mobilde geri sayımlı veya geri sayımsız prestitial reklamlar listelenir. Masaüstünde listelenen biçim geri sayımlı prestitial'dır ve hemen kapatılabilen standardın altına düşmez.
Avrupalı düzenleyicilerin onay hakkında söyledikleri
Avrupa Veri Koruma Kurulu (EDPB), onay üzerine rehberler ve çerez bandı görev gücünün bir raporunu yayımladı. Görev gücü raporu, şikâyetlerin ele alınması için üzerinde anlaşılan asgari bir eşiği kaydeder ve ulusal kurallar yine geçerlidir; bu yüzden bu noktaları bir başlangıç çizgisi olarak görün.
- Onay gerektiren hiçbir şey önce çalışmaz. Onay gerektiren çerezler, okur olumlu bir eylemle kabul edene kadar ayarlanamaz.
- Kaydırmak onay değildir. Rehber, kaydırmanın veya parmakla çekmenin hiçbir koşulda açık ve olumlu bir eylem sayılmayacağını söyler.
- Önceden işaretlenmiş kutular onay değildir. Aynısı sessizlik veya hizmete sadece devam etmek için de geçerlidir.
- Reddetmenin bir yolunu sunun. Görev gücündeki yetkililerin büyük çoğunluğu, bir onay düğmesi bulunan hiçbir katmanında reddetme seçeneği olmayan bandı bir ihlal olarak gördü.
- Reddi gizlemeyin. Dikkat çeken hiçbir şey olmadan bir paragrafa gömülmüş bir reddetme bağlantısı geçerli onaya yol açmaz. Düğme renkleri ve kontrast duruma göre değerlendirilir.
- Erişim kabul etmeye bağlı olamaz. Rehber, okur “Çerezleri kabul et” düğmesine tıklayana kadar tüm içeriği engelleyen bir sayfayı, özgürce verilmemiş onay örneği olarak verir.
- Geri çekmek, kabul etmek kadar kolay olmalıdır. Onay bir tıklamayla verildiyse, geri çekmek de öyle olmalıdır. Görünür, standart bir yerde kalıcı bir bağlantı bir seçenektir ve görev gücü küçük bir simgeden de söz eder.
Herkesin kullanabileceği bir istem kurun
Sayfayı engellemeyen bir bant
Küçük bir bant okurun devam etmesine izin verir ve Google'ın tercih ettiği budur. Yine de WCAG 2.2'yi karşılamalıdır. Başarı ölçütü 2.4.11, Focus Not Obscured (Minimum), sabit bir bant klavye odağı olan ögeyi tamamen gizliyorsa başarısız olur. Bandın yüksekliğine eşit bir kaydırma dolgusu ekleyin:
html {
scroll-padding-bottom: 96px; /* the banner's height */
}
Bandı üste bindirin veya yerini ayırın; böylece makaleyi aşağı itmez ve düzen kaymasına neden olmaz.
Bir kalıcı iletişim kutusu
İstem okuru durdurmak zorundaysa, onu W3C desenini kullanan gerçek bir kalıcı iletişim kutusu olarak kurun.
<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>
- İletişim kutusu açıldığında odağı içine taşıyın.
- Tab ve Shift + Tab, iletişim kutusunun içindeki kontroller arasında döner ve her uçta başa sarar.
- Escape iletişim kutusunu kapatır. Bunu hiçbir seçim yapılmamış sayın, asla kabul olarak değil.
- Kapandığında odağı onu açan öğeye geri verin. İletişim kutusu sayfa yüklenirken açıldıysa, odağı içeriğin başına taşıyın.
Mobilde
- Bandı ekranın altına sabitleyin ve başlığı onun üzerinde görünür tutun.
- Düğmeleri tam genişlikte üst üste dizin; böylece her birine dokunmak kolay olur ve Kabul et ile Reddet aynı boyutta olur.
- Metni kısa tutun ve ayrıntıyı ikinci bir katmana taşıyın.
- Düzeni 320 CSS piksel genişlikte ve metin %200'e büyütülmüşken kontrol edin. Düğmelere yana kaydırmadan ulaşılabilmelidir.
Masaüstünde
- Alt çubuk veya köşe paneli kullanın ve makaleyi açık bırakın.
- Her kontrolü klavyeyle çalışır ve görünür bir odak göstergesi olacak şekilde yapın.
- Metni en az 4,5:1 kontrast oranında tutun; büyük metin için 3:1.
Kontrol listesi
- Ana sayfanızı ve bir makaleyi temiz bir tarayıcı profiliyle, bir telefonda ve bir masaüstünde yükleyin. İçeriğin üzerinde neyin belirdiğini sayın.
- Yasanın gerektirmediği her tam sayfa katmanı kaldırın.
- Ayrı bir onay sayfasına yapılan her yönlendirmeyi kaldırın.
- Onay gerektiren hiçbir etiketin okur kabul etmeden çalışmadığını doğrulayın.
- Kabul seçeneği olan her yere, eşit ağırlıkta bir düğme olarak bir reddetme seçeneği koyun.
- Önceden işaretlenmiş kutuları ve kaydırmayı onay sayan her mantığı kaldırın.
- Gizlilik tercihlerini değiştirmek için her sayfada kalıcı bir bağlantı veya simge ekleyin.
- Bandı fare olmadan Tab ile gezin; odağın görünür kaldığını ve onun arkasında asla kaybolmadığını doğrulayın.
- Bir kalıcı iletişim kutusunu, Escape ve odağın geri verilmesi dahil, bir ekran okuyucuyla test edin.
- Özel uygulama yükleme açılır pencerelerini küçük bir bantla değiştirin.
Kaynaklar
- Interstitials and dialogs, Google Search Central
- The Initial Better Ads Standards, Coalition for Better Ads
- Desktop prestitial ad with countdown, Coalition for Better Ads
- Mobile prestitial ad, Coalition for Better Ads
- Guidelines 05/2020 on consent under Regulation 2016/679, European Data Protection Board
- Report of the work undertaken by the Cookie Banner Taskforce, European Data Protection Board
- Understanding Focus Not Obscured (Minimum), W3C WAI
- Dialog (Modal) Pattern, W3C WAI
- Web Content Accessibility Guidelines (WCAG) 2.2, W3C
- Optimize Cumulative Layout Shift, web.dev