Menggunakan gambar poster pada konten plugin

Beberapa minggu yang lalu, Chrome mengumumkan setelan konten baru yang otomatis menjeda konten plugin yang terdeteksi sebagai periferal konten utama situs akan ditayangkan untuk semua pengguna Chrome 45 dan seterusnya (Stabil September 2015). Ini adalah keuntungan bagi 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 mematuhi parameter poster dengan cara yang sama seperti elemen video. Hal ini memungkinkan Anda menentukan gambar yang harus digunakan sebagai pengganti plugin yang dijeda, bukan bingkai mana pun yang digunakan Chrome untuk menjeda konten plugin Anda.

Berikut ini contoh penggunaannya dalam praktik. Jika Chrome memutuskan untuk menjeda flash.swf, poster.png akan ditampilkan sebagai gantinya. Jika pengguna mengklik poster, bukan konten Flash yang akan diputar 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 pada tag img, sehingga dapat mendukung tampilan 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