Când SEO sfidează frumusețea. Îmbunătățirea Core Web Vitals…

google search console
Google Search Console ofera informatii importante despre functionarea site-ului, despre efectul SEO

Google, algoritmul acestuia, pentru a defini dacă un site este mai bun decât altul, face și el niște calcule, ține cont de elemente concrete. Mă voi referi la așa-numitele componente din Core Web Vitals, care definesc UX-ul. Acesta din urmă este un concept (poate puțin cam abstract) care se referă la experiența utilizatorului și este foarte strâns legat de SEO. Este logic ca pentru evaluare să fie luate în considerare niște valori concrete, care pot fi măsurate (metrice) și nicidecum frumusețea unui site.

Înainte de a trece mai departe; era și normal ca frumusețea unui site să nu conteze în ierarhizare. De ce doar SEO, respectiv conținutul site-ului și nu estetica!? Simplu, pentru că, de fapt, ce înseamnă frumosul? Este un criteriu relativ or, în afaceri nu ne putem lăsa în slujba relativității.

» Oul lui Columb cel digital: SEO sau web design?

Și să mai spun două cuvinte despre relativitatea măsurării acestora. Opinia mea este că dacă vrei să măsori viteza de încărcare (de exemplu) a orice, site sau doar o imagine, vom obține rezultate diferite, în funcție de locul de unde se măsoară aceasta. Adică un website de la Timișoara se va încărca la viteze diferite dacă observi de la New York, București sau Tokyo. Mi se pare firesc să fie așa, apar diferențe în funcie de echipamente, de starea vremii, de conexiune! De browserul utilizatorului și cine știe câte alte șuruburi!…

Prin urmare, în loc de absolutul unei valori concrete, voi prefera o soluție practică de îmbunătățire a acesteia. Și voi apela la mult bun simț tehnic, ceea ce vechii mei dascăli din școală s-au străduit să mă învețe. Iar, în fond și la urma urmei SEO este plin de bun simț. Mă rog, ar trebui să fie…

Core Web Vitals pe scurt

Un set de indicatori care măsoară experiența reală a utilizatorului pe un site web. Aceștia se concentreaază pe viteza de încărcare, interactivitate și stabilitatea vizuală a paginilor.

Scopul lor este de a oferi o experiență web mai bună utilizatorilor. Astfel paginile web vor fi mai rapide, mai stabile și mai interactive. Google ține cont de Core Web Vitals ca factori de ranking în rezultatele căutării. Asta înseamnă că site-urile web cu performanțe bune la acești indicatori vor avea și o clasare mai bună.

În opinia mea, cei mai importanți indici de la Core Web Vitals sunt următorii, o să spun mai multe despre ei mai jos.

  • Largest Contentful Paint (LCP): Măsoară timpul necesar pentru a afișa conținutul principal (de regulă o imagine mare) al unei pagini. Un LCP bun este sub 2,5 secunde.
  • Cumulative Layout Shift (CLS): Indică stabilitatea vizuală a unei pagini web. Un CLS bun are un scor de 0.1 sau mai mic.
  • First Input Delay (FID): Măsoară timpul necesar unui utilizator pentru a interacționa cu o pagină web după ce a fost încărcată. Un FID bun este sub 100 de milisecunde.

Viteza de încărcare a celei mai mari imagini

Cei de la Google o denumesc „Largest Contentful Paint” (LCP) și înseamnă de fapt timpul în care cea mai mare imagine din pagina dvs este încărcată complet. Este importantă această viteză, căci de ea depinde acel factor UX, iar experiența utilizatorului determină coeficientul de respingere. Adică un element de SEO.

Ce este important la acest indicator? Poate acela că-l puteți controla chiar dvs.! Vă invit să (re) citiți articolul meu Optimizarea imaginilor; efectul asupra SEO și al site-ului. Acolo explic cele mai importante (cred eu) aspecte referitor la dimensiunea fotografiilor. Două cuvinte doar: dacă nu lucrați cu imagini rezonabile site-ul dvs va fi într-o zonă mai mult decât gri a căutărilor pe internet. Nu mai zic că SEO va fi ca și la pământ.

Mai jos aveți o captură de ecran de la un site pe care-l corectez și vreau să scot în evidență câteva aspecte. (Am pus o dungă neagră peste datele de identificare.)

imagine prea mare scade viteza de încarcare
O imagine de dimensiuni exagerate va reduce viteza de încărcare a site-ului. Afectează UX și SEO

Am subliniat cu roșu datele tehnice care ies cu mult din normal. De exemplu, lățimea monitorului la care lucrez acum este de 1600 px. Gândiți-vă că un telefon „comun” ar avea 500-600 de pixeli lățimea displayului. Înțelegeți așadar că 8680 de pixeli (cât are imaginea introdusă în site) este cu mult peste necesități. Folosirea acestor dimensiuni la fotografii fac site-urile lor practic de nevizionat.

Primul lucru pe care trebuie să-l faceți când introduceți imagini este să vă asigurați că au o dimensiune acceptabilă. Altfel, utilizatorul pleacă iar Google primește un semnal cu valoare mare a ratei de respingere. „Tradus pe românește” ar însemna că site-ul nu este chiar ce trebuie. SEO este „la pământ” în aceste condiții.

Îmbunătățirea „Largest Contentful Paint”

Începeți cu a măsura LCP. Intutitiv, cu cât veți lucra mai mult SEO, cu atât vă veți da seama ce trebuie să faceți, cât de mari să fie imaginile și cât de rapid este site-ul. Însă. la început, până vă faceți mâna folosiți un instrument. De exemplu Page Speed Insignts. Sau oricare altul, care vă este mai confortabil, esențial este să lucrați cu unul singur.

O soluțe ar fi să arătați imaginea într-un format mult redus, de exemplu 300 px lățime. Ir cine dorește să o vadă întreagă face click pe ea și i se deschide atât cât doriți dvs. Este cea mai elegantă soluție. Plus că dpv SEO puteți îmbunătăți cu descrieri și atribute…

La mine, în site-urile mele, mă străduiesc ca imaginile care se încarcă în pagină să aibă sub 50 ko. Ce este dincolo de această dimensiune le pun miniaturi și deschid separat. Așa lucrez eu…

informatii Core Web Vitals
Cama așa arată informațiile despre paginile unui site unde avem LCP mare. Aici este de lucru, de făcut SEO grupa mare cum se spune

Cumulative Layout Shift (CLS) – stabilitatea paginii

Acest indicator se referă la viteza de stabilizare a paginii, mă rog, cam așa-i zic eu și veți vedea de ce. Adică ați încărcat o pagină și începeți să o citiți. Hop, „vă fuge” textul, în sus sau în jos, după cum o imagine de dedesubt sau deasupra s-a încărcat. Ei, momentul acela când imaginea s-a stabilizat și puteți citi fără să fiți deranjați, acela este momentul când pagina a devenit stabilă.

Din punctul de vedere al celor de la Google Dev, dacă site-ul devine stabil sub 0.1 secunde, atunci e ok. Între 0.1 și 0.25 secunde ați putea să mai lucrați, să faceți mai bine. Iar pentru UX și în consecință pentru SEO, dacă timpul e mai mare de 0.25 secunde, atunci trebuie lucrat, aveți nevoie de îmbunătățiri.

Cum rezolv eu stabilitatea paginii… atribui valori bine definite imaginilor. Adică le introduc atributele width și height. În acest fel browserul va calcula poziția imaginilor și textelor și le va încărca în locurile respective.

O imagine va avea un cod de forma aproximativă: < img src=”….” width=”300″ height=”200″ />.

Nu este invenția mea, nu-s atât de deștept, am prins-o și eu de la alții pe vremea când HTML 4 nu exista încă. Și observ că încă funcționează…

First Input Delay (FID) – timpul până la interacțiunea cu pagina

Acum, poate veți înțelege de ce pentru SEO este important să existe cât mai repede în pagina dvs un buton de interacțiune, un link, o adresă de mail pe care să o puteți folosi. Durata de timp până puteți să o acționați este acest FID, un fel de timp până la prima interacțiune posibilă.

Cei de la Google spun că sub 0.1 s este ok, între 0.2 și 0.5 s ar trebui să îmbunătățiți câte ceva. Peste 0.5 secunde e clar că aveți de lucru. Totuși, eu nu am întâlnit încă pagini atât de rapide. Decât dacă erau lipsite total de scripturi, imagini, erau ceva simplu de tot. Nu prea cred în perfecțiunea dusă la extrem…

Rezolvarea? Eu încep pagina cu numărul de telefon, mail, facebook… în orice pagină din 789.ro este așa.

Concluzie

Am observat însă că a te concentra asupra îmbunătățirii tuturor acestor indicatori tehnici ai unei pagini web ar putea duce la pierderea din vedere a esențialului. Adică a conținutului. Opinia mea este aceea că dacă utilizatorul găsește o pagină ca fiind utilă pentru el, v-ați atins obiectivul. Atrageți-l de la început, folosiți un cârlig (expresie jurnalistică) și el va trece cu vederea micile imperfecțiuni ale site-ului dvs.

Sper că am reușit să vă expun corect ce este acest Web Core Vital și ce efect are asupra SEO. Și de ce nu conteză frumusețea, totul se măsoară cu secunda și nu se apreciază cu chestii de genul „îmi place” și „vai ce frumos”!…

Despre Matei Bitea Articolele 207
Ofer servicii de optimizare SEO si locuiesc in Timisoara. De web design m-am apucat la sfârșitul anilor 90. Apoi, cam de prin 2004 „m-am tras” spre SEO. Sunt fost jurnalist. Așadar copywriting-ul, crearea de conținut, mi se potrivesc ca o mănușă. La fel, marketing digital, seamănă cu ce făceam noi ca să vindem ziarul... Acum sunt freelancer. Mă ocup de SEO și scriu site-urile altora. Doar asta fac...