Gambar responsif
Implementasi gambar yang menyajikan ukuran atau format berbeda berdasarkan perangkat, ukuran layar, dan kecepatan koneksi pengunjung.
Gambar responsif mencegah pengguna seluler mengunduh gambar berukuran desktop yang membuang bandwidth dan memperlambat pemuatan halaman. HTML menyediakan atribut srcset untuk pergantian resolusi dan elemen picture untuk arahan visual, sehingga crop atau format berbeda dapat disajikan ke perangkat berbeda. Framework modern seperti Next.js mengotomatiskan pembuatan gambar responsif, membuat beberapa ukuran dari satu sumber dan menyajikan versi optimal berdasarkan viewport. Format WebP dan AVIF dengan fallback JPEG semakin mengurangi bandwidth. Gambar responsif penting untuk Core Web Vitals: gambar yang terlalu besar memperlambat Largest Contentful Paint, metrik utama performa pemuatan yang memengaruhi pengalaman pengguna dan peringkat mesin pencari.