Kimlik · Cookie banner
Çerez bildirimi
İsteğe bağlı çerezler için izin ister. Kabul ve ret eşit büyüklüktedir. Tercih saklanır.
- CSS
- kararlı
- JavaScript
- tercih saklama
- React
- kararlı
- Vue
- kararlı
Örnekler
Bu sitede çerez kullanıyoruz
Zorunlu çerezler siteyi çalıştırır. İsteğe bağlı çerezler kullanımı ölçer ve hizmeti iyileştirir.
Tercihinizi çerez sayfasından değiştirebilirsiniz.
HTML kodunu göster
<div class="trds-cerez" role="region" aria-label="Çerez tercihi" data-trds="cerez" data-hep-goster>
<div class="trds-kap">
<div class="trds-cerez__soru">
<h2 class="trds-cerez__baslik">Bu sitede çerez kullanıyoruz</h2>
<p class="trds-govde">Zorunlu çerezler siteyi çalıştırır. İsteğe bağlı çerezler kullanımı ölçer ve hizmeti iyileştirir.</p>
<div class="trds-button-grubu"><button class="trds-button" type="button" data-cerez="kabul">İsteğe bağlı çerezleri kabul et</button><button class="trds-button" type="button" data-cerez="ret">İsteğe bağlı çerezleri reddet</button><a class="trds-link" href="#">Çerezleri görüntüle</a></div>
</div>
<div class="trds-cerez__onay" hidden>
<p class="trds-govde"><span data-cerez-metin></span> Tercihinizi <a class="trds-link" href="#">çerez sayfasından</a> değiştirebilirsiniz.</p>
<button class="trds-button trds-button--ikincil" type="button" data-cerez-gizle>Mesajı gizle</button>
</div>
</div>
</div>
Ne zaman kullanılır
- Zorunlu olmayan bir çerez varsa her sitede kullanın. 5651 sayılı Kanun ve KVKK gereğidir.
- Yalnız zorunlu çerez varsa kullanmayın. Çerez sayfasına bağlantı yeter.
Erişilebilirlik
- Afiş sayfanın en başındadır ve
role="region"ile adlandırılır. Odağı çalmaz. - Ret, kabul kadar kolaydır. Karanlık kalıp yoktur. Seçimden sonra afiş bir onay cümlesine döner.
Karşılanan WCAG 2.2 ölçütleri 1.3.12.4.33.2.2
Kaynak
Benzer bir bileşen şu ülkelerin tasarım sistemlerinde de var: UK, FR, DK, BR, CH, IT.