🖥️ SERP & snippet preview

SERP snippet preview

I-type ang pamagat ng iyong pahina, meta description at URL upang makita ang live, pixel-tumpak na preview ng iyong Google resulta snippet sa desktop at mobile, na may mga babala sa pag-truncation bago sila mag-cost sa iyo ng mga click.

0 Mga character · 0px
0 Mga character · 0px
e
example.com
https://example.com

Paano gamitin ang SERP preview

Apat na mabilis na hakbang sa isang snippet na nagpapakita sa buong at kumikita ng click.

1

Ipasok ang iyong pamagat ng pahina

Ang mga character at pixel counter ay mag-a-update nang live upang makita mo kung gaano ka malapit sa limitasyon ng ~600px desktop ng Google.

2

Magdagdag ng iyong URL at meta paglalarawan

I-paste ang URL ng pahina at sumulat ng meta paglalarawan. Ang preview ay nagpapakita ng breadcrumb, asul na pamagat at gray snippet eksakto tulad ng isang tunay na resulta.

3

Mag-swipe sa pagitan ng desktop at mobile

I-toggle ang Desktop at Mobile tab upang suriin ang parehong layout, dahil mobile ay gumagamit ng isang mas makitid na haligi at wraps pamagat sa higit pang mga linya.

4

Ayusin ang mga babala truncation

I-trim ang anumang flagged bilang masyadong malawak kaya Google ay nagpapakita ng iyong buong pamagat at paglalarawan sa halip ng isang ellipsis.

SERP mga katanungan snippet

Ang Google ay nag-truncates desktop title link sa humigit-kumulang 600 pixels, hindi isang nakapirming bilang ng character, dahil malawak na mga character tulad ng W at M tumagal ng mas maraming espasyo kaysa sa makitid na mga tulad ng i at l. Ang tool na ito ay sumusukat sa tunay na render na pixel lapad kaya maaari mong makita kung saan eksaktong ang iyong pamagat ay cut off.
Google karaniwang nagpapakita sa paligid ng 920 pixel ng meta paglalarawan sa desktop (tungkol sa 155 sa 160 character) at mas mababa sa mobile. Anumang mas mahaba ay truncated na may isang ellipsis. Ang preview ay nagpapakita ng parehong desktop at mobile truncation live bilang ikaw ay mag-type.
Mobile mga resulta gamitin ang isang mas makitid na haligi at isang iba't ibang laki ng font, kaya pamagat wrap sa higit pang mga linya at paglalarawan ay hiwa mas maikli. tool na ito ay nagpapakita ng parehong layout side-by-side upang maaari mong i-optimize para sa bawat isa.
Hindi. Ang preview ay tumatakbo ng buo sa iyong browser gamit ang Canvas text-measurement API. Walang anumang iyong i-type ay nai-upload, naka-log o naka-imbak, kaya maaari mong ligtas na subukan ang mga hindi nai-publish na mga pahina at panloob na URL.

Para sa mga developer

Ang SERP preview ay tumatakbo 100% client-side - ang pixel pagsukat nangyayari sa iyong browser, kaya walang ano mang uri mo ay kailanman nai-upload.

✓ Pribadong sa pamamagitan ng disenyo — walang server round-trip

Truncation ay sinusukat sa parehong paraan ang browser ay gumuhit ng teksto — sa Canvas measureText API. Narito ang core ideya maaari mong drop sa iyong sariling bumuo ng pipeline:

// 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'));

Kailangan ito sa scale — batch-check ng libu-libong mga pamagat mula sa iyong CMS o CI? Isang hosted REST API para sa aming mga tool SEO ay magagamit sa bayad na mga plano. Tingnan ang mga plano →