ساخت Page Preview
سلام دوستان ،
یه سایت نسبتا ساده طراحی کردیم ، برام جالبه بدونم چطور وقنی لینک برخی سایت ها رو توی تلگرام یا فیسبوک می زارم ، از اونها یک preview مثل عکس اول نشون میده ، اما از سایت ما عکسی رو نمیاره و فقط انگار Title رو میاره آدرس سایت http://deltashippingco.com هستش.
نمونه سایت های دیگر :
نمونه سایت ما :
2 پاسخ
سلام برای تصویر باید از meta با property زیر استفاده کنید:
<meta property="og:image" content="http://domain.com/image/me.jpg"/>
title و description هم که از همان title و meta description های معمول استفاده می شود.
سلام و درود
علت این موضوع مربوط به title و description سایت است.
و البته یک مبحث جدید به نام og (پروتکل Open Graph) که فیسبوک برای اولین بار در سال 2010 این قابلیت را معرفی کرد
این قابلیت با هدف ایجاد یک همکاری بین فیسبوک و سایر وبسایت ها ایجاد شد تا فیسبوک بتواند لینک های به اشتراک گذاشته شده را مشابه آیتم های خود در تایم لاین صفحات به نمایش بگذارد.
این پروتکل با هدف استفاده در شبکه های اجتماعی و نه موتورهای جستجو ساخته شده است.
Open Graph ها بصورت متاتگ هایی در قسمت head صفحه قرار می گیرند مثل og:title و og:description که به ترتیب برای معرفی بهتر title و description کاربرد دارند و البته تاثیر مثبتی در سئو هم دارند.
<meta property="og:title" content="عنوان سایت شما"> <meta property="og:description" content="توضیحات سایت شما">
و مثلا برای تعامل با twitter هم بصورت
<meta name="twitter:title" property="og:title" content="عنوان سایت شما">
من سایت شما را بررسی کردم که title و متا تگ description مناسبی ندارد
بابت عکس نمایش داده شده در preview هم بهتر است عکس ها و لوگوها دارای ویژگی alt برای توضیحات یا عنوان عکس باشند که در سئوی سایت برای موتورهای جستجو (مخصوصا جستجوی تصاویر) بسیار مفید است.
بهتر است از background-image هم برای لوگو استفاده نکنید و از یک تگ img با ویژگی alt استفاده نمایید تا در preview نمایش داده شود.