Memuat iklan secara efektif tanpa memengaruhi kecepatan halaman

Dalam dunia digital saat ini, iklan online merupakan bagian penting dari web gratis yang kita semua nikmati. Namun, iklan yang tidak diterapkan dengan baik dapat menyebabkan pengalaman penjelajahan yang lebih lambat, membuat pengguna frustrasi, dan berkurangnya interaksi. Pelajari cara memuat iklan secara efektif tanpa memengaruhi kecepatan halaman Anda, memastikan pengalaman pengguna yang lancar, dan memaksimalkan peluang pendapatan bagi pemilik situs.

Markus Bordihn
Markus Bordihn

Situs web sangat mengandalkan iklan online sebagai sumber pendapatan utama. Namun, keberadaan iklan di situs terkadang dapat mengorbankan pengalaman pengguna dan performa halaman secara keseluruhan. Oleh karena itu, penting untuk menyeimbangkan antara monetisasi dan performa bagi pemilik situs dan pengiklan, serta pengalaman pengguna.

Pertimbangkan situs yang secara ekstensif menempatkan iklan di dalam kontennya, yang bertujuan untuk menghasilkan pendapatan yang tinggi. Namun, banyaknya iklan membuat pengguna frustrasi, yang menyebabkan pengalaman pengguna yang buruk dan rasio pantulan yang tinggi. Meskipun ada potensi pendapatan yang besar dari iklan, pengabaian sangat menghambat keberhasilan situs web.

Di sisi lain, pertimbangkan situs tanpa iklan. Lingkungan bebas iklan ini menarik banyak pengguna karena waktu pemuatannya yang cepat dan pengalaman penjelajahan yang lancar. Namun, tanpa strategi monetisasi, situs tersebut kesulitan menghasilkan pendapatan, yang dapat menghambat keberlanjutan dan pertumbuhan jangka panjangnya.

Kedua skenario ini menggambarkan pentingnya menyeimbangkan monetisasi, pengguna, dan performa.

Memanfaatkan Core Web Vitals

Meneruskan Core Web Vitals sangat penting dalam hal pemuatan iklan tanpa memengaruhi kecepatan halaman secara negatif. Core Web Vitals, yang terdiri dari metrik seperti Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), dan Interaction to Next Paint (INP), adalah metrik pengalaman pengguna yang mengukur kualitas pengalaman pengguna di situs Anda.

Largest Contentful Paint (LCP)

Berfokus pada pengoptimalan LCP sangatlah penting, karena metrik ini mengukur waktu yang diperlukan hingga elemen konten terbesar agar terlihat di area pandang. Dengan meminimalkan waktu pemuatan konten iklan dan dengan memprioritaskan teknik pemuatan asinkron, pemilik situs dapat mengurangi LCP dan mengurangi waktu rendering elemen konten yang paling menarik di halaman.

Interaksi dengan Next Paint (INP)

Kedua, meningkatkan INP sangat penting untuk pengalaman pengguna yang responsif. INP mengukur latensi untuk setiap klik, ketukan, dan interaksi keyboard yang terjadi sepanjang masa aktif halaman. Nilai yang dihasilkan paling sering adalah interaksi yang memerlukan waktu paling lama untuk diselesaikan, dan mewakili kemampuan keseluruhan halaman dalam merespons interaksi pengguna dengan cepat.

Iklan yang menunda interaksi pengguna akan berdampak negatif pada INP. Hal ini dapat membuat pengguna frustrasi dengan menciptakan pengalaman yang lambat, atau bahkan rusak sama sekali dalam kasus yang ekstrem. Menerapkan pemuatan lambat untuk iklan dan menunda eksekusi JavaScript yang tidak penting dapat membantu mengurangi INP halaman, sehingga meningkatkan responsivitas halaman secara keseluruhan.

Pergeseran Tata Letak Kumulatif (CLS)

Terakhir, CLS mengukur stabilitas visual halaman dengan mengukur jumlah pergeseran tata letak tidak terduga yang terjadi selama pemuatan halaman. Iklan yang dimuat atau diubah ukurannya secara dinamis dapat mengakibatkan ketidakstabilan tata letak, yang menyebabkan pengalaman pengguna yang buruk, yaitu pengguna tidak dapat melacak posisi mereka di halaman, atau bahkan secara tidak sengaja mengetuk elemen yang salah karena pergeseran tata letak yang tidak terduga. Untuk mengurangi hal ini, pemilik situs harus mengoptimalkan CLS untuk memastikan iklan memiliki ruang yang dicadangkan untuk mencegah pergeseran tata letak, dan ukuran iklan harus dioptimalkan untuk menghindari perubahan tata letak konten yang tiba-tiba.

Menyusun halaman web menjadi blok konten yang berbeda

Menyusun halaman web Anda dengan blok konten untuk teks, gambar, dan konten iklan, sekaligus menggunakan properti content-visibility: CSS, dapat meningkatkan keseluruhan waktu rendering secara signifikan di browser modern.

Dengan menerapkan properti content-visibility: secara strategis dalam blok konten ini, Anda mengoptimalkan proses rendering untuk teks, gambar, dan konten iklan. Hal ini memastikan bahwa hanya konten di area pandang yang dirender sepenuhnya, sehingga pemuatan halaman awal yang lebih cepat dan interaksi pengguna yang lebih lancar. Peningkatan performa ini sangat bermanfaat saat menangani halaman yang panjang atau berisi banyak iklan.

Memprioritaskan slot iklan yang penting

Tidak semua slot iklan sama. Misalnya, slot iklan paruh atas biasanya lebih bernilai daripada slot iklan paruh bawah dalam hal visibilitas dan monetisasi. Hal ini karena iklan paruh atas lebih mungkin dilihat oleh pengguna karena iklan tersebut terlihat tanpa men-scroll di area pandang pertama. Iklan paruh bawah terlihat setelah pengguna men-scroll halaman cukup jauh ke bawah untuk melihatnya.

Iklan paruh atas

Representasi visual 'paruh atas' konsep iklan.

Slot iklan paruh atas mengacu pada bagian halaman web yang terlihat tanpa perlu men-scroll dan memiliki nilai yang signifikan dalam iklan digital. Penempatan utama ini dianggap bernilai karena beberapa alasan:

  • Iklan yang ditempatkan di paruh atas akan langsung terlihat oleh pengguna setelah halaman web dimuat. Pengguna lebih cenderung melihat dan berinteraksi dengan iklan ini, sehingga menghasilkan rasio klik-tayang yang lebih tinggi.
  • Pengiklan sering kali menganggap bagian atas halaman web sebagai properti yang paling berharga. Ini adalah kesan pertama yang didapatkan pengguna ketika mereka mengunjungi situs, menjadikannya area penting untuk menampilkan iklan premium dan berdampak tinggi.
  • Iklan di paruh atas memiliki rasio visibilitas tertinggi karena berada dalam garis pandang langsung pengguna. Hal ini memastikan bahwa sebagian besar pengguna yang mengunjungi halaman akan melihat iklan ini tanpa harus men-scroll.

Namun, penting untuk menyeimbangkan antara monetisasi dan pengalaman pengguna saat menggunakan slot iklan paruh atas di tampilan awal. Berikut adalah beberapa pertimbangan utama.

  • Slot iklan layar pertama harus dimuat secepat mungkin di area tampilan awal pengguna. Iklan yang dimuat lambat dapat berdampak negatif pada pengalaman pengguna dan meningkatkan rasio pantulan. Mengoptimalkan waktu pemuatan iklan sangat penting untuk menjaga kelancaran pengalaman pengguna dan penjelajahan.
  • Meskipun penempatan iklan paruh atas sangat berharga, sebaiknya jangan penuhi ruang kosong ini dengan terlalu banyak iklan. Iklan yang berlebihan mengacaukan halaman, mengganggu keterbacaan konten, dan mengurangi pengalaman pengguna. Upayakan keseimbangan antara monetisasi dan pemeliharaan tata letak yang bersih dan ramah pengguna.
  • Pastikan slot iklan paruh atas kompatibel dengan berbagai ukuran layar dan perangkat. Praktik desain responsif dapat membantu mempertahankan tata letak yang konsisten dan menarik secara visual, terlepas dari ukuran layar pengguna.

Iklan paruh bawah

Representasi visual 'paruh bawah' konsep iklan.

Slot iklan paruh bawah—yaitu, iklan yang ditempatkan di bagian halaman web yang hanya terlihat setelah di-scroll ke bawah—juga memiliki manfaat yang cukup besar dalam dunia iklan digital. Penempatan ini menawarkan keuntungan unik yang melengkapi penempatan paruh atas.

Iklan yang terletak di paruh bawah akan mendapatkan keuntungan dari pengguna yang men-scroll untuk menjelajahi lebih banyak konten. Penempatan ini menarik perhatian pengguna aktif yang secara aktif mencari informasi tambahan, sehingga menjadikannya berharga bagi brand yang ingin menyampaikan pesan atau penceritaan yang lebih kompleks.

  • Slot iklan yang pada awalnya tidak terlihat dapat selaras dengan konten di sampingnya, sehingga memberikan peluang untuk relevansi kontekstual. Penyelarasan ini dapat menghasilkan engagement pengguna yang lebih tinggi saat pengguna menemukan iklan yang terkait dengan konten yang mereka jelajahi.
  • Jika didesain dengan cermat, iklan paruh bawah dapat terintegrasi secara lancar dengan konten di sekitarnya, sehingga tidak terlalu mengganggu pengguna. Integrasi ini—juga disebut sebagai iklan native—dapat menghasilkan pengalaman pengguna yang lebih harmonis.
  • Penempatan iklan yang memerlukan scroll menawarkan fleksibilitas desain dan format yang lebih besar, dengan ruang yang cukup dan kebebasan untuk bereksperimen. Iklan video, elemen interaktif, dan gambar yang lebih besar dapat dimuat dengan lambat untuk menarik perhatian pengguna tanpa mengganggu pengalaman mereka.

Namun, pertimbangan berikut harus diberikan untuk penempatan iklan paruh bawah:

  • Meskipun penempatan iklan paruh bawah dapat efektif, Anda harus memastikan pengguna terdorong untuk men-scroll untuk melihatnya. Menerapkan isyarat visual atau teaser konten dapat memikat pengguna untuk menjelajah lebih jauh, meningkatkan kemungkinan visibilitas iklan.
  • Penempatan iklan di paruh bawah tidak boleh mengurangi kualitas konten atau keterbacaan. Menjaga keseimbangan antara iklan dan konten untuk menghindari pengguna yang berlebihan dan untuk memastikan pengalaman pengguna yang positif.
  • Tidak seperti penempatan iklan paruh atas, iklan paruh bawah mungkin tidak perlu langsung dimuat. Menunda pemuatan iklan ini hingga hampir memasuki area tampilan pengguna dapat membantu meningkatkan kecepatan pemuatan halaman secara keseluruhan dan mengurangi waktu rendering halaman awal.

Jika digunakan secara strategis, iklan paruh bawah dapat melengkapi iklan paruh atas, dan memberikan platform untuk format iklan materi iklan dan relevansi kontekstual. Namun, mengoptimalkan visibilitas, menyeimbangkan konten, dan mengelola waktu pemuatan iklan adalah pertimbangan utama untuk memastikan pengalaman pengguna yang positif.

Praktik terbaik Tag Google Publisher (GPT) saat ini:

Iklan pemuatan lambat jika sesuai

Visualisasi pemuatan lambat versus resource yang bukan pemuatan lambat. Jika resource dimuat dengan lambat, bandwidth akan dihemat selama pemuatan halaman, dan resource akan dialihkan ke titik di mana pengguna paling mungkin melihatnya.

Pemuatan lambat adalah teknik yang menunda pemuatan resource yang tidak penting hingga diperlukan. Menerapkan pemuatan lambat untuk iklan yang tidak langsung terlihat (yaitu, iklan paruh bawah) memastikan bahwa iklan hanya dimuat saat iklan muncul, menghemat bandwidth, dan meningkatkan kecepatan halaman secara keseluruhan. Browser kini menyertakan pemuatan lambat native untuk iframe dengan atribut loading=lazy.

Dengan menerapkan pemuatan lambat, iklan diambil secara dinamis saat akan memasuki area tampilan pengguna, sehingga mengurangi waktu pemuatan awal dan Total Waktu Pemblokiran (TBT) (yang sangat berkorelasi dengan INP) di thread utama pada bagian penting siklus proses halaman tersebut, sehingga meminimalkan dampak negatif terhadap pengalaman pengguna.

Perbarui iklan tanpa memuat ulang halaman

Visualisasi iklan yang dimuat ulang di halaman, tanpa pemuatan ulang halaman tingkat atas.

Teknik tambahan yang dapat menyeimbangkan performa halaman dengan iklan pemuatan adalah kemampuan untuk memperbarui iklan setiap 30 hingga 240 detik1 tanpa memuat ulang seluruh halaman. Pendekatan ini memungkinkan pembaruan konten iklan secara dinamis tanpa mengganggu pengalaman penjelajahan pengguna atau menyebabkan penundaan yang tidak perlu.

Di aplikasi seluler, memuat ulang iklan di tampilan web yang ada memberikan performa yang lebih baik dibandingkan dengan memuat ulang seluruh halaman atau membuat ulang WebView karena meminimalkan beban data dan resource, sehingga menghasilkan update konten yang lebih cepat dan pengalaman pengguna yang lebih lancar tanpa latensi yang terkait dengan memulai dari awal.

Dengan memperbarui iklan secara asinkron, pemilik situs dapat menjaga konten halaman tetap utuh sambil memperbarui konten iklan secara real time dan langsung di tempat. Hal ini tidak hanya meningkatkan kecepatan halaman dengan meniadakan kebutuhan untuk memuat ulang seluruh halaman, tetapi juga memastikan iklan yang ditampilkan tetap relevan dan menarik. Dengan teknik ini, pemilik situs dapat mencapai keseimbangan antara monetisasi dan performa, sehingga menayangkan konten iklan yang menarik dan tepat waktu sembari meminimalkan efek negatif pada pengalaman pengguna.

Memperbarui slot iklan sangat bermanfaat pada halaman yang penggunanya cenderung bertahan lebih lama, seperti halaman resep, tutorial DIY, atau situs kaya konten lainnya. Misalnya, pada halaman kerajinan DIY tempat pengguna mungkin menghabiskan banyak waktu dengan mengikuti tutorial, memperbarui slot iklan secara strategis saat jeda antar-langkah, atau saat melihat galeri gambar, dapat meningkatkan pengalaman pengguna dan pendapatan iklan. Demikian pula pada halaman resep, memuat ulang slot iklan setelah pengguna men-scroll daftar bahan atau petunjuk dapat mempertahankan minat pengguna.

Memprioritaskan pemuatan asinkron

Salah satu strategi yang paling berdampak untuk meningkatkan kecepatan halaman saat menayangkan iklan adalah pemuatan asinkron. Pemuatan asinkron memuat iklan secara terpisah dari konten halaman utama memungkinkan halaman terus dirender dan menjadi interaktif tanpa menunggu iklan dimuat sepenuhnya. Hal ini secara signifikan mengurangi waktu pemuatan yang dirasakan, sehingga meningkatkan kepuasan pengguna.

Sertakan atribut async dalam definisi tag skrip. Contoh:

AdSense:

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

AdSense (iklan Otomatis):

<script async data-ad-client="ca-pub-xxxxxxxxxxxxxxxx" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

Tag Google Publisher:

<script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></script>

Mengoptimalkan ukuran, posisi, dan format iklan

Ilustrasi perangkat dengan berbagai ukuran area pandang, dengan penempatan iklan bergaya kotak hijau, masing-masing bertuliskan &#39;Iklan&#39;.

Ukuran, posisi, dan format untuk iklan dapat sangat memengaruhi kecepatan halaman. Ukuran iklan yang besar dapat memperlambat pemuatan halaman, sehingga membuat pengguna frustrasi. Untuk mengurangi hal ini, pemilik situs harus bekerja sama dengan pengiklan untuk mengoptimalkan ukuran dan format iklan. Mendorong penggunaan format gambar terkompresi dan desain materi iklan yang efisien membantu mengurangi ukuran file tanpa mengorbankan kualitas visual. Pengoptimalan ini tidak hanya meningkatkan kecepatan halaman, tetapi juga meminimalkan konsumsi data untuk pengguna dengan bandwidth terbatas.

Better Ads Standards

Penting untuk mematuhi Better Ads Standard untuk menampilkan iklan, karena hal ini tidak hanya meningkatkan pengalaman pengguna dengan mengurangi format iklan yang mengganggu dan mengganggu, tetapi juga berdampak positif terhadap posisi penayangan iklan dan waktu muat halaman.

Dengan mengikuti standar ini, iklan lebih mungkin ditempatkan di posisi yang tidak terlalu mengganggu dan mengganggu, sehingga dapat menghasilkan engagement pengguna dan rasio klik-tayang yang lebih tinggi.

Selain itu, kepatuhan terhadap panduan ini juga dapat menghasilkan kecepatan pemuatan halaman yang lebih cepat karena format iklan yang lebih ringan dan tidak terlalu banyak menggunakan sumber daya akan disukai, sehingga meningkatkan performa situs secara keseluruhan dan kepuasan pengguna.

Evaluasi strategis terhadap jaringan dan penyedia iklan

Tidak semua penyedia dan jaringan iklan memiliki performa yang sama. Untuk memastikan kecepatan halaman yang optimal, pemilik situs harus mengevaluasi performa berbagai jaringan iklan, penerapan bidding header, dan penyedia dengan cermat.

Menjalin kemitraan dengan penyedia yang mengutamakan kecepatan—dan memiliki rekam jejak dalam menayangkan konten iklan ringan secara efisien—dapat meningkatkan performa halaman dan meningkatkan pengalaman pengguna secara signifikan.

Kesimpulan

Mencapai keseimbangan antara monetisasi dan performa sangat penting bagi pemilik situs yang ingin memberikan pengalaman pengguna yang luar biasa sekaligus memaksimalkan pendapatan melalui iklan online.

Dengan menggunakan teknik seperti pemuatan asinkron, pemuatan lambat, mengoptimalkan format dan ukuran iklan, memanfaatkan cache cerdas dan mengevaluasi jaringan iklan dengan cermat, serta bidding header dan penyedia, pemilik situs dapat berhasil mengatasi tantangan pemuatan iklan tanpa mengorbankan performa halaman. Memprioritaskan penayangan iklan yang efisien pada akhirnya memastikan stratifikasi pengguna, peningkatan interaksi, dan perolehan pendapatan yang berkelanjutan.

Catatan kaki

  1. Server Iklan mungkin memiliki batasan dan persyaratan yang berlaku. Misalnya, Ad Manager mewajibkan penayang mendeklarasikan inventarisnya yang dimuat ulang di UI. Beberapa pembeli mewajibkan pernyataan pembaruan yang berdurasi lebih dari atau sama dengan 240 detik. Secara umum, semakin lama interval antarpembaruan, semakin diinginkan inventaris Anda bagi pembeli. baca selengkapnya