Menggunakan gambar poster pada konten plugin

Beberapa minggu yang lalu, Chrome mengumumkan setelan konten baru yang otomatis menjeda konten plugin yang terdeteksi sebagai konten tambahan dari konten utama situs akan diaktifkan untuk semua pengguna Chrome 45 dan yang lebih baru (Stabil September 2015). Hal ini menguntungkan pengguna Anda dalam hal penggunaan CPU dan konsumsi daya, tetapi dapat menyebabkan mereka tidak melihat konten lengkap yang disediakan situs Anda.

Untungnya, setelan ini juga mengikuti parameter poster dengan cara yang mirip dengan elemen video. Hal ini memungkinkan Anda menentukan gambar yang harus digunakan sebagai pengganti plugin yang dijeda, bukan bingkai yang digunakan Chrome untuk menjeda konten plugin Anda.

Berikut adalah contoh penggunaannya dalam praktik. Jika Chrome memutuskan untuk menjeda flash.swf, poster.png akan ditampilkan sebagai gantinya. Jika pengguna mengklik poster, konten Flash akan bermain seperti biasa.

<object data="http://example.com/flash.swf"  
        type="application/x-shockwave-flash"
        poster="poster.png">
</object>

Nilai parameter poster ditafsirkan dengan cara yang sama seperti atribut srcset dari tag img, sehingga juga dapat mendukung layar dengan DPI tinggi. Berikut adalah contoh sintaksis srcset:

<object data="http://example.com/flash.swf"  
        type="application/x-shockwave-flash"
        poster="snapshot1x.png 1x, snapshot2x.png 2x">
</object>

Pastikan gambar yang digunakan memiliki dimensi yang sama dengan konten plugin. Jika tidak, gambar dapat terdistorsi di layar pengguna