مهدی همیلی
در دنیای دیجیتال امروز که اشتراک‌گذاری محتوا در شبکه‌های اجتماعی اهمیت زیادی دارد، کنترل دقیق بر نحوه نمایش لینک‌ها در توییتر می‌تواند نرخ کلیک (CTR) و تعامل کاربران را به‌طور چشم‌گیری افزایش دهد.
یکی از ابزارهای مهم برای این کار، Twitter Meta Tags است که به کمک آن می‌توان تعیین کرد توییت‌ها هنگام اشتراک‌گذاری صفحات سایت چگونه دیده شوند.
در این مقاله از استک تیم، ارائه‌دهنده خدمات Team as a Service (TaaS)، با جزئیات کامل به معرفی تگ‌های متا توییتر می‌پردازیم و برای هرکدام توضیحات، کاربرد و کد نمونه ارائه می‌دهیم.
مزایای استفاده از Twitter Meta Tags
- کنترل بر عنوان، توضیح و تصویر پیش‌نمایش در توییتر
- نمایش حرفه‌ای‌تر لینک‌ها
- افزایش نرخ کلیک (
CTR) - تقویت اعتماد و برندینگ در شبکه‌های اجتماعی
- سئوی خارجی بهتر از طریق اشتراک‌گذاری‌های جذاب‌تر
انواع Twitter Meta Tags و توضیحات
1. twitter:card
کاربر: تعیین نوع کارت توییتر
توضیح: اولین و مهم‌ترین تگ. انواع مختلفی دارد: summary, summary_large_image, app, player. رایج‌ترین‌ها:
summary: پیش‌نمایش کوچک همراه با تصویرsummary_large_image: پیش‌نمایش با تصویر بزرگ
<meta name="twitter:card" content="summary_large_image" />
2. twitter:title
کاربر: عنوان توییت هنگام اشتراک‌گذاری
توضیح: مشابه og:title. جذاب، حداکثر 70 کاراکتر.
<meta name="twitter:title" content="آشنایی با PHP - زبان پشت صحنه‌ی وب" />
3. twitter:description
کاربر: خلاصه‌ای از محتوا
توضیح: متن کوتاه برای جذب کاربر. حداکثر 200 کاراکتر.
<meta name="twitter:description" content="در این مقاله با زبان PHP و قدرت آن در توسعه بک‌اند آشنا شوید." />
4. twitter:image
کاربر: تصویر نمایشی در توییتر
توضیح: تصویر باید جذاب و با کیفیت باشد. برای کارت‌های بزرگ، نسبت 1.91:1 (مثلاً 1200×630).
<meta name="twitter:image" content="https://stackteam.org/assets/images/php-twitter-banner.jpg" />
5. twitter:image:alt
کاربر: متن جایگزین تصویر (alt text)
توضیح: برای دسترس‌پذیری و بهبود تجربه کاربران دارای محدودیت بینایی
<meta name="twitter:image:alt" content="بنر گرافیکی معرفی زبان PHP" />
6. twitter:site
کاربر: نام کاربری توییتر وب‌سایت یا برند
توضیح: نمایش داده‌شده با نماد @ در کارت توییتر
<meta name="twitter:site" content="@stackteam" />
7. twitter:creator
کاربر: نام کاربری نویسنده یا سازنده محتوا در توییتر
توضیح: اختیاری. در صورتی مفید است که نویسنده در توییتر فعال باشد.
<meta name="twitter:creator" content="@mehdihemili" />
نحوه پیاده‌سازی Twitter Cards در پروژه
کدهای مربوط به Twitter Meta Tags را در بخش <head> سند HTML قرار دهید. پس از انتشار صفحه، می‌توانید با استفاده از ابزار Twitter Card Validator بررسی کنید که صفحه شما چگونه در توییتر نمایش داده خواهد شد.
سخن آخر!
اگر به دنبال حرفه‌ای‌تر شدن نمایش صفحات سایت خود در توییتر هستید، استفاده از Twitter Meta Tags کاملاً ضروری است. در استک تیم، هنگام طراحی و پیاده‌سازی پروژه‌ها، این تگ‌ها را به عنوان بخشی از استانداردهای سئو و تجربه کاربری لحاظ می‌کنیم.
