SEO (search engine optimization) eli hakukoneoptimointi tarkoittaa sivuston parantamista niin, että se nousee Googlen hakutuloksissa korkeammalle.
Search Engine Optimization · Konseptit
SEO eli hakukoneoptimointi tarkoittaa sivuston parantamista niin, että Google ja muut hakukoneet löytävät sen, ymmärtävät sen sisällön ja näyttävät sen hakutuloksissa. Lyhenne tulee sanoista search engine optimization. Työssä on kaksi puolta: tekninen SEO, kuten otsikot, metatiedot, nopeus ja sivukartta, ja sisältö eli se, vastaako sivu siihen, mitä ihmiset oikeasti hakevat. Vibekoodaajalle SEO tulee ajankohtaiseksi heti julkaisussa, koska ilman sitä harva löytää sivuston hausta, vaikka sovellus toimisi hyvin.
Teknisessä osassa tekoäly on vahva. Next.js-projektissa Claude Code tai Cursor osaa kirjoittaa sivulle metadata-objektin tai generateMetadata-funktion, tehdä sivukartan app/sitemap.ts-tiedostoon ja hakukoneiden ohjeet app/robots.ts-tiedostoon. Pyydettäessä se lisää myös JSON-LD-muotoisen rakenteisen datan ja järkevän otsikkohierarkian. Sama koskee Open Graph -tietoja, joilla linkki näyttää kuvan ja otsikon somessa. Nämä asiat on dokumentoitu tarkasti, joten perusrakenne syntyy yleensä oikein yhdellä pyynnöllä.
Virheet syntyvät yksityiskohdissa. Tekoäly kopioi helposti saman otsikon ja kuvauksen jokaiselle sivulle tai jättää juuren layoutista pois metadataBase-asetuksen, jolloin jakokuvien ja canonical-osoitteiden osoitteet voivat mennä väärin. Sivukarttaan voi päätyä localhost-osoitteita, ja dynaamiset sivut voivat puuttua siitä kokonaan. Joskus robots.ts estää koko sivuston indeksoinnin, koska testiympäristön asetus jäi päälle. Tarkista siksi julkaisun jälkeen sivun lähdekoodista title- ja description-tagit ja avaa /sitemap.xml ja /robots.txt selaimessa.
Sisältöä tekoäly ei korjaa puolestasi. Hakukone nostaa sivun, joka vastaa hakijan kysymykseen paremmin kuin muut, ja sen ratkaisee teksti, ei metatagit. Kirjoita jokaiselle sivulle oma otsikko, joka kertoo aiheen hakijan sanoin, ja aloita teksti suoraan vastauksella. Myös nopeus vaikuttaa, ja Lighthouse-raportti selaimen kehittäjätyökaluissa kertoo, mikä sivua hidastaa. Korjaa ensin hitain kohta ja mittaa sitten uudelleen. Google Search Console näyttää, millä hauilla sivusi näkyvät ja mitkä sivut puuttuvat hakemistosta.
Teknisen osan suurelta osin kyllä. Claude Code tai Cursor kirjoittaa Next.js-sivuille metatiedot, sivukartan, robots.txt-tiedoston ja rakenteisen datan. Sisällön laatua, eli vastaako sivu hakijan kysymykseen, se ei ratkaise puolestasi, ja tekninen tulos kannattaa aina tarkistaa itse.
Jokaiselle sivulle oman title- ja description-tagin, metadataBase-asetuksen juuren layoutiin, sivukartan app/sitemap.ts-tiedostoon, robots.txt-ohjeet app/robots.ts-tiedostoon ja canonical-osoitteen sivuille, joilla on useampi osoite. Lisäksi sisällön pitää näkyä sivun HTML:ssä eikä syntyä vasta selaimessa.
Lisää sivusto Google Search Consoleen ja vahvista omistus. Lähetä sinne sivukartan osoite, esimerkiksi /sitemap.xml. URL-tarkistustyökalu kertoo yksittäisestä sivusta, onko se Googlen hakemistossa ja jos ei ole, miksi ei.
Next.js Metadata API: export const metadata = { title: "...", description: "..." }
Semanttiset HTML-tagit parantavat SEO:ta: h1, article, section
Sivukartta (sitemap.xml) kertoo Googlelle sivuston rakenteen
JSON-LD strukturoitu data auttaa hakukoneita ymmärtämään sisällön
Tutustu kaikkiin vibekoodauksen termeihin.