Tutorial Cara Penulisan image pada AMP HTML Blogger

Tutorial Cara Penulisan image pada AMP HTML Blogger

amp-img AMP HTML


Untuk image, tidak diperlukan JavaScript khusus, sudah cukup dengan JS AMPHTML secara umum. Ada perbedaan cara penulisan image dari biasanya. Kode untuk image:

  <amp-img src="url-image-disini"
width="1080"
height="610"
layout="responsive"
alt="AMP HTML"></amp-img>

Layout yang support: fill, fixed, fixed-height, flex-item, nodisplay, responsive
Gunakan srcset untuk menentukan gambar sesuai ukuran layar. Kodenya seperti ini

  <amp-img src="https://ampbyexample.com/img/amp.jpg"
srcset="https://ampbyexample.com/img/amp.jpg 1080w, https://ampbyexample.com/img/amp-900.jpg 900w, https://ampbyexample.com/img/amp-800.jpg 800w,
https://ampbyexample.com/img/amp-700.jpg 700w, https://ampbyexample.com/img/amp-600.jpg 600w, https://ampbyexample.com/img/amp-500.jpg 500w, https://ampbyexample.com/img/amp-400.jpg 400w,
https://ampbyexample.com/img/amp-300.jpg 300w, https://ampbyexample.com/img/amp-200.jpg 200w, https://ampbyexample.com/img/amp-100.jpg 100w"
width="1080"
height="610"
layout="responsive"
alt="AMP HTML"></amp-img>

Untuk melihat efeknya, silahkan resize browser.




Demikianlah Artikel Tutorial Cara Penulisan image pada AMP HTML Blogger

Sekian Tutorial Cara Penulisan image pada AMP HTML Blogger, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sekian Tutorial AMP HTML kali ini.

Anda sedang membaca artikel Tutorial Cara Penulisan image pada AMP HTML Blogger dan artikel ini url permalinknya adalah https://kompidesign.blogspot.com/2016/10/tutorial-cara-penulisan-image-pada-amp.html Semoga artikel ini bisa bermanfaat.

Share this:

Related Posts
Disqus Comments
×

Recent Comments: