Penggunaan perangkat secara garis besar terdiri atas desktop, tablet, dan mobile. Untuk perangkat mobile, saat ini juga memiliki beberapa varian ukuran mulai dari 3", 4.5", atau 5". Adapun pengguna mobile atau smartphone semakin mengalami pelonjakan signifikan sejak munculnya OS Android dan juga iPhone yang saat ini merajai pasar dunia.
Apabila Anda termasuk publisher Adsense atau berniat untuk menjadi publisher, hendaklah mengetahui tentang dari mana lalu lintas teratas untuk blog atau situs web Anda. Sehingga nantinya bisa memaksimalkan dalam hal penempatan iklan dan berdampak pada pendapataan.
Penggunaan template responsive atau mobile friendly, sangatlah disarankan untuk mendapatkan nilai pengalaman terbaik untuk pembaca konten Anda. Apakah blog Anda sudah mobile friendly? silahkan gunakan Mobile-Friendly-Test untuk mengetahui hasilnya.
Berikut adalah cara untuk memodifikasi tampilan iklan responsive, sehingga ukuran iklan berbeda antara saat dibuka di perangkat desktop, tablet, dan mobile. Sebagai perbandingan ukuran, kurang lebih seperti ini:
- Mobile untuk ukuran lebar sampai 500px: ukuran iklan 320x100.
- Tablet untuk ukuran lebar antara 500px dan 799px: ukuran iklan 468x60.
- Desktop untuk ukuran lebar dari 800px dan lebih: ukuran iklan 728x90.
1. Buat iklan responsive, dapatkan kode iklan lalu copy-paste ke software editor, misalnya Notepad, Notepad++, DreamWeaver, halaman Entri Blogger, atau lainnya.
2. Copy-paste juga kode iklan berikut untuk disesuaikan dengan kode iklan responsive pada poin 1:
[<style>
.contoh_iklan_1 { width: 320px; height: 100px; }
@media(min-width: 500px) { .contoh_iklan_1 { width: 468px; height: 60px; } }
@media(min-width: 800px) { .contoh_iklan_1 { width: 728px; height: 90px; } }
</style>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- contoh_iklan_1 -->
<ins class="adsbygoogle contoh_iklan_1"
style="display:inline-block"
data-ad-client="ca-pub-XXXXXXX99XXX1"
data-ad-slot="1XXXXX9"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>]
Keterangan, selanjutnya silahkan ganti:
- contoh_iklan_1 ganti dengan nama unik iklan Anda.
- ca-pub-XXXXXXX99XXX1 ganti dengan Id Penayang.
- 1XXXXX9 ganti dengan Id iklan.
- Anda juga bisa merubah 320px dan 100px, 468px dan 60px, serta 728px dan 90px, untuk mengatur lebar dan tinggi iklan pada masing-masing minimal lebar perangkat.
3. Copy-paste kode yang sudah disesuaikan atau modifikasi ke HTML blog di mana iklan tersebut ingin ditampilkan. Sampai di sini sudah selesai.
Untuk memastikan iklan berjalan baik pada semua perangkat sebaiknya melakukan test pada masing-masing perangkat, mulai dari tampilan seluler, tablet, hingga desktop. Anda juga bisa mengecek tampilan secara online, saat ini banyak situs responsive test bisa Anda coba.
