Mikä on Web Vitals? | Ilmaiset Työkalut Hakukoneoptimointiin

Johdanto

Web Vitals on Googlen hakukoneoptimointiin kehittämä hanke, jonka perimmäisenä tarkoituksena on tuoda markkinoille yksinkertainen ja selkeä tapa verkkosivujen omistajille kartoittaa verkkosivujen suorituskykyä. Web Vitalsin avulla verkkosivujen omistaja ei välttämättä tarvitse sivun käytettävyyden kehitykseen ja hakukoneoptimointiin gurun papereita, sillä tutkimukseen ja seurantaan tarkoitetut työkalut on tehty helposti luettaviksi ja ymmärrettäviksi. Tässä artikkelissa sukellamme pintavesiin siinä mikä Web Vitals on, ja mitä jokaisen verkkosivujen omistajan pitäisi niiden käytöstä ja ominaisuuksista tietää.

Työkalut

Google Pagespeed Insights

Kuva: Sistrix

Google Pagespeed Insights on työkalu jolla pystytään helposti tuottamaan hakukoneoptimointia varten testejä yksittäisillä sivuilla. Testausta varten tarvitaan vain sivujen URL-osoite. Testauksen jälkeen käyttäjälle esitetään raportti jossa esitellään useita eri suorituskykyä arvioivia mittareita, esim. LCP, FID, ja CLS. Näitä kolmea voidaan kutsua nimellä Core Web Vitals. Menemme näiden kolmen mittarin merkityksiin myöhemmin tässä artikkelissa.

Google Pagespeed Insightista näkee myös paljon muuta tietoa siitä, mikä sivun hakukoneoptimoinnissa on mahdollisen parantamisen tarpeessa, muun muassa kuinka nopeasti sivun ensimmäinen elementti latautuu. Työkalu tarjoaa myös tapauskohtaisesti erilaisia keinoja kohentaa sivujen yleistä sekä teknistä SEO:ta.

Google Search Console

Kuva: WooRank

Google Search Consolella voidaan helposti tarkkailla sivujen kävijämääriä, liikennettä, klikkauksien määrää, mistä maista sivuilla käydään eniten, mikä sivuista on ollut suosituin, ja paljon muuta kävijöiden käyttäytymiseen liittyvää dataa. Google Seach Consolella pystytään tämän lisäksi kartoittamaan sivuston eri sivujen ongelmia liittyen LCP-, FID- ja CLS-mittareihin. Menemme seuraavassa osassa tarkemmin siihen mitä nämä tarkoittavat.

Konsolissa näytettävä data on ns. kenttädataa, eli dataa jota ollaan kerätty suoraan sivuston kävijöiltä ja käyttäjiltä.

Core Web Vitals

LCP

Jokainen verkkosivu muodostuu useista eri osista ja komponenteista: teksteistä, kuvista, linkeistä, videoista, hero-bannereista, logoista ja painikeista. Lista on pitkä. Joskus sivuille joudutaan sisällyttämään suuria elementtejä, esimerkiksi korkearesoluutioisia kuvia. Mikäli sivun elementtien latautumista ei olla suunniteltu ja laadittu oikein, riskeeraa kuvan lisääjä verkkosivujen näkyvyyden Google-hauissa.

LCP, eli Largest Contentful Paint, on mittari jolla mitataan kuinka kauan arvioitavan sivun suurimman elementin lataamiseen kuluu aikaa. LCP:tä mitataan sekunneissa, tai millisekunneissa. Pienempi aika tarkoittaa, että sivu on optimoitu oikein ja sivu latatutuu nopeasti – pidempi aika voi merkitä, että sivujen latautumiseen on kiinnitettävä huomiota.

Kuva: Google

Tämänhetkinen nyrkkisääntö on, ettei sivun suurimman elementin latautumiseen pitäisi kulua enempää kuin 2,5 sekuntia. Jos siinä kuluu kauemmin, on kannattavaa harkita parannuksia sivujen latautumiseen. Jos lataamisaika ylittää 4 sekuntia, ongelma on suuri – jopa kriittinen.

Yksi yleisimmistä keinoista lyhentää elementtien lataamisaikaa on optimoida sivun koodi. Kun sivun koodin ei tarvitse käydä läpi turhia skriptejä tai muita hidasteita, koodin tärkeimmät kohdat suoritetaan nopeammin. Toinen yleinen keino on vaihtaa sivujen palvelin toiseen. Vaikka sivusto olisi kuinka hyvin koodattu, hidas palvelin voi silti olla massiivinen pullonkaula sivujen suorituskyvylle.

FID

FID, eli First Input Delay, on mittari jolla mitataan sivuston elementtien nopeutta reagoida käyttäjän ensimmäiseen antamaan komentoon tai syötteeseen. Tämä interaktio voi olla esimerkiksi linkin tai checkboxin klikkaaminen. Tähän ei kuitenkaan sisälly muun muassa sivustolla zoomaaminen tai rullaaminen ylös tai alas, sillä nämä ovat Internet-selaimien omia ominaisuuksia, ei sivun.

Sivun FID suuruuteen vaikuttaa käyttäjän laitteen suorituskyky, sivuston koko ja kompleksius, sekä esimerkiksi JavaScriptin määrä sivuilla. Jos sivuilla on paljon kuvia sekä muuta sisältöä jotka latautuvat satunnaisessa järjestyksessä, se voi aiheuttaa pidemmän viiveen käyttäjän syötteen vastaamisessa.

Kuva: Google

FID-mittarilla siis määritellään, kuinka hyvin sivu pystyy vastaamaan käyttäjän toimintaan samalla kun sivu latautuu – mitä nopeammin, sen parempi. Googlen antamien ohjesääntöjen mukaan sivun vastausnopeus tulisi olla alle 100 millisekuntia. Yli 300 millisekunnin vastausaika kertoo huonosta nopeudesta, ja sivujen responsiivisuutta tulisi tällöin kohentaa. Tämän voi toteuttaa vaikkapa karsimalla turhia CSS-elementtejä tai optimoimalla sivujen JavaScript-koodia. Näihin on olemassa valmiita työkaluja, kuten Hotjar tai Analyticsin omia WordPress-liitännäisiä. Hitaan vastausajan vähentämiseksi on tosin syytä myös vähentää kolmannen osapuolen liitännäisten käyttöä vain tärkeimpiin lisäosiin.

CLS

Nopea kysymys: ollessasi verkko-ostoksilla tai muuten asioimassa netissä, onko sinulle koskaan käynyt näin?

https://s15165.pcdn.co/wp-content/uploads/2021/09/cls-example.gif
Kuva: Web.dev

Kyseessä on sivujen käytettävyyden kannalta erittäin haitallinen ilmiö. Kun sivuille asetetaan laajenevia elementtejä väärin tai pulmallisella hierarkialla, voi käytön aikana sattua hyvinkin vakavia virheklikkauksia. Tyypillisimpiä tapauksia ovat sivujen elementit jotka latautuvat myöhään, tai vaikkapa sellaiset sivun osat joista selain ei tiedä kuinka suuren tilan ne vaativat ennen latausta.

Sivun elementtien laajenevuutta mitataan CLS-mittarilla (Cumulative Layout Shift). Se arvioi kuinka paljon sivujen elementit muokkaavat verkkosivun kokonaisasettelua laajentuessaan, latautuessaan tai pienentyessään. Kultaisen papukaijamerkin CLS-mittarilta saa mikäli sivun CLS-pisteet ovat alle 0,1. Jos pisteet menevät yli 0,25, kannattaa perehtyä sivujen korjaamiseen.

Kuva: Google

Tapoja sivuasettelun rakenteen säilyttämiseen on esimerkiksi mediaelementtien mittasuhteiden määrittäminen CSS-tiedostoissa. WordPress-sivuille voi halutessaan myös asentaa liitännäisen joka skaalaa sivuille ladattujen kuvien mittasuhteet automaattisesti. Sivuilla näytettäville mainoksille kannattaa varata oma tilansa jotta ne eivät hypi esimerkiksi tärkeiden nappien tai lomakeiden päälle.

Pähkinänkuoressa

Web Vitals ovat kätevä työkalu tehokkaampaan hakukoneoptimointiin sekä enemmän että vähemmän osaaville verkkosivujen kehittäjille ja omistajille, jotka haluavat optimoida sivujen näkyvyyttä Google-hauissa. Google Page Insights ja Google Search Console ovat kaikille ilmaisia työkaluja jotka tarjoavat kattavan paletin erilaisia mittareita ja kaavoja sivujen suorituskyvyn mittaamiseen ja parantamiseen. Oikeaoppiseen optimoinnin saavuttamiseksi Core Web Vitals -mittareita kannattaa aktiivisesti hyödyntää jotta kehitykseen saadaan tarkkaa ja oikeaa dataa.

Välitä tietoa eteenpäin