متا تگ (Meta Tag) چیست؟ + چه تاثیری روی سئو سایت دارد؟

متا تگ ها (Meta Tags)، تکه متن‌هایی هستن که در head صفحه قرار می‌گیرن و محتوای صفحه وب را توصیف می‌کنن. اغلب تگ‌های متا در خود صفحه نمایش داده نمیشن و کاربرد اون‌ها، کمک به موتورهای جستجو برای درک بهتر محتوا و ایندکس درست صفحات هست. با من، رسول کیوان‌پور، همراه باشید.

اهمیت متا تگ ها

متا تگ‌ها به لحاظ تکنیکال، تگ‌های اختیاری یا Optional هستن؛ یعنی میشه روی صفحه وب هیچ تگ متایی استفاده نکرد در حالیکه صفحه، بارگذاری و مشاهده میشه؛ آمّا…

استفاده از تگ‌هایی مثل title و meta robots و viewport و تگ‌های og بشدت روی سئوی سایت و UX تاثیر می‌زارن. پس… از ما گفتن 🙂

Ref: loganix.com

انواع تگ های متا (Meta tags)

در ادامه با مهمترین تگ‌های متا و نحوه‌ی تعریف و کارکردشون آشنا میشم.

۱- متا تایتل (Title tag)

<title>تگ متا چیست؟</title>

یک فاکتور رتبه‌بندی بسیار مهم هستش که تایتل یا عنوان صفحه رو مشخص می‌کنه‌؛ در صفحه نتایج موتور جستجو (SERP) و همچنین در تب مرورگر نمایش داده میشه. 2 نکته مهم در مورد تگ تایتل وجود داره:

1) جزو معدود تگ‌های متا هست که meta نداره!

۲) تنها متا تگی هست که در خود صفحه نمایش داده میشه (در تب مرورگر)

۲- متا دیسکریپشن (Meta Description)

<meta name=”description” content=”…” />

یک توصیف کوتاه و خلاصه از محتوای صفحه که در SERP و زیر تایتل نمایش داده میشه. فاکتور رتبه‌بندی مستقیم نیست اما روی CTR تاثیر داره (البته ممکنه overwrite بشه و گوگل محتوای دیگه‌ای رو در SERP نمایش بده).

۳- متا روبوتس (Meta Robots)

<meta name=”robots” content=”…” />

دستورالعملی برای کراولر در مورد index/noindex کردن صفحه و follow/nofollow کردن لینک‌های داخل صفحه. هیچ تاثیری روی محتوایی که کاربر می‌بینه نمی‌زاره ولی اصلی‌ترین ابزار برای نوایندکس کردن صفحه هستش. تگ Meta Robots می‌تونه تگ خطرناکی باشه 🙂 چون با تنظیم این تگ روی noindex، میشه از ایندکس شدن صفحات توسط موتورهای جستجو جلوگیری کرد.

۴- متا تگ ویوپورت (Viewport Meta tag)

<meta name=”viewport” content=”…”>

برای responsive کردن صفحات به کار میره و به مرورگر دستورالعمل‌هایی در مورد نحوه کنترل ابعاد صفحه و مقیاس‌بندی اون میده (Viewport منطقه قابل رویت برای کاربر در یک صفحه وب هستش).

۵- متا تگ کاراکتر (Charset Meta tag)

<meta charset=”UTF-8″>

کاراکترهای استفاده شده در داکیومنت HTML رو مشخص می‌کنه؛ برای زبان فارسی، باید روی UTF-8 تنظیم بشه.

۶- متا کیوورد (Meta Keyword)

<meta name=”keywords” content=”…” />

برای مشخص کردن کلمات کلیدی و اصلی صفحه بکار میره؛ هرچند امروزه موتورهای جستجو به این تگ اهیمت زیادی نمی‌دن. در واقع گوگل دیگه به مقادیری که توی تگ متای کیوورد ست شده توجهی نمی‌کنه و کیووردهای اصلی صفحه رو خودش تشخیص می‌ده. به همین دلیل، خیلی استفاده نمیشه و عملا تگ مهمی نیست.

۷- متا تگ نویسنده (Meta Author)

<meta name=”author” content=”…” />

برای مشخص کردن نویسنده محتوا بکار میره. قبلا خیلی مهم نبود ولی الان با توجه به مهمتر شدن الگوریتم EEAT بخصوص در حوزه‌های YMYL، متا تگ مهمی هست.

۸- متا تگ OG یا  Open Graph Meta tags

<meta property=”og:title” content=”…” />

توسط فیسبوک معرفی شده و موقع اشتراک‌گذاری لینک صفحه در شبکه‌های اجتماعی (فیسبوک، اینستاگرام، تلگرام، لینکدین و توییتر) بکار میاد. باعث میشه اطلاعاتی مثل تایتل و عکس صفحه درست نمایش داده بشن. اصلی‌ترین تگ‌های OG شامل og:title و og:type og:image و og:url هستن.

۹- متا تگ Twitter Card

<meta name=”twitter:image” content=”URL” />

توسط توییتر معرفی شده و موقع اشتراک‌گذاری لینک صفحه در توییتر بکار میاد و باعث میشه اطلاعاتی مثل تایتل و عکس صفحه درست نمایش داده بشن. البته اگر تگ‌های Twitter Card در صفحه نباشن، کراولر توییتر (Twitterbot) از تگ‌های OG استفاده می‌کنه. اصلی‌ترین تگ‌ها شامل twitter:site و twitter:title و twitter:description و twitter:image.

نسخه‌ی خلاصه و PDF این مطلب رو توی لینکدین گذاشتم؛ از اونجا دانلود کنید👇

پست لینکدین رسول کیوان پور در مورد تگ های متا (Meta tags)

منابع:

1- wordstream.com/meta-tags

2- blog.hubspot.com/marketing/meta-tags

3- developers.google.com/crawling-indexing/special-tags

4- www.metatags.org

5- developer.twitter.com/twitter-for-websites/cards/guides/getting-started

6- developer.twitter.com/en/docs/twitter-for-websites/cards/overview/markup