ساخت متا تگ
متا تگهای سئو، تگهای Open Graph و کارت X بسازید و ببینید صفحه در گوگل و هنگام اشتراکگذاری چه شکلی دارد.
ساخت متا تگ — تگهای سئو، Open Graph و کارت X با پیشنمایش زنده
عنوان و توضیحات درون head صفحه تعیین میکنند صفحه در گوگل چه شکلی داشته باشد، و تگهای Open Graph و X تعیین میکنند لینکی که به اشتراک گذاشته می‌شود در Facebook، LinkedIn، WhatsApp، Slack و X چطور دیده شود. این ابزار همهٔ آن‌ها را از یک فرم کوتاه می‌نویسد و سه پیشنمایش را هم‌زمان با تایپ نشان میدهد، تا بریده شدن عنوان را پیش از خواننده‌هایتان ببینید.
هیچ چیزی به سرور فرستاده نمی‌شود. تنها درخواستی که صفحه می‌فرستد بارگذاری تصویر اشتراکگذاری از آدرس خودش است، برای نمایش در پیش‌نمایش‌ها.
روش استفاده
- عنوان صفحه، توضیحات، آدرس صفحه (URL کنونیکال) و آدرس تصویر اشتراکگذاری را پر کنید.
- شمارنده‌ها و پیش‌نمایش‌های گوگل، Facebook و X را زیر نظر داشته باشید.
- نوع محتوا، سبک کارت X و اگر دارید، حساب X را انتخاب کنید.
- کپی را بزنید و کد را درون
<head>صفحه بچسبانید.
برای بهتر کردن یک صفحهٔ موجود، خواندن تگها از HTML را بزنید، سورس صفحه را بچسبانید و پر کردن را بزنید. HTML چسبانده‌شده فقط خوانده می‌شود و هرگز اجرا نمی‌شود.
هر تگ چه کاری می‌کند
| تگ | چه کسی از آن استفاده می‌کند | نکته |
|---|---|---|
<title> | تب مرورگر، نتیجهٔ گوگل | حدود ۵۰ تا ۶۰ نویسه؛ کلمه‌هایی را که مردم جستجو میکنند اول بیاورید |
meta description | اسنیپت گوگل | حدود ۱۲۰ تا ۱۵۵ نویسه که بگوید صفحه چه چیزی به خواننده میدهد |
link rel="canonical" | گوگل | همان یک آدرسی که باید رتبه بگیرد، وقتی چند URL یک صفحه را نشان می‌دهند |
og:title، og:description | Facebook، LinkedIn، WhatsApp، Slack | می‌تواند کوتاه‌تر و جذاب‌تر از عنوان جستجو باشد |
og:image | همهٔ پیش‌نمایش‌های اشتراکگذاری | ۱۲۰۰ × ۶۳۰ پیکسل، آدرس کامل https://، کمتر از حدود ۵ مگابایت |
twitter:card | X | summary_large_image برای تصویر عریض، summary برای مربع کوچک |
meta robots | موتورهای جستجو | فقط وقتی اضافه می‌شود که ایندکس یا دنبال کردن لینکها را خاموش کنید |
محدودیت طول
گوگل عنوان‌ها را بر اساس عرض می‌بُرد، در حدود ۵۸۰ پیکسل، که برای متن معمولی تقریباً ۶۰ نویسه است؛ حرف‌های پهنی مثل W و M جا را زودتر پر میکنند. توضیحات معمولاً در دسکتاپ بعد از حدود ۱۵۵ تا ۱۶۰ نویسه و در گوشی زودتر بریده می‌شوند. شمارنده‌ها وقتی از طول راحت بگذرید نارنجی می‌شوند و وقتی متن تقریباً حتماً بریده شود، قرمز.
بعد از انتشار
- شبکههای اجتماعی نسخهٔ کش‌شده‌ای از پیشنمایش هر لینک نگه می‌دارند. با Facebook Sharing Debugger یا LinkedIn Post Inspector کاری کنید که تگهای جدید را بخوانند.
- وقتی متن صفحه بهتر از توضیحات شما با یک جستجو جور باشد، گوگل اسنیپت خودش را انتخاب می‌کند و ممکن است عنوان‌هایی را که صفحه را توصیف نمی‌کنند بازنویسی کند.
- هر صفحه باید عنوان و توضیحات خودش را داشته باشد؛ تکرار همان متن‌ها در کل سایت نتایج را شبیه هم می‌کند.
ابزارهای مرتبط
برای ساختن تصویر اشتراکگذاری با قالب و اندازهٔ درست، از مبدل تصویر استفاده کنید. برای Escape کردن دستی نویسه‌های خاص در HTML، کدگذار موجودیت‌های HTML را به کار ببرید. صفحه‌های کاربردی زیر همین ابزار را روی یک پیشنمایش باز میکنند: ساخت تگ Open Graph، ساخت Twitter Card و پیشنمایش نتیجهٔ گوگل.