Cara Mudah Mengkonversi Gambar Blogger Menjadi WebP Untuk Amp-img Dengan Fallback

Sebenarnya sebelumnya saya tidak kepikiran bahwa gambar Blogger juga bisa dihack menjadi webp seperti pada gambar Google Photos. Namun ternyata trik merubah gambar Google Photos menjadi webp bisa juga diterapkan pada gambar Blogger.

Tentunya hal ini menjadi solusi yang paling mudah untuk menggunakan gambar webp pada postingan-postingan blog AMP sehingga halamannya menjadi lebih ringan (setidaknya pada browser Google Chrome dan Opera).

Cara merubah gambar Blogger menjadi webp ini cukup mudah seperti halnya pada Google Photos. Kita tinggal menambahkan kode -rw pada URL gambar Blogger pada bagian size /s..../ (contoh: /s1600/).

Sebagai contoh, merubah gambar Blogger menjadi webp tampak seperti pada contoh URL image Blogger berikut ini.

Berikut adalah URL aslinya:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIy_N-k21k40vTN3icqPdjWpKRhTAuQuTmU6DUb4oDOltKieiD9f98Bg9OaD3yhyphenhyphenvplRYURnXJmiCNtlCd1tnGHFoYXow8W_OX8_h4scIpkWT8xNvJ8DkmOOmJ2OIxJSO1TveYkueuqxY/s1600/blogger-images.png

Dan berikut adalah image Blogger diubah menjadi webp:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIy_N-k21k40vTN3icqPdjWpKRhTAuQuTmU6DUb4oDOltKieiD9f98Bg9OaD3yhyphenhyphenvplRYURnXJmiCNtlCd1tnGHFoYXow8W_OX8_h4scIpkWT8xNvJ8DkmOOmJ2OIxJSO1TveYkueuqxY/-rw/blogger-images.png

Sehingga ketika digunakan pada amp-image dengan fallback untuk menampilkan gambar webp akan tampak seperti berikut ini.

<amp-img alt="Contoh gambar blogger menjadi webp"

  width="1000"

  height="600"

  src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIy_N-k21k40vTN3icqPdjWpKRhTAuQuTmU6DUb4oDOltKieiD9f98Bg9OaD3yhyphenhyphenvplRYURnXJmiCNtlCd1tnGHFoYXow8W_OX8_h4scIpkWT8xNvJ8DkmOOmJ2OIxJSO1TveYkueuqxY/-rw/blogger-images.png"

  title="Contoh gambar blogger menjadi webp"

  layout="responsive">

  <amp-img alt="Contoh gambar blogger menjadi webp"

    fallback

    width="1000"

    height="600"

    src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIy_N-k21k40vTN3icqPdjWpKRhTAuQuTmU6DUb4oDOltKieiD9f98Bg9OaD3yhyphenhyphenvplRYURnXJmiCNtlCd1tnGHFoYXow8W_OX8_h4scIpkWT8xNvJ8DkmOOmJ2OIxJSO1TveYkueuqxY/s1600/blogger-images.png"

    title="Contoh gambar blogger menjadi webp"

    layout="responsive"></amp-img>

</amp-img>

Dan penampakannya akan seperti gambar di bawah ini.


Jika Anda menggunakan Google Chrome, silahkan klik kanan pada gambar di atas lalu Save image as... maka akan disimpan sebagai gambar dengan format file *.webp

Bagaimana, mudah bukan? Selamat mencoba dan semoga bermanfaat.