تگ title
تگ <title> اگرچه گاهی به اشتباه در دسته تگ‌های متا قرار می‌گیرد، در واقع یک تگ مستقل HTML است که عنوان صفحه را مشخص می‌کند.
تگ title همان متنی است که به‌صورت عنوان لینک (آبی‌رنگ) در نتایج جستجوی گوگل نمایش داده می‌شود. از آنجا که این تگ تأثیر مستقیمی بر جذب کلیک کاربران و سئو دارد، توصیه می‌شود از کلمات کلیدی مرتبط و جذاب در آن استفاده کنید.
تگ متا description
متا description یک تگ html است که توضیح کوتاهی راجب محتوای صفحه می‌دهد که در نتایج جستجوی گوگل (زیر عنوان آبی صفحه، معمولاً با رنگ خاکستری) نمایش داده می‌شود.
نکات طلایی برای نوشتن متا description
- حداکثر 150 تا 160 کاراکتر (تا متن قطع نشود)
- به صورت نرمال شامل کلمه کلیدی اصلی باشد
- جذاب باشد تا کاربر ترغیب شود روی لینک شما کلیک کند
- از کپی‌کردن توضیحات تکراری برای صفحات مختلف بپرهیزید
<meta name="description" content="متن مورد نظر"/>تگ متا viewport
یک کد HTML ساده که به مرورگرها می‌گوید چگونه صفحات وب را در دستگاه‌های مختلف (مخصوصاً موبایل) نمایش دهند.
پارامتر های content
width=device-width
به زبان ساده یعنی، وبسایت به طور خودکار با اندازه صفحه نمایش دستگاه هماهنگ می‌شود.
initial-scale=1.0
این ویژگی مقدار زوم اولیه هنگام باز شدن صفحه را مشخص می‌کند (مقدار پیش‌فرض 1.0)
minimum-scale=0.1
حداقل میزان مجاز برای زوم کردن کاربر
maximum-scale=10.0
حداکثر میزان مجاز برای زوم کردن کاربر
user-scalable=no
به کاربر اجازه زوم کردن را می‌دهد (yes یا no)
چرا ضروری است ؟
- الزام گوگل برای سایت‌های موبایل‌فرندلی
- شرط اصلی ریسپانسیو بودن
- تأثیر غیرمستقیم بر سئو
<meta name="viewport" content="width=device-width, initial-scale=1"/>تگ متا robots
یک دستور مستقیم به خزنده‌های موتورهای جستجو که مشخص می‌کند موتورهای جستجو چگونه با صفحه شما رفتار کنند.
پارامتر های content
- index,noindex : اجازه یا جلوگیری از ایندکس شدن کل صفحه
- follow,nofollow : اجازه یا جلوگیری از دنبال کردن لینک ها در صفحه
- noarchive : جلوگیری از ذخیره کش صفحه
- nosnippet : ممنوعیت نمایش توضیحات در نتایج
<meta name="robots" content="index, follow"/>متا تگ theme-color
این تگ به شما اجازه می‌دهد که رنگ نوار وضعیت مرورگر در دستگاه‌های موبایل را با سبک و پالت رنگی وبسایت خود هماهنگ کنید.
مقدار content کد رنگ مورد نظر می‌باشد.
<meta name="theme-color" content="#F6E9F"/>متا تگ های Open Graph
به زبان ساده یعنی وقتی که لینک آن صفحه رو در شبکه های مجازی به اشتراک بزاری محتوایی که مشخص شده‌ی زیر به آنها نمایش داده می‌شود.
- property="og:image" : تصویر نمایش داده شده
- property="og:title" : عنوان نمایش
- property="og:description" : توضیح کوتاه راجب صفحه
- property="og:url" : لینک صفحه
<meta property="og:title" content="title مورد نظر"/>
<meta property="og:image" content="url عکس موردنظر"/>
<meta property="og:description" content="description مورد نظر"/>
<meta property="og:url" content="url صفحه"/>تگ متا charset
یک فرمت استاندارد برای نمایش درست متن ها، علامت سوال و اموجی ها در صفحه می‌باشد.
UTF-8 از همه زبان ها پشتیبانی می‌کند
<meta charset="UTF-8"/>سایر تگ‌های متا
تگ متا author
این تگ برای تعیین نام نویسنده یا سازنده محتوا استفاده می‌شود، برای مشخص کردن مالکیت و اعتبار محتوا در صفحه وب کاربرد دارد.
تگ متا X-UA-Compatible
این تگ برای تنظیم نحوه سازگاری مرورگر با صفحه وب استفاده می‌شود، این تنظیم باعث می‌شود صفحه به حالت جدیدتر و سازگارتر نمایش داده شود.
تگ متا subject
این تگ برای تعریف موضوع کلی صفحه وب کاربرد دارد. بیشتر در شرایطی استفاده می‌شود که بخواهید یک توضیح مختصر درباره موضوع اصلی محتوای صفحه ارائه کنید.
تگ متا google-site-verification
این تگ برای تایید مالکیت سایت در ابزارهای سئو گوگل (Google Search Console) استفاده می‌شود. شما یک کد تایید از گوگل دریافت می‌کنید که باید در این تگ قرار دهید تا گوگل بتواند سایت شما را تایید کند.
تگ متا copyright
این تگ برای نمایش اطلاعات مربوط به حقوق کپی‌رایت محتوای صفحه وب استفاده می‌شود. این تگ به طور مشخص می‌تواند نشان‌دهنده مالکیت محتوا و قوانین استفاده باشد.
<meta name="author" content="نام نویسنده"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="subject" content="آموزش تگ های متا HTML"/>
<meta name="google-site-verification" content="recived-code"/>
<meta name="copyright" content="© 2025 Royalsite, All Rights Reserved"/>نتیجه گیری
با اینکه بسیاری از برنامه‌نویس‌ها از تگ‌های متا استفاده نمی‌کنند، اهمیت این تگ‌ها در بهینه‌سازی تجربه کاربری، سئوی سایت، و ارتباط با موتورهای جستجو غیرقابل انکار است. تگ‌های متا به کاربران و مرورگرها کمک می‌کنند تا اطلاعات بیشتری درباره محتوای صفحه وب داشته باشند و نقش کلیدی در ارائه دیدگاه مناسب از سایت برای موتورهای جستجو ایفا می‌کنند. با استفاده صحیح و بهینه از این تگ‌ها، می‌توان بازدیدکنندگان بیشتری را جذب کرد و تجربه کاربری بهتری ایجاد نمود.
