Archived topic
Page Header Element Bringing Down Core Web Vitals
3 replies · Started by Jose on July 5, 2021
Hi there,
Without a page header element, my blog posts are all in the green for all Core Web Vitals with a score of 98 (I have put a screenshot in the private info field). When I enable a page header element for my blog posts, the score goes down to 70 and The Speed Index, Largest Contentful Paint and Time to Interactive metrics all show up in red ( I have put a screenshot as well in the private info field). I compressed the image in the page header but that doesn't seem to help.
Is there any way to have the page header not affect Core Web Vitals so dramatically? A link to the page in question is also in the private info field. Thanks.
Hi Jose,
This is likely still because of the size of the image. It's 337kb which is still pretty huge. It's still loading slow.
You can try preloading it. Is the background image a featured image? If so, you can try David's code here -
https://generatepress.com/forums/topic/pre-load-hero-header-image/page/2/#post-1838630
It worked! Thanks again Elvin.
Nice one. Glad you got it sorted. No problem. :D