آموزش و مقالات

0
مقالات آموزشی - HTML

آموزش گام به گام HTML - متا تگ ها در HTML

یکشنبه, 21 آذر,1395
آموزش گام به گام HTML - متا تگ ها در HTML
 

متا تگ های HTML


متا تگ ها اطلاعات اضافه تر و مهمی در مورد اسناد هستند که شما مجاز هستید در HTML از آن استفاده کنید. عناصر متا تگ میتوانند به صورت name/value استفاده شوند که برای توصیف اطلاعات یک سند html کاربرد دارد،مانند نویسنده، تاریخ انقضاء، یک لیست از کلمات کلیدی و ...
تگ <meta> برای ارائه اطلاعات اضافی فراهم آورده شده و استفاده میشود.این تگ یک عنصر خالی است به همین خاطر تگ بسته ندارد.اما به وسیله ویژگی های خود حامل اطلاعاتی است.
شما می توانید یک یا چند تگ های متا در سند خود را که بر اساس آن میتوانید اطلاعاتی را که نیاز دارید در سند خود نگه دارید البته در حالت کلی،متا تگ ها در ظاهر فیزیکی برنامه تاثیری ندارد.

اضافه کردن متا تگ ها به اسناد:


شما میتوانید متاتگ را به سایتتان اضافه کنید بوسیله قرار دادن  <meta> در تگ <head>.متا تگ ها علاوه بر ویژگی های هسته ویژیگی های زیر را هم دارند :
 

Attribute Description
Name نامی برای تگ که میتواند هرچیزی باشد مثلا کلمات کلیدی ، توضیحات ...
content چگونگی ارزش یک عنصر را مشخص میکند.
scheme Specifies a scheme to interpret the property's value (as declared in the content attribute).
http-equiv

برای هدر پاسخ http مورد استفاده قرار میگیرد.به عنوان مثال http-equiv را می توان در به روز کردن صفحه و یا تنظیم یک کوکی مورد استفاده قرار میگیرد.ارزش ها هم شامل نوع محتوا تاریخ انقضاء تازه کردن و تنظیم کوکی

 

 تعیین کلمات کلیدی


شما میتوانید از تگ <meta> برای مشخص کردن کلمات کلیدی مهم مربوط به سند استفاده کنید و بعد از این کلمات کلیدی توسط موتورهای جستجو استفاده می شود تا زمانی که نمایه سازی وب سایت خودتان را برای جستجوی هدف مشخص میکنید
مثال:
در زیر یک مثالی هست که کجا باید html ، متا تگ ها، متاداده را به عنوان کلمات کلیدی مهم در مورد سند مورد استفاده قرار دهیم.

<!DOCTYPE html>
<html>
<head>
<title>Meta Tags مثال</title>
<meta name="keywords" content="HTML, Meta Tags, Metadata" />
</head>
<body>
<p>!HTML5 سلام </p>
</body>
</html>


 

 
توصیف اسناد

شما میتوانید با استفاده از تگ <meta> توضیحات مختصری درمورد سند ارائه دهید.و همینطور بوسیله موتورهای جستجوگر مختلف هنگامیکه سایتتان را به هدف جستجو فهرست بندی میکنید.
مثال:
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags مثال</title>
<meta name="keywords" content="HTML, Meta Tags, Metadata" />
<meta name="description" content="Learning about Meta Tags." />
</head>
<body>
<p>!HTML5 سلام</p>
</body>
</html>

 

 
تاریخ مرور سند

شما میتوانید از تگ <meta> برای دادن اطلاعتی برای آخرین آپدیت سند استفاده کنید. این اطلاعات می تواند توسط مرورگرهای وب مختلف استفاده شود وقتی که صفحه وب را refresh میکنید.
مثال:
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags مثال</title>
<meta name="keywords" content="HTML, Meta Tags, Metadata" />
<meta name="description" content="Learning about Meta Tags." />
<meta name="revised" content="Tutorialspoint, 3/7/2014" />
</head>
<body>
<p>!HTML5 سلام </p>
</body>
</html>

 

 

Refresh کردن سند


تگ <meta> میتواند برای refresh کردن اتوماتیک سند استفاده شود
مثال:

<!DOCTYPE html>
<html>
<head>
<title>Meta Tags مثال</title>
<meta name="keywords" content="HTML, Meta Tags, Metadata" />
<meta name="description" content="Learning about Meta Tags." />
<meta name="revised" content="Tutorialspoint, 3/7/2014" />
<meta http-equiv="refresh" content="5" />
</head>
<body>
<p>!HTML5 سلام</p>
</body>
</html>


 
تغییر مسیر صفحه

میتوانید از تک <meta> برای تغییر آدرس سایتتان استفاده کنید.و همینطور میتوانید مدت زمانی که میخواهید بعد از آن به آدرس جدید بروید تعیین کنید.
مثال:
 
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags مثال</title>
<meta name="keywords" content="HTML, Meta Tags, Metadata" />
<meta name="description" content="Learning about Meta Tags." />
<meta name="revised" content="Tutorialspoint, 3/7/2014" />
<meta http-equiv="refresh" content="5; url=https://www.tutorialspoint.com" />
</head>
<body>
<p>!HTML5 سلام </p>
</body>
</html>

 

 
تنظیمات کوکی ها

کوکی ها داده هایی هستند که در یک فایل در کامپیوترتان ذخیره میشوند و بین مرورگر و سرور ردوبدل میشوند و بر اساس نیاز مرورگر مورد استفاده قرار میگیرند.
شما میتوانید از تگ <meta> برای ذخیره کوکی های روی سمت سرویس گیرنده استفاده کنید و بعد از این اطلاعات می توانند توسط وب سرور برای ردیابی یک بیننده سایت مورد استفاده قرار بگیرد.

مثال:
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags مثال</title>
<meta name="keywords" content="HTML, Meta Tags, Metadata" />
<meta name="description" content="Learning about Meta Tags." />
<meta name="revised" content="Tutorialspoint, 3/7/2014" />
<meta http-equiv="cookie" content="userid=xyz; expires=Wednesday, 08-Aug-15 23:59:59 GMT;" />
</head>
<body>
<p>!HTML5 سلام </p>
</body>
</html>

 
 

اگر شما تاریخ و زمان انقضاء کوکی را وارد نکنید زمانی که کاربر مرورگر را ببند کوکی ها هم حذف خواهند شد

تنظیم نام نویسنده


شما میتوانید با استفاده از تگ <meta> نام نویسنده را تنظیم کنید

مثال :

<!DOCTYPE html>
<html>
<head>
<title>Meta Tags مثال</title>
<meta name="keywords" content="HTML, Meta Tags, Metadata" />
<meta name="description" content="Learning about Meta Tags." />
<meta name="author" content="Mahnaz Mohtashim" />
</head>
<body>
<p>!HTML5 سلام </p>
</body>
</html>

 

 
مشخص کردن مجموعه کاراکتر

شما میتوانید با استفاده از تگ <meta> مجموعه کاراکترهای مورد استفاده در صفحات وب را مشخص کنید .

مثال

به صورت پیشفرض سرویس دهنده های وب ومرورگرها از ISO-8859-1 برای پردازش صفحات وب پشتیبانی میکنند.مثال زیر از مجموعه کاراکتر های UTF-8 پشتیبانی میکند.
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags مثال</title>
<meta name="keywords" content="HTML, Meta Tags, Metadata" />
<meta name="description" content="Learning about Meta Tags." />
<meta name="author" content="Mahnaz Mohtashim" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<p>!HTML5 سلام </p>
</body>
</html>

 
 
برای استفاده از حروف چینی باید در تگ meta> ، charset=Big5> را قرار دهیم
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags مثال</title>
<meta name="keywords" content="HTML, Meta Tags, Metadata" />
<meta name="description" content="Learning about Meta Tags." />
<meta name="author" content="Mahnaz Mohtashim" />
<meta http-equiv="Content-Type" content="text/html; charset=Big5" />
</head>
<body>
<p>!HTML5 سلام </p>
</body>
</html>

 

 
Print
95 رتبه بندی این مطلب:
5.0

محمد فرخیانمحمد فرخیان

سایر نوشته ها توسط محمد فرخیان

نوشتن یک نظر

نام:
ایمیل:
نظر:
افزودن نظر

نام شما
ایمیل شما
عنوان
پیام خود را وارد کنید ...
x