SERP Snippet Preview
Kirjoita sivusi otsikko, metakuva ja URL nähdäksesi suoran, pikselitarkan esikatselun Google-tuloksesi kuvakaappauksesta työpöydällä ja mobiilissa.
Miten SERP-esikatselua käytetään
Neljä nopeaa askelta nipulle, joka näkyy kokonaisuudessaan ja ansaitsee naksahduksen.
Anna sivusi otsikko
Kirjoita otsikkolappu, jota aiot käyttää. Hahmo- ja pikselilaskurit päivittävät suorana, jotta näet, kuinka lähellä olet Googlen ~600px-työpöytärajaa.
Lisää URL- ja metakuvasi
Liitä sivu URL ja kirjoita metakuva. Esikatselu tekee korppujauhosta, sinisestä otsikosta ja harmaasta nipusta täsmälleen oikean tuloksen.
Vaihda työpöydän ja mobiilin välillä
Vaihda työpöydän ja mobiilin välilehdet molempien asettelujen tarkistamiseksi, koska mobiili käyttää kapeampaa saraketta ja käärii otsikot useammalle riville.
Korjaa tynkävaroitukset
Muokkaa, kunnes varoitussirut muuttuvat vihreiksi. Anna ellipsin sijaan kaikki, mitä on merkitty liian leveäksi, jotta Google näyttää koko otsikkosi ja kuvauksesi.
SERP:n niksikysymyksiä
Kehittäjille
Tämä SERP:n esikatselu toimii 100% asiakaspuolella – pikselimittaus tapahtuu selaimessasi, joten mitään kirjoittamaasi ei ole ladattu.
✓ Yksityishenkilö suunnittelusta – ei serverin kiertomatkaa
Runkkaus mitataan samalla tavalla kuin selain piirtää tekstiä – Canvas mittaa Text API:n. Tässä on ydinajatus, jonka voit pudottaa omaan rakennusputkeen:
// Measure rendered pixel width like Google does
const ctx = document.createElement('canvas').getContext('2d');
function titleWidth(text, font = '20px arial') {
ctx.font = font;
return ctx.measureText(text).width; // > 600 => truncated on desktop
}
console.log(titleWidth('Your page title here'));
Tarvitsetko tätä mittakaavassa – tuhansien nimien läpivalaisu CMS:ltä tai Cl:ltä? SEO-työkalujen isäntä REST API on käytettävissä maksullisissa suunnitelmissa. Katso suunnitelmat →