Google: Kanonisen sisällön voi asettaa JavaScriptillä – mitä tämä tarkoittaa hakukoneoptimoinnille ja verkkokaupalle

Mitä?
Google on selventänyt, että voit asettaa "rel=canonical"-asetuksen myös JavaScriptin kautta tarvittaessa (esim. SPA-sovelluksissa), kunhan teet sen oikein ja johdonmukaisesti. 

Miksi?
Canonical päättää, mitä URL-osoitteen versiota Google pitää "ensisijaisena". Virhe kanonisessa osoitteessa voi heikentää näkyvyyttä, lisätä päällekkäisyyksiä tai siirtää sijoitussignaaleja väärälle sivulle – ja verkkokaupassa se yleensä tarkoittaa todellista myynnin laskua.

Kenelle?
Verkkokauppojen omistajille, verkkokaupan päälliköille, hakukoneoptimoijille, kehittäjille ja ihmisille, jotka työskentelevät JS-kehysten (React/Next, Vue/Nuxt, Angular, Svelte) kanssa, jotka vaikuttavat renderöintiin ja tageihin "

Tausta:
Google käsittelee kanonisen määrityksen sekä ennen renderöintiä että sen jälkeen (eli JavaScriptin suorittamisen jälkeen). Siksi HTML:n kanonisen määrityksen ja renderöinnin jälkeisen kanonisen määrityksen väliset erot voivat aiheuttaa sekaannusta. Joulukuussa 2025 Google päivitti JavaScriptin hakukoneoptimointiohjeitaan selkeillä ohjeilla siitä, miten JavaScriptissä asetettua kanonistamista käsitellään. 

Lyhyt muistutus: mikä on kanoninen ja miksi se on olemassa?

Kanonisointi on prosessi, jossa Google valitsee edustavimman URL-osoitteen sisällölle, kun sivusta on olemassa useita samankaltaisia ​​tai identtisiä versioita. Kanoninen URL-osoite on tämä "edustava" versio, jonka Google haluaa näyttää hakutuloksissa. 

Verkkokaupassa kaksoiskappaleet ovat yleisiä, koska kaupat luovat muunnelmia ja yhdistelmiä:

  • suodatus ja lajittelu (URL-parametrit),
  • sivunumerointi,
  • tuotevariantit (väri/koko),
  • kampanjaparametrit (UTM),
  • kieliversiot,
  • eri polut samaan sisältöön (kategoria → tuote vs. hakukone → tuote).

Kun kanoninen asetus on väärin, seuraukset voivat olla tuskallisia:

  • Google indeksoi vääriä osoitteita (hakemistossa on sekaannusta),
  • signaalit (linkit, auktoriteetti, käyttäytymistiedot) jakautuvat useille URL-osoitteille,
  • tuhlaat indeksointibudjettiasi kaksoiskappaleisiin,
  • keskeisten kategorioiden ja tuotteiden näkyvyys heikkenee.

 Mitä Google tarkalleen ottaen sanoi kanonisen asettamisesta JS:ssä?

Viesti on yksinkertainen:

  • On parasta asettaa kanoninen HTML:ssä ("
  • Jos et pysty, voit asettaa kanonisen JavaScriptin avulla – mutta tee se tavalla, joka tekee kanonisesta yhtenäisen ja yksiselitteisen. 
  • Kanonisointi tapahtuu ennen renderöintiä ja sen jälkeen, joten kanonisen "lähdekoodissa" ja "renderöinnin jälkeen" päällekkäin asettaminen aiheuttaa ongelmia. 

Google korostaa myös erittäin käytännöllistä sääntöä: jos kanoninen osoite on jo HTML:ssä, JS:n ei tule muuttaa sitä eri osoitteeseen. Ja jos kanonisen osoitekirjan lisääminen HTML:ään on mahdotonta, on parempi olla sisällyttämättä sitä sinne ollenkaan ja lisätä se vain JS:n kautta (oikein, kohdassa "). 

Miksi "kanoninen asetus renderöinnin jälkeen" on riskialtista?

Koska Google ei aina näe verkkosivustoasi samalla tavalla kuin käyttäjä näkee sen selaimessa. Yksinkertaisesti sanottuna on kaksi "hetkeä":

  • HTML ennen renderöintiä (palvelin palauttaa sen välittömästi),
  • HTML renderöinnin jälkeen (mitä luodaan JavaScriptin suorittamisen jälkeen).

Jos kanoninen näkyy vasta renderöinnin jälkeen, niin:

  • lisäät riippuvuuttasi Googlen JS:n oikeasta renderöinnistä,
  • luot tilaa ristiinpinnoille (eri kanoninen lähdekoodissa, eri renderöinnin jälkeen),
  • viitekehyksissä on helpompi tehdä virheitä (esim. kopioida "<link rel=”canonical”> ” tai sen asettaminen väärään paikkaan).

Google muistuttaa nimenomaisesti, että kanoninen teksti hyväksytään, kun se on kohdassa ", ja JS:n kanssa sinun on "injektoitava" se oikein. 

Milloin kanoninen JS:ssä on käytännössä järkevää?

On tilanteita, joissa tämä voi olla järkevä kompromissi:

  • SPA-sovellus renderöidään asiakaspuolella, jossa " palvelimella on vaikeaa,
  • vanha sisällönhallintajärjestelmä/alusta, jossa sinulla ei ole täyttä hallintaa mallipohjaan ",
  • dynaamiset näkymät, joissa kanoninen riippuu sovelluksen tilasta (vaikka tässä tarvitaan erityistä huolellisuutta).

Verkkokaupoissa (etenkin headless-kehyksissä) kanonisen arvon määrittävät joskus kirjastot, kuten Head Manager (esim. React Helmet, Next.js Head). Tämä toimii, mutta vain jos yksi, johdonmukainen kanoninen arvo eikä ristiriitaisia ​​signaaleja ole.

Tärkein sääntö: kanoninen johdonmukaisuus "ennen" ja "jälkeen" renderöinnin

Jos muistat tästä artikkelista yhden asian, niin olkoon se tämä:

Älä luo tilannetta, jossa HTML:n kanoninen osoittaa A:han ja renderöinnin jälkeinen kanoninen osoittaa B:hen.

Google itse huomauttaa, että kanonisointi tapahtuu eri vaiheissa, joten "sekalaiset signaalit" vähentävät yksiselitteisyyttä ja lisäävät riskiä, ​​että algoritmi valitsee eri version. 

Verkkokaupassa tällainen siirtymä tapahtuu usein seuraavien kautta:

  • suodattimet ja lajittelu, jotka luovat erilaisia ​​URL-osoitteita,
  • automaattinen parametrien sidonta JS:ssä,
  • reititysvirheet (esim. kauttaviiva/ei kauttaviivaa)
  • kanonisten osoitteiden erot mobiili- ja työpöytäversioiden välillä.

Vaihe vaiheelta: kuinka toteuttaa kanoninen settable JS:ssä ilman min-arvoja

Vaihe 1: Päätä, mikä on kanonista (liiketoimintalogiikka)

Ensin on määriteltävä säännöt. Esimerkkejä kaupassa:

  • tuotteella on kanoninen URL-osoite "puhtaalle" osoitteelle ilman kampanjaparametreja,
  • kategoriasta on olemassa kanoninen ja lajittelematon versio,
  • suodata sivuja: joko kanonisia peruskategorian suhteen tai (jos suodattimet ovat hakukoneoptimoinnin kannalta järkeviä) kanonisia tiettyyn yhdistelmään nähden – mutta silloin on oltava indeksointistrategia.

Vaihe 2: varmista, että renderöinnin jälkeen on yksi kanoninen

Ei kaksi, ei kolme. Yksi. Sisään "Google muistuttaa sinua lisäämään kanonisen tekstin oikein ja asiakirjan asianmukaiseen osioon. 

Vaihe 3: Jos et voi lisätä kanonista koodia HTML-koodiin, älä lisää sitä ollenkaan

Tämä on tärkeä vivahde Googlen selvennyksestä: on parempi, että lähdekoodissa ei ole lainkaan kanonista osaa, kuin että se on eri kuin se, jonka asetat myöhemmin JS:ssä. 

Vaihe 4: Testaa Google Search Consolessa

Google suosittelee testaamaan renderöintiäsi ja kanonisuuttasi työkaluilla, kuten Search Consolella, varmistaaksesi, että Google näkee, mitä yrität saavuttaa. URL-tarkastus on hyödyllinen kanonisuuden kannalta, sillä se näyttää muun muassa määrittämäsi kanonisen osoitteen ja Googlen valitseman kanonisen osoitteen. 

Vaihe 5: Seuraa "Google valitsi eri kanonisen" -risteytysmainoksia

Jos Google valitsee usein eri kanonisen osoitteen kuin sinä asetat, se on merkki siitä, että:

  • sisältö ei ole riittävän samankaltainen (algoritmi ei pidä sitä kaksoiskappaleena),
  • signaalit ovat ristiriitaisia ​​(sisäinen linkittäminen, uudelleenohjaukset, sivustokartat),
  • kanoninen tarkoittaa heikompilaatuista URL-osoitetta (esim. virheitä, ei sisältöä, eri parametreilla).

Google kuvailee, että vaikka määrittäisit kanonisen version, algoritmi voi valita eri version useista syistä, ja kannattaa tarkistaa, onko Googlen valinta järkevä toiminnallisesta näkökulmasta. 

Yleisiä verkkokauppavirheitä, jotka rikkovat kanonisen järjestelmän (erityisesti JS:n kanssa)

Kopio kanonisesta

Kehys lisää kanonisen ja kauppa-alusta lisää toisen mallipohjaan. Renderöinnin jälkeen sinulla on kaksi erilaista "<link rel=”canonical”> ". Vaikutus: signaalista tulee lukukelvoton.

Kanoninen sarja ulkopuolella<head>

Google korostaa toistuvasti, että kanonisen tulisi olla kohdassa"Jos se laskeutuu ", joskus jätetään huomiotta. 

Kanoninen osoittaa URL-osoitteeseen parametreilla

Useimmiten canonical-attribuutin tulisi osoittaa "puhtaaseen" versioon. Jos canonical osoittaa URL-osoitteeseen, jossa on UTM, lajittelu tai suodatus, luot nopeasti sokkelon.

Kanoninen riippuu sovelluksen tilasta

Käyttäjä napsautti suodatinta ja JS muutti kanonista versiota. Tämän seurauksena robotti saattaa nähdä eri versioita eri renderöintikerroilla. Tätä on vaikea hallita, ja indeksointikaaoksen riski kasvaa.

Mitä tämä muuttaa käytännössä verkkokaupoille?

Jos harjoitat verkkokauppaa, Googlen tarkentamisella on kaksi todellista vaikutusta:

  • Vähemmän pelkoa headless-/SPA-projekteissa - kanoninen JS:ssä voi toimia, kun sitä toteutetaan johdonmukaisesti. 
  • Enemmän vastuuta toteutuksen puolella – koska "paras käytäntö" on edelleen kanoninen HTML:ssä ja JS on varavariantti. 

Kaupoissa, joissa on useita URL-yhdistelmiä (suodattimia, parametreja, variantteja), kanonisointi on yksi tärkeimmistä työkaluista indeksin järjestämiseen. Hyvin määritetty kanonisointi tukee kategorioiden ja tuotteiden näkyvyyttä, kun taas väärin määritetty voi haitata kasvua.

Tarkistuslista: Mitä tarkistaa myymälässäsi tänään 

  • Avaa tuotekortti ja tarkista sivun lähdekoodista, onko "canonical"-kohdassa ".
  • Tarkista, onko renderöinnin jälkeen jäljellä enää vain yksi kanoninen arvo (esim. kehitystyökaluissa).
  • Siirry URL-osoitteeseen, jossa on parametreja (UTM / lajittelu), ja katso, linkittyykö kanoninen osoitteen osoite perusversioon.
  • Käytä Search Consolessa URL-tarkastusta ja vertaa: Googlen ilmoittama kanoninen vs. valitsema kanoninen. 
  • Jos kanoninen on asetettu JS:ssä, tarkista, ettei siinä ole päällekkäisyyttä HTML:n kanssa (tai jos HTML:ssä ei ole kanonista ollenkaan, onko JS:n tarkoitus asettaa se). 

Missä swiatcyfrowy.pl sijaitsee tässä paikassa?

Jos haluat varmistaa, että kanoninen hakukoneoptimointi, JS-renderöinti ja indeksointi on asetettu oikein, nopein tapa tehdä tämä on yleensä teknisen SEO-auditoinnin avulla (verkkokauppaelementtejä huomioiden).

Digitaalisessa maailmassa tätä aihetta voi käsitellä osana laajempaa kokonaisuutta: indeksoinnin siistimistä, päällekkäisyyksien poistamista, kategorioiden ja tuotteiden näkyvyyden parantamista sekä hakukoneoptimoinnin suppilon kiristämistä → tuotekortti → kupi.swia

Jos haluat lisätietoja, ota meihin yhteyttä

Jos etsit lisää mielenkiintoisia artikkeleita: tutustu muihin blogikirjoituksiin ja verkkokauppauutisiin

Tilaa uutiskirjeemme saadaksesi mielenkiintoisimmat tiedot sähköpostiisi