PageSpeed Insights: kuinka pitää sivuston nopeus korkealla

Jos käytät verkkosivustoa, olet todennäköisesti kuullut Google PageSpeed Insightsista. Se on ilmainen työkalu Googlelta, joka mittaa verkkosivujesi suorituskykyä sekä mobiili - että pöytäkoneilla. Mutta korkean pistemäärän saaminen voi usein tuntua peliltä, jota et voi voittaa.

Tänään aiomme tehdä yksityiskohtaisen arvion PageSpeed Insightsista, tarkastella kaikkia mahdollisia ongelmia, jotka vähentävät pistemääräsi, ja selittää tarkalleen, kuinka verkkosivustosi optimoidaan.

Miksi sivuston nopeus on niin tärkeä?

Ennen kuin tarkastelemme teknisiä ongelmia, puhutaan siitä, miksi sinun pitäisi välittää. Sivuston nopeus ei ole vain turhamaisuusmittari. Se vaikuttaa suoraan liiketoimintaasi.

Ensinnäkin nopeus on tärkeä sijoitustekijä hakukoneoptimoinnissa. Google on ilmoittanut virallisesti, että he käyttävät Core Web Vitalsia päättääkseen, kuinka korkealle sivusi ovat. Jos sivustosi lataaminen kestää liian kauan, Google painaa sinut alas hakutuloksissa.

Toiseksi nopeus vaikuttaa käyttökokemukseen ja muuntokursseihin. Useimmat käyttäjät hylkäävät sivun, jos sen ilmestyminen kestää yli kolme sekuntia. Nopea sivusto pitää vierailijat sitoutuneina ja tekee heistä paljon todennäköisemmin ostaa tuotteesi tai lukea artikkeleitasi.

Understanding PageSpeed Insights metriikka

Kun kirjoitat URL-osoitteen PageSpeed Insightsiin, se antaa sinulle kahdenlaisia tietoja: laboratoriotietoja ja kenttätietoja.

Kenttätiedot osoittavat, kuinka todelliset käyttäjät kokevat sivustosi. Se kerätään 28 päivän aikana Chrome User Experience Reportin (CrUX) avulla. Tällä on todella merkitystä hakukoneoptimoinnillesi. Lab-tiedot kerätään valvotussa ympäristössä, joka auttaa sinua virheenkorjausongelmissa.

Tärkeimmät katsottavat mittarit ovat

• Ensimmäinen sisällökäs maali (FCP): aika, joka kuluu, jotta selain renderöi ensimmäisen tekstin tai kuvan.
• Suurin sisällökäs maali (LCP): aika, joka kuluu, jotta suurin sisällön lohko tulee näkyviin.
• Kumulatiivinen asettelun siirto (CLS): mittaa, kuinka paljon sivuasettelusi siirtyy, kun se latautuu.
• Vuorovaikutus seuraavaan maaliin (INP): kuinka nopeasti sivusi vastaa käyttäjän napsautettua tai napautettuaan jotain.

Yleisiä ongelmia, jotka pilaavat pisteytyksen

Huonojen pisteiden saaminen on helppoa. Sen korjaaminen edellyttää perimmäisen syyn löytämistä. Tässä ovat yleisimmät ongelmat, jotka näet PageSpeed Insights - diagnostiikkaraportissasi.

1. Render-blocking-resurssit

Näin tapahtuu, kun sinulla on javascript - tai CSS-tiedostoja, jotka estävät sivun lataamisen kokonaan. Selain on pysäytettävä, ladattava tiedosto ja jäsennettävä se ennen kuin se voi näyttää mitään käyttäjälle.Miten korjata: sinun tulee lykätä tai asynkronisesti ladata kaikki ei-kriittiset javascript. CSS:lle poimi kriittinen CSS ja inline se kohteeseenlataa sitten loput asynkronisesti.

2. Optimoimattomat valtavat kuvat

Kuvat muodostavat yleensä suurimman osan verkkosivujen kokonaispainosta. 5 Mt: n kuvan lataaminen pienelle logolle on taattu tapa hidastaa kaikkea.Miten korjata: pakkaa kuvat aina käyttämällä nykyaikaisia muotoja, kuten WebP. Kannattaa myös käyttääloading="lazy"attribuutti, joten taitteen alla olevat kuvat ladataan vain, kun käyttäjä vierittää niitä alaspäin. Aseta aina eksplisiittinen leveys ja korkeus kuvatunnisteille asettelun muutosten estämiseksi.

3. Liikaa käyttämätöntä javascriptiä

Nykyaikaiset verkkosivustot lataavat usein raskaita kirjastoja tai kolmannen osapuolen komentosarjoja, mutta käyttävät vain pientä osaa koodista. Selain on vielä ladattava ja arvioitava kaikki, vieden arvokasta käsittelyaikaa.Miten korjata: poista käyttämättömät laajennukset ja yritä jakaa koodisi. Lataa vain skriptit, joita todella tarvitset kyseiselle sivulle.

4. Hitaat palvelimen vastausajat

Aika ensimmäiseen tavuun (TTFB) mittaa, kuinka kauan hosting-palvelimesi palautuminen alkuperäisen HTML: n aikana kestää. Jos palvelimesi on hidas, kaikilla muilla optimoinneilla ei ole paljon väliä.Miten korjata: käytä nopeaa verkkoisäntää. Toteuta palvelimen puolen välimuisti ja käytä sisällönjakeluverkkoa (CDN) palvelemaan sivustoasi palvelimilta, jotka ovat fyysisesti lähempänä käyttäjiäsi.

Tämä työkalu on loistava, koska se kertoo, missä tarkalleen teit virheen ja jopa näytät tarkat kuvakaappaukset. Joten korjaa vain nämä virheet vaihe vaiheelta, ja hakukoneoptimointiasi parannetaan.

Se ehdotti muuntamaan .jpg to.webp-kuvia esimerkiksi verkkosivustollemme.

Muttaälä ole järkyttynyt, jos et voi saavuttaa 100%, se on itse asiassa todella vaikea tehdä. Jos verkkosivustosi on monimutkainen, tarvitset paljon kuvia, joitain erityisiä js-kirjastoja, saatat ajatella, että –: lla ei ole enää mitään optimoitavaa, miksi pistemääräni on edelleen 80-90%? Tämä on aivan normaalia. Jos verkkosivustosi on “-vihreällä vyöhykkeellä”, se on jo hyvä merkki. Lisäksi tulokset voivat jopa vaihdella muutaman prosenttiyksikön – ilman mitään muutoksia –, jos testaat nopeuden eri aikaan.
Sinun pitäisi kuitenkin vielä yrittää maksimoida suorituskykysi käymällä läpi ja korjaamalla jokainen virhe luettelossa.

Miksi käännöskomentosarjamme pitää nopeutesi korkealla

Kun lisäät uusia widgettejä verkkosivustollesi, sinun on oltava erittäin varovainen suorituskyvyn suhteen. On hyvin yleistä, että käännöslaajennukset tuhoavat PageSpeed-pisteytyksen. He lataavat usein massiivisia kielitietokantoja asiakkaan puolelle, suorittavat raskaita javascript-viiveitä ja estävät renderöinnin samalla kun he selvittävät, mitä kieltä näytetään.

Rakensimme käännöskirjoituksemme tiukasti suorituskykyä ajatellen. Tästä syystä ratkaisumme on kevyt ja sillä on minimaalinen vaikutus suorituskyvyn nopeuteen:

• Pieni hyötykuormaraja: ydinkäsikirjoituksemme on uskomattoman pieni. Emme niputa suuria kolmannen osapuolen kirjastoja. Se lisää vain vähän kilotavuja sivukokoosi.
• Asynkroninen kuormitus: komentosarja on suunniteltu toimimaan asynkronisesti. Se ei koskaan estä pääsisältöäsi renderöimästä.
• Global CDN toimitus: toimitamme käsikirjoituksen ja käännetyn tekstin maailmanlaajuisesta verkosta. Tämä tarkoittaa, että tiedot kulkevat mahdollisimman lyhyen matkan vierailijallesi.
• Alkuperäinen DOM-injektio: sen sijaan, että piilottaisit sivun tai luomme asettelumuutoksia, komentosarjamme syöttää käännetyt merkkijonot saumattomasti. Se suoritetaan millisekunteina, joten kumulatiivinen asettelusi siirto pysyy täydellisesti nollassa.

Pitämällä teknisen jalanjäljen mahdollisimman pienenä varmistamme, että voit kääntää verkkosivustosi kokonaan tinkimättä mistään kovalla työllä ansaitusta hakukoneoptimointisijoituksestasi tai käyttökokemuksestasi.