Gambar Responsif
Implementasi gambar yang menyajikan berbagai ukuran atau format berdasarkan perangkat pemirsa, ukuran layar, dan kecepatan koneksi.
Gambar responsif mencegah pengguna seluler mengunduh gambar berukuran desktop yang menghabiskan bandwidth dan memperlambat pemuatan halaman. HTML menyediakan atribut srcset untuk peralihan resolusi dan elemen gambar untuk arahan seni — menyajikan potongan atau format berbeda ke perangkat berbeda. Kerangka kerja modern seperti Next.js mengotomatiskan pembuatan gambar responsif, membuat berbagai ukuran dari satu sumber dan menyajikan versi optimal berdasarkan area pandang. WebP dan AVIF fAVIFts dengan JPEG fallbacJPEGrlebih mengurangi bandwidth. Gambar responsif sangat penting untuk kinerja Core Web Vitals — gambar yang terlalu besar memperlambat Largest Contentful Paint, metrik kinerja pemuatan utama yang memengaruhi pengalaman pengguna dan peringkat mesin pencari.