Na jakie pytania odpowiada to hasło
- Czy lazy loading obrazków szkodzi SEO?
- Jak przyspieszyć LCP obrazka głównego?
Lazy loading, preload i fetchpriority: wyjaśnienie
Zasada jest prosta: opóźniaj to, czego użytkownik nie widzi; przyspiesz to, co widzi pierwszy. Lazy loading (loading="lazy") stosuj na obrazkach poniżej pierwszego ekranu – zmniejsza initial payload. Nigdy na obrazku LCP (główne zdjęcie hero, główny produkt): dodanie lazy do obrazka LCP to najczęstszy błąd, jaki widzimy w audytach CWV – przeglądarka czeka, aż ustali layout, dopiero wtedy ładuje obrazek, a LCP rośnie o setki milisekund.
Obrazek LCP: bez lazy, z fetchpriority="high" i z preload (link rel="preload" as="image"), idealnie w rozdzielczości dopasowanej do viewportu przez srcset.
Drugie nogi problemu: fonty (font-display: swap + preload kluczowych wag) i skrypty (moduły krytyczne bez defer, reszta defer/async).
Kontrola efektu: PageSpeed Insights i dane polowe CrUX w GSC – poprawa LCP w labach bez poprawy w polu oznacza, że optymalizujesz zły zasób.