Sediakan ruang untuk iklan

Mencadangkan ruang yang cukup untuk iklan adalah kunci untuk meminimalkan pergeseran tata letak. Contoh ini menunjukkan berbagai pendekatan untuk memesan ruang dan efeknya terhadap stabilitas tata letak.

  • Tidak ada ruang yang dicadangkan: Tidak ada dimensi yang ditentukan untuk penampung slot iklan. Penampung mulai diciutkan dan diluaskan saat iklan terisi, yang menyebabkan pergeseran tata letak yang terlihat oleh pengguna.
  • Ruang yang direservasi: Dimensi ditentukan untuk penampung slot iklan. Penampung selalu menempati jumlah ruang yang konstan di halaman, sehingga tata letak tidak berubah. Ruang kosong terlihat sebelum iklan dimuat.
  • Ruang yang direservasi dengan placeholder: Dimensi ditentukan untuk penampung slot iklan. Penampung menempati jumlah ruang yang konstan di halaman, sehingga tata letak tidak bergeser. CSS digunakan untuk menata gaya penampung kosong agar tidak terlihat ruang kosong sebelum iklan dimuat.

Contoh implementasi

Lihat demo