Hakukoneet osaavat nykyään suorittaa JavaScriptiä ja indeksoida _blocked_öidyn sisällön. Silti monella sivustolla on JavaScript-ongelmia, jotka haittaavat SEO:ta. Sisältöä, joka latautuu vasta JavaScriptin avulla, ei välttämättä indeksoida. Laiskasti ladattuja kuvia ei välttämättä löydetä. Selaimessa tapahtuva _blocked_öinti voi olla liian hidasta. Hakukoneet eivät välttämättä odota, että kaikki latautuu. Kun JavaScript on optimoitu oikein, hakukoneet näkevät kaiken sisältösi, ymmärtävät sen ja voivat käydä sen läpi tehokkaasti.
Miten hakukoneet käsittelevät JavaScriptiä
Google käy sivut läpi kuten selain. Se suorittaa JavaScriptin, _blocked_öi sisällön ja indeksoi sen, minkä näkee. Tämä on hyvä uutinen. Monimutkaisiakin JavaScript-sovelluksia voidaan indeksoida.
Google käsittelee sivut kahdessa aallossa. Ensimmäisessä aallossa se käy läpi HTML:n nähdäkseen sivun perusrakenteen. Toisessa aallossa se _blocked_öi JavaScriptin nähdäkseen dynaamisen sisällön. Tämä kaksivaiheinen prosessi vie aikaa ja resursseja.
Sivuilla, joilla on monimutkaista JavaScriptiä tai raskasta _blocked_öintiä, Google ei välttämättä odota, että kaikki latautuu. Se voi indeksoida vain sen, mikä on näkyvissä muutaman sekunnin _blocked_öinnin jälkeen. Sisältöä, joka latautuu hitaasti tai laiskasti, ei välttämättä indeksoida.
Yleisimmät JavaScript SEO -ongelmat
Selaimessa tapahtuva _blocked_öinti viivästyttää sisällön näkymistä. Tyhjä HTML-sivu lataa JavaScriptin, joka _blocked_öi sisällön. Google näkee aluksi tyhjän sivun. Jos _blocked_öinti kestää liian kauan, Google voi indeksoida tyhjän version.
Laiskasti ladatut kuvat ja sisältö latautuvat vasta, kun käyttäjä vierittää. Google ei aina vieritä. Laiskasti ladattua sisältöä, joka on näkyvän alueen alapuolella, ei välttämättä löydetä tai indeksoida.
JavaScript-virheet rikkovat _blocked_öinnin. Jos JavaScriptissä on virheitä, sivu ei välttämättä _blocked_öidy kunnolla. Hakukoneet näkevät rikkinäistä, puutteellista sisältöä.
Dynaamisesti luodut osoitteet parametreineen (page?id=123&sessionid=abc) luovat päällekkäistä sisältöä. Jokainen uniikki parametri luo uuden osoitteen. Hakukoneet voivat nähdä tuhansia kopioita samasta sisällöstä.
JavaScriptillä luotuja meta-tunnisteita eivät välttämättä näe kaikki robotit. JavaScriptillä lisättyjä Open Graph -tunnisteita, Twitter-kortteja ja muita meta-tunnisteita sosiaalisen median robotit eivät välttämättä lue oikein.
Palvelinpuolen _blocked_öinti vs. selainpuolen _blocked_öinti
Palvelinpuolen _blocked_öinti luo HTML:n palvelimella ja lähettää sen selaimelle. HTML sisältää jo kaiken sisällön. Selaimet näyttävät sen heti. Hakukoneet näkevät kaiken sisällön heti.
Selainpuolen _blocked_öinti lähettää minimaalisen HTML:n ja JavaScriptin, joka rakentaa sivun selaimessa. Sisältö luodaan selaimessa JavaScriptin suorituksen jälkeen. Se vie pidempään, eivätkä hakukoneet välttämättä näe kaikkea.
SEO:n kannalta palvelinpuolen _blocked_öinti tai staattinen generointi on parempi. HTML lähetetään selaimelle (ja hakukoneille) valmiina. Sisältö näkyy heti.
JavaScriptin _blocked_öinnin testaaminen
Käytä Google Search Consolen URL Inspection -työkalua. Syötä sivu, jossa on paljon JavaScriptiä. Google näyttää, mitä se löysi _blocked_öinnin jälkeen. Voit verrata sivua sellaisena kuin se käytiin läpi (mitä Google näkee) siihen, mitä itse näet selaimessa.
Käytä Lighthousea Chrome DevToolsissa. Se testaa, kuinka hyvin sivusi voidaan käydä läpi, ja nostaa esiin JavaScriptiin liittyviä ongelmia.
Katso sivun lähdekoodi selaimessasi nähdäksesi raa'an HTML:n. Tarkastele sitten elementtiä nähdäksesi _blocked_öidyn DOM:n. Vertaa niitä. Jos ne ovat hyvin erilaiset, käytössäsi on selainpuolen _blocked_öinti, joka voi hämmentää hakukoneita.
Käytä JavaScriptin virheenjäljitykseen sopivaa välityspalvelinta tai selaintestauspalvelua. Simuloi, mitä Google käy läpi ja mitä _blocked_öidään.
JavaScript SEO:n parhaat käytännöt
Käytä palvelinpuolen _blocked_öintiä (SSR) tai staattista sivustogenerointia (SSG) kriittiselle sisällölle. Näin sisältö on hakukoneille lähetettävässä HTML:ssä.
Lataa tärkeä sisältö etukäteen tai heti. Älä nojaa laiskaan lataukseen näkyvän alueen sisällössä. Lataa kriittiset kuvat ja tekstit heti.
Vältä dynaamisesti luotuja osoitteita, joissa on tarpeettomia parametreja. Käytä siistejä, yksinkertaisia osoitteita. Jos parametreja on pakko käyttää, yhdistä kopiot canonical-tunnisteilla.
Varmista, että meta-tunnisteet ovat HTML:ssä tai JavaScript _blocked_öi ne nopeasti. Sosiaalisen median robottien ja hakukoneiden pitäisi nähdä meta-tunnisteet heti, ei vasta raskaan _blocked_öinnin jälkeen.
Testaa Google Search Consolella. Tarkista, mitä Google näkee _blocked_öinnin jälkeen. Korjaa kaikki erot sen välillä, mitä näet sinä ja mitä näkee Google.
Pienennä JavaScript-nipun kokoa. Isojen JavaScript-tiedostojen lataaminen ja suorittaminen kestää kauemmin. Pienemmät niput _blocked_öityvät nopeammin ja hakukoneet käyvät ne läpi nopeammin.
Kehykset ja SEO
Suositut modernit JavaScript-kehykset käyttävät oletuksena selainpuolen _blocked_öintiä. Se tuo SEO-haasteita, koska sisältö täytyy _blocked_öidä ennen kuin hakukoneet näkevät sen.
Näiden kehysten päälle rakennetut meta-kehykset lisäävät palvelinpuolen _blocked_öinnin tai staattisen generoinnin. Ne ratkaisevat monia selainpuolen _blocked_öinnin ongelmia.
Jos käytät selainpuolen kehystä ilman palvelinpuolen _blocked_öintiä, sinun täytyy olla erityisen tarkka JavaScript SEO:n kanssa. Testaa huolellisesti Google Search Consolella.
Usein kysytyt kysymykset
Voiko Google indeksoida JavaScript-painotteista sisältöä?
Kyllä, Google voi suorittaa JavaScriptiä ja indeksoida _blocked_öidyn sisällön. Se vie kuitenkin aikaa ja resursseja. Hyvin raskas JavaScript ei välttämättä indeksoidu kokonaan, jos _blocked_öinti kestää liian kauan. Pidä JavaScript tehokkaana ja testaa Google Search Consolella, että sisältösi indeksoidaan. WEMASYn sivustonrakentajalla voit tehdä tämän suoraan omalla verkkosivustollasi.
Pitäisikö käyttää palvelinpuolen vai selainpuolen _blocked_öintiä?
Palvelinpuolen _blocked_öinti on parempi SEO:lle. Sisältö on hakukoneille lähetettävässä HTML:ssä. Hakukoneet näkevät sen heti odottamatta JavaScriptiä. Selainpuolen _blocked_öinti aiheuttaa viiveitä ja riskin, ettei sisältöä indeksoida. Käytä palvelinpuolen _blocked_öintiä tai staattista generointia sisällölle, jonka pitää sijoittua haussa.
Pitääkö hakukoneille tarjota eri HTML?
Ei. Google haluaa, että tarjoat kaikille saman HTML:n. Älä tee erityisiä versioita Googlebotille. Käytä kunnollista palvelinpuolen _blocked_öintiä tai _blocked_öinnin tunnistusta. Google käy läpi tavallisen käyttäjäversion ja sen pitäisi nähdä kaikki sisältö.
Miten korjaan laiskasti ladatut kuvat SEO:n kannalta?
Lataa kriittiset kuvat etukäteen näkyvällä alueella. Käytä selaimen omaa laiskaa latausta (loading="lazy") ja varaudu vanhempiin selaimiin. Käytä Intersection Observer API:a lataamaan kuvat käyttäjän vierittäessä. Testaa Google Search Consolella, että Google näkee kuvasi.
Hidastaako JavaScript sivustoani?
Kyllä, JavaScriptin suorittaminen vie aikaa. Isot JavaScript-niput ja raskas käsittely hidastavat sivun latautumista. Se haittaa käyttökokemusta ja Core Web Vitalsia. Pienennä JavaScript-nipun kokoa, jaa koodi osiin ja lykkää ei-kriittistä JavaScriptiä. Lataa vain se, mitä tarvitaan.
Pitäisikö meta-tunnisteet luoda JavaScriptillä?
Vältä sitä, jos mahdollista. Meta-tunnisteiden pitäisi olla HTML-lähdekoodissa. Sosiaalisen median robotit ja jotkin hakukoneet eivät välttämättä suorita JavaScriptiä. Jos meta-tunnisteet on pakko luoda JavaScriptillä, käytä palvelinpuolen _blocked_öintiä tai esirenderöintiä, jotta ne ovat HTML:ssä.