آشنایی با تگ‌های کاربردی متا در زبان HTML

آشنایی با تگ‌های کاربردی متا در زبان HTML

تگ‌های متا برای ذخیره‌سازی بخشی از اطلاعات صفحه به کار می‌روند که از دید کاربران پنهان بوده و اساساً مربوط به داده‌های درون صفحه‌ای است که یا به درد موتورهای جستجویی همچون گوگل می‌خورند و یا مورد استفادهٔ مرورگر قرار می‌گیرند. در واقع، هدف اصلی این تگ‌ها تأمین اطلاعات برای مرورگر و همچنین موتورهای جستجو است تا مثلاً صفحه را بهتر ایندکس کنند تا در نهایت صفحات سایت ما برای موتورهای جستجو بهینه شوند مضاف بر اینکه طراحان سایت از این تگ‌ها برای مشخص کردن اطلاعاتی مانند نویسندهٔ مطلب، کلمات کلیدی و یا اطلاعات مرتبط با شبکه‌های اجتماعی استفاده می‌کنند اما در عین حال این تگ‌ها قابلیت‌هایی دارند که ممکن است از وجود آن‌ها باخبر نباشیم که در ادامه به بررسی تعدادی قابلیت کلیدی این تگ‌ها خواهیم پرداخت.

کنترل کَش مرورگر 
زمانی که برای اولین بار یک سایت را در مرورگر باز می‌کنید، مرورگر اطلاعات آن صفحه را درون کَش خود ذخیره می‌کند تا برای دفعات بعدی که وارد سایت می‌شوید، عمل بارگذاری سریع‌تر انجام شود و احتمالاً برای شما هم پیش آمده زمانی که در سایت خود تغییراتی اِعمال می‌کنید، این تغییرات در خروجی دیده نمی‌شوند و دلیلش هم این است که مرورگر از اطلاعاتی که قبلاً ذخیره کرده برای بارگذاری صفحه استفاده می‌کند اما به سادگی می‌توانید با یک تگ سادهٔ متا، عمل کَش کردن را در مرورگرهای مختلف غیرفعال کنید:

<meta http-equiv="Cache-Control" content="no-store" />  

این تگ برای مرورگرهای فایرفاکس و کروم به رسمیت شناخته می‌شود به طوری که حتی برای مرورگر اینترنت اکسپلورر نیز می‌توانید دسترسی بیشتری به تنظیمات ذخیره‌سازی داشته باشید:

<meta http-equiv="Cache-Control" content="no-cache" />  
<meta http-equiv="Pragma" content="no-cache" />  

علاوه بر این، می‌توانید یک تاریخ برای زمانی که کدهای سایت را تغییر داده‌اید نیز تعیین کنید تا اطمینان حاصل کنید که مرورگر از اطلاعات کَش استفاده نمی‌کند:

<meta http-equiv="expires" content="Fri, 18 Jul 2014 1:00:00 GMT" />  

کد متای بالا بدین معنی است که پس از این تاریخ، کدها منقضی شده‌اند و اگر مقدار آن را 0 قرار دهید، مرورگر در هر بار باز شدن صفحه، اطلاعات را بروزرسانی می‌کند (لازم به ذکر است که این احتمال وجود دارد در برخی مواقع خاص، این تگ متا کار خود را به درستی انجام ندهد که در چنین مواقعی می‌توان از هِدِر‌ها استفاده نمایید.)

کنترل کوکی‌ها 
همچون کَش، کوکی هم حاوی بخشی از اطلاعات است که مرورگر با مشاهدهٔ یک صفحه آن‌ها را ذخیره می‌کند تا در هر بار ورود به سایت، از آن داده‌ها استفاده کند. برای کنترل کوکی‌ها با تگ‌های متا، می‌توانید از نمونهٔ زیر استفاده کنید:

<meta http-equiv="Set-Cookie" content="name=data; path=path; expires=Day, DD-MMM-YY HH:MM:SS ZONE">  

name=data اسم کوکی است که مقداری قرار است در آن ذخیره شود، path راه دستیابی به اطلاعات است و expires تاریخ و زمان حذف شدن آن کوکی از مرورگر کاربر است که اگر مقدار آن را خالی بگذارید، کوکی هنگامی که مرورگر را ترک کنید، اصطلاحاً Kill خواهد شد. به عنوان مثال داریم:

<meta http-equiv="Set-Cookie" content="name=data; path=path; expires=Thursday, 01-Jan-2017 00:00:00 GMT">  

رِفرش کردن صفحهٔ سایت
همچنین می‌توانید با استفاده از تگ زیر، با گذشت یک زمان مشخص صفحه را رِفرش کنید. به عنوان مثال، کد زیر صفحه را هر ۵ ثانیه یک بار رِفرش می‌کند:

<meta http-equiv="refresh" content="5">  

ریدایرکت کردن کاربران
شما می‌توانید با استفاده از تگ متای زیر کاربر را به لینک دیگری هدایت کنید. در مثال زیر، 5 ثانیه پس از باز شدن صفحه، به مسیر http://example.com هدایت می‌شوید:

<meta http-equiv="refresh" content="5; url=http://example.com/">  

برای آنکه بلافاصله مسیر سایت تغییر کند، نیاز دارید تا زمان را به 0 تغییر دهید:

<meta http-equiv="refresh" content="0; url=http://example.com/">  

در پایان می‌توانید جهت آشنایی بیشتر با تگ‌های متا، به مقالهٔ معرفی لیستی از تگ‌هایی که می‌توان در بخش Head سایت قرار داد مراجعه نمایید که در آن اطلاعات بیشتری در مورد این تگ‌ها به اشتراک گذاشته شده است.

از بهترین نوشته‌های کاربران سکان آکادمی در سکان پلاس


online-support-icon