Performance

Core Web Vitals објаснети за сопственици на веб-сајтови

Core Web Vitals на едноставен јазик: LCP, INP и CLS, прагови што ги објавува Google, разлика меѓу лабораториски и теренски податоци и што прво да се поправи.

Автор: Zebra Hosting Cloud

Core Web Vitals се три мерења што Google ги користи за да опише како страницата се чувствува за вистински посетител: колку брзо се појавува главната содржина, колку брзо страницата реагира кога некој ќе допре или кликне и дали распоредот скока додека се вчитува. Тие се дел од сигналите на Google за искуство на страницата, но поважната причина да ви е грижа е поедноставна. Посетителите ги напуштаат бавните, скокотливи страници и ретко ви кажуваат зошто.

Овој водич ги објаснува трите метрики на едноставен јазик, праговите што ги објавува Google и како да одлучите што прво да поправите на нормален сајт на мал бизнис.

Трите метрики накратко

МетрикаШто мериДоброЛошо
LCP (Largest Contentful Paint)Време додека најголемиот видлив елемент не се прикаже2,5 секунди или помалкуНад 4 секунди
INP (Interaction to Next Paint)Колку време му треба на страницата визуелно да реагира по допир, клик или притисок на тастер200 милисекунди или помалкуНад 500 милисекунди
CLS (Cumulative Layout Shift)Колку видлива содржина неочекувано се поместува0,1 или помалкуНад 0,25

Вредностите меѓу „добро“ и „лошо“ спаѓаат во опсегот „потребно подобрување“. Google ја оценува страницата на 75-иот перцентил од вистинските посети, што значи дека три четвртини од вашите посетители треба да добијат искуство на прагот или подобро. Еден брз тест на вашиот лаптоп не докажува дека страницата поминува.

Largest Contentful Paint: дали се појавува страницата?

LCP ја гледа најголемата слика, постер на видео или блок текст на првиот екран и бележи кога завршува со приказот. На повеќето сајтови тоа е главна слика или голем наслов. Бавниот LCP обично доаѓа од една од четири причини: бавен одговор на серверот, тешка или лошо форматирана слика, CSS или JavaScript што го блокираат прикажувањето или прелистувач што ја открива клучната слика предоцна.

Interaction to Next Paint: дали страницата реагира?

INP ја замени постарата метрика First Input Delay во март 2024 година. Додека First Input Delay гледаше само прва интеракција и само доцнењето пред да започне, INP ги разгледува интеракциите низ целата посета и пријавува една од најбавните, од внесот до цртањето на следната рамка. Страниците што се вчитуваат брзо, но се лепливи кога ќе отворите мени или притиснете копче, обично имаат проблем со JavaScript: премногу код што се извршува одеднаш на главната нишка.

Cumulative Layout Shift: дали страницата мирува?

CLS ги собира неочекуваните поместувања на видливите елементи. Сте го почувствувале кога сте тргнале да допрете врска, а над неа се вчитал банер и ја туркнал надолу. Вообичаени причини се слики без атрибути за ширина и висина, реклами и вградувања што се вчитуваат доцна, фонтови што се заменуваат и ја менуваат големината на текстот и банери за колачиња вметнати на врвот од страницата.

Лабораториски наспроти теренски податоци

Постојат два вида мерења, а нивното мешање создава збунетост.

  • Теренските податоци доаѓаат од вистински посетители што користат вистински уреди и мрежи. Google ги собира од корисниците на Chrome и ги прикажува во PageSpeed Insights и Search Console кога вашиот сајт има доволно сообраќај. Тоа е она што се смета за оценување.
  • Лабораториските податоци доаѓаат од симулиран тест, како Lighthouse. Се повторливи, што ги прави идеални за дебагирање, но тоа е еден уред на една врска.

Малиот сајт може воопшто да нема теренски податоци. Во тој случај користете лабораториски тестови за да најдете проблеми и третирајте ги резултатите како насока, а не како пресуда.

Од каде да започнете со поправките

  1. Измерете ги страниците што се важни. Тестирајте ја вашата почетна страница, најпосетената целна страница и типична статија или страница на производ со мобилен профил. Не правете просек за целиот сајт.
  2. Прво поправете ја најбавната метрика. Ако LCP е лош, а CLS е во ред, работете на LCP.
  3. Започнете со евтините победи. Компресирајте ја и променете ѝ ја големината на главната слика, поставете димензии на сликите, овозможете кеширање, размислете за CDN и отстранете додатоци или скрипти што повеќе не ги користите.
  4. Тестирајте повторно по секоја промена. Менувајте по една работа за да знаете што помогнало.
  5. Почекајте теренските податоци да стигнат. Реалните бројки се собираат во подвижен период, па подобрувањата бараат неколку недели за целосно да се покажат.

Што врска има хостингот со ова

Core Web Vitals се главно за тоа како е изградена страницата, но хостингот го поставува подот. Бавниот одговор на серверот го одложува сè што следи, што директно го повредува LCP. Преполните сервери, застарените верзии на PHP и недостасувачкото кеширање на страната на серверот сите додаваат време пред прелистувачот да го добие првиот бајт. Добрата работа на front-end не може целосно да компензира бавен back-end.

Реалистично очекување

Поминувањето на сите три метрики е вреден циљ, но не е магичен прекинувач за рангирање. Релевантноста на содржината сè уште е многу поважна. Размислувајте за Core Web Vitals како за отстранување триење: тие нема да направат слаба страница да се рангира, но бавна, скокотлива страница отежнува да ги задржите посетителите што веќе сте ги заслужиле.

Чести грешки на сопствениците на сајтови

  • Јурење на совршен Lighthouse резултат. Резултат од 100 во лабораториски тест не е целта. Целта е поминување на трите прага за вистинските посетители.
  • Тестирање само на десктоп. Најголемиот дел од оценувањето се прави на мобилен, а мобилните уреди имаат побавни процесори и врски.
  • Инсталирање додаток за брзина и запирање таму. Додатоците можат да помогнат со кеширање и обработка на слики, но не можат да отстранат главна слика од 3 MB или десетина маркетиншки скрипти.
  • Игнорирање на шаблоните. Страниците изградени од ист шаблон обично ги делат истите проблеми, па поправањето на шаблонот поправа многу страници одеднаш. Search Console групира слични URL-а токму поради оваа причина.

Водете едноставен дневник што сте го променеле и резултатот пред и по. Штеди погодување кога нешто ќе регресира по ажурирање на додаток.

Брзите страници започнуваат со серверот

На Zebra Hosting Cloud, секој план го вклучува контролниот панел Plesk, каде можете да изберете актуелни верзии на PHP, а Cloudflare CDN е достапен на хостираните сајтови за да служи статички датотеки поблиску до посетителите. Заедно тие ја покриваат серверската страна на равенката за да можете да се концентрирате на самата страница. Видете што нуди секој план на прегледот на хостинг.