Imej biasanya bait paling berat pada sesuatu halaman, jadi mengoptimumkannya ialah kemenangan LCP terbesar. Tiga tuas: format moden, saiz responsif, dan keutamaan pemuatan.
AVIF dan WebP memampat jauh lebih kecil daripada JPEG/PNG pada kualiti yang sama (AVIF sering 50% lebih kecil daripada JPEG). Sajikan ia dengan fallback supaya browser lama masih berfungsi:
Jangan hantar imej 2000px ke telefon 400px. srcset membolehkan browser memilih saiz yang betul untuk peranti:
<img
srcset="/p-400.jpg 400w, /p-800.jpg 800w, /p-1600.jpg 1600w"
sizes="(max-width: 600px) 100vw, 800px"
src="/p-800.jpg" width="800" height="600" alt="...">
sizes memberitahu browser sebanyak mana lebar imej dirender supaya ia boleh memilih sumber terkecil yang mencukupi.
fetchpriority="high", loading="eager", dan pertimbangkan preload.loading="lazy" supaya ia tidak diambil sehingga diperlukan.Sentiasa kekalkan width/height untuk mengelak CLS.
LCP yang perlahan paling kerap hanyalah imej hero yang terlalu besar. Mengetahui format (AVIF/WebP), srcset untuk resolusi yang betul, dan keutamaan yang betul — serta tidak lazy-loading imej LCP — ialah kit alat praktikal yang penemu duga jangkakan, dan ia biasanya perubahan tunggal berimpak-tertinggi pada laman sebenar.
Pustaka soalan temu duga IT dengan jawapan terperinci — daripada Junior hingga Senior.
Derma