First Contentful Paint, Largest Contentful Paint (LCP) – jak ovlivnit v mém případě

4. 11. 2021 15:20:54

Dobrý den,

požádal jsem programátora, aby mi pomohl se zrychlením webu konkrétně s Core web vitals. Hlavně na mobilech se mi nenačítají dostatečně rychle stránky. Bohužel on toto běžně nedělá a já nedokážu požadavek lépe konkretizovat.

Logicky asi chci něco, k čemu na WP jsou doplňky, které zajistí, že se nejprve narychlo načte alespoň něco a pak se dotahá zbytek. Ale já mám řešení na míru, prastaré, takže se to musí naprogramovat. Ale jak? Jak se tohle řeší, co vyřeší můj problém?

Dokázali byste mi sem v pár větách napsat, co mám vlastně po programátorovi chtít? Děkuji za pomoc.

4. 11. 2021 15:20:54

https://webtrh.cz/diskuse/first-contentful-paint-largest-contentful-paint-lcp-jak-ovlivnit-v-mem-pripade#reply1493243

Karel Benáček

(37 hodnocení)

4. 11. 2021 16:37:59

Web Vitals je souhrn více metrik:

Largest Contentful Paint (LCP)
First Input Delay (FID)
Cumulative Layout Shift (CLS)

Doporučuji používat spíše rozšířenější Web.dev od Googlu.

Příklad: Ve vašem případě třeba Google doporučuje zapracovat na Eliminate render-blocking resources, při výstupu vám řekne jakých souborů se to týká a stejně tak odkáže na informace, jak tento problém řešit.

4. 11. 2021 16:37:59

https://webtrh.cz/diskuse/first-contentful-paint-largest-contentful-paint-lcp-jak-ovlivnit-v-mem-pripade#reply1493242

Pavel Mareš

(19 hodnocení)

4. 11. 2021 16:43:16

Preconnect, Prefetch, textové bloky (pro mobil = jak je blok větší než obrázek, jedná se o LCP), lazyloading ... https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fwww.pestitelka.cz%2F&tab=mobile (aktuálně nenasazeny cache a optimalizovací pluginy).

4. 11. 2021 16:43:16

https://webtrh.cz/diskuse/first-contentful-paint-largest-contentful-paint-lcp-jak-ovlivnit-v-mem-pripade#reply1493241

beraniste

(29 hodnocení)

4. 11. 2021 20:18:10

Napsal Doctore97;1634238
Preconnect, Prefetch, textové bloky (pro mobil = jak je blok větší než obrázek, jedná se o LCP), lazyloading ... https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fwww.pestitelka.cz%2F&tab=mobile (aktuálně nenasazeny cache a optimalizovací pluginy).

Dobrý den, těmi úpravami myslíte přesně co? Protože když se tím nezabývám, tak nevím :-) výsledky máte pěkné

4. 11. 2021 20:18:10

https://webtrh.cz/diskuse/first-contentful-paint-largest-contentful-paint-lcp-jak-ovlivnit-v-mem-pripade#reply1493240

Pavel Mareš

(19 hodnocení)

4. 11. 2021 21:52:31

Preconnect a prefetch - html přednačtení zdrojů

Textové bloky - Google vezme největší viditelné blok při prvním view a ten označí jako LCP = pokud je to text, je to extrémně rychlé (kor u systémových fontů) ... aneb proč na mobilu na homepage nemám obrázek https://www.pestitelka.cz/

Obrázky = lazyloading (html atribut)

Dost jsem studoval PSI a Googlí techniky ... a tohle jsou základní ukázky jak docílit lepšího hodnocení od Googlu

Plus cache, plus optimalizace kodu (minifikace, vyházení zbytečností apod)

4. 11. 2021 21:52:31

https://webtrh.cz/diskuse/first-contentful-paint-largest-contentful-paint-lcp-jak-ovlivnit-v-mem-pripade#reply1493239

beraniste

(29 hodnocení)

9. 11. 2021 07:57:32

Zdravím, programátor nasadil lazyload, ale nejsem si jistý, zda OK. Nezlepšilo se to. Zdá se mi, že to nahodí sice text, ale zase není vidět hned ten první hlavní obrázek na stránce. A tadyto https://www.jakpsatweb.cz/clanky/lazy-loading.html ... píší tam, že to může uškodit viditelnosti obrázků pro vyhledávače. Mě se ale obrázky hezky ve vyhledávačích umísťují, tak nevím, zda tím něco nezmršíme. Dokážete zjistit, zda je to nasazeno správně? Já nevím.

9. 11. 2021 07:57:32

https://webtrh.cz/diskuse/first-contentful-paint-largest-contentful-paint-lcp-jak-ovlivnit-v-mem-pripade#reply1493238

beraniste

(29 hodnocení)

9. 11. 2021 18:20:32

A teď se udělaly nějaké úpravy, dal se tam lazyload a nevím, proč to neukazuje tyto dvě hodnoty :-( Nevím, zda jsme tam něco nepomrvili :-(

34805

9. 11. 2021 18:20:32

https://webtrh.cz/diskuse/first-contentful-paint-largest-contentful-paint-lcp-jak-ovlivnit-v-mem-pripade#reply1493237

beraniste

(29 hodnocení)

10. 11. 2021 09:16:31

A ještě jsem si všiml tohoto na produktových stránkách, to mi taky přijde divné. Proč ten začátek je tak dlouhý. Nějaká nápad?

caskrmeni.cz : Chro...urt, Germany - EC2 - WebPageTest Result

10. 11. 2021 09:16:31

https://webtrh.cz/diskuse/first-contentful-paint-largest-contentful-paint-lcp-jak-ovlivnit-v-mem-pripade#reply1493236

beraniste

(29 hodnocení)

10. 11. 2021 09:18:52

A ještě jsem si všiml tohoto, přijde mi to divné, že to počáteční načítání tak dlouho trvá. A fakt nevím kde je problém. Poradíte?

caskrmeni.cz : Chro...urt, Germany - EC2 - WebPageTest Result

34809

10. 11. 2021 09:18:52

https://webtrh.cz/diskuse/first-contentful-paint-largest-contentful-paint-lcp-jak-ovlivnit-v-mem-pripade#reply1493235

lada1979

10. 11. 2021 09:40:56

Asi máš místně pomalé připojení, mě ty tvoje stránky ukázaly, že vše je super:

First View (Run 3) 0.374s 0.900s 0.955s 1.330s 1.557s 0.012 ≥ 0.000s 3.177s 73 1,212 KB 3.569s 77 1,263 KB $$$--

viz. https://www.webpagetest.org/result/211110_BiDcZ0_91614522e4478a69cf4a82de4a3dd84e/

10. 11. 2021 09:40:56

https://webtrh.cz/diskuse/first-contentful-paint-largest-contentful-paint-lcp-jak-ovlivnit-v-mem-pripade#reply1493234

beraniste

(29 hodnocení)

10. 11. 2021 09:44:19

Já testoval mobily - pomalejší připojení a konkrétně nějakou produktovou stránku

10. 11. 2021 09:44:19

https://webtrh.cz/diskuse/first-contentful-paint-largest-contentful-paint-lcp-jak-ovlivnit-v-mem-pripade#reply1493233

lada1979

10. 11. 2021 09:53:59

Produktové stránky jsou obdobné. Myslím, že při mé rychlosti pevného internetu, který se aktuálně vleče 4,8 Mb to na mobilu horší nebude, ten mi tu aktuálně padá i do 3G:)

10. 11. 2021 09:53:59

https://webtrh.cz/diskuse/first-contentful-paint-largest-contentful-paint-lcp-jak-ovlivnit-v-mem-pripade#reply1493232

Pro odpověď se přihlašte.

Přihlásit