شرح العنصر <meta>
في HTML: دليل شامل
وسم <meta>
هو وسم بيانات وصفية يوفر معلومات منظمة عن المستند، مثل ترميز الأحرف، واسم المؤلف، وإعدادات نافذة العرض. ويلعب دورًا محوريًا في تحسين إمكانية الوصول إلى صفحات الويب ووظائفها.
بناء الجملة
العنصر <meta>
يغلق نفسه تلقائيًا ولا يحتوي على وسم إغلاق. يُوضع داخل قسم <head>
من مستند HTML.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="description" content="وصف صفحة الويب" />
</head>
<body>
<!-- محتوى صفحة الويب يظهر هنا -->
</body>
</html>
أمثلة شائعة
تحديد ترميز الأحرف
<meta charset="UTF-8" />
ملاحظة: UTF-8 هو الترميز الموصى به الذي يدعم جميع الأحرف واللغات.
وصف صفحة الويب
<meta name="description" content="متجر إلكتروني للإلكترونيات والأدوات" />
يظهر هذا الوصف غالبًا في نتائج محركات البحث.
إعدادات العرض على الجوال
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
ضروري لجعل الموقع متجاوبًا مع مختلف أحجام الشاشات.
الكلمات المفتاحية
<meta name="keywords" content="إلكترونيات، أدوات، متجر إلكتروني، تقنية" />
ملاحظة: لم تعد محركات البحث تعتمد كثيرًا على هذه العلامة.
تحديد المؤلف
<meta name="author" content="جون دو" />
التحديث التلقائي
<meta http-equiv="refresh" content="5;url=https://example.com" />
تحديث الصفحة كل 5 ثوانٍ أو إعادة توجيهها لرابط آخر.
توافق إنترنت إكسبلورر
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
لضمان العرض الصحيح في متصفح Internet Explorer.
السمات الرئيسية
السمة | الوصف | مثال |
---|---|---|
charset |
يحدد ترميز الأحرف للمستند | charset="UTF-8" |
name |
يحدد نوع البيانات الوصفية | name="description" |
content |
يحدد قيمة البيانات الوصفية | content="وصف الصفحة" |
http-equiv |
يحدد رأس HTTP المطلوب | http-equiv="refresh" |
أفضل الممارسات
- استخدم
<meta charset="UTF-8">
في كل صفحة ويب - أضف وصفًا مختصرًا وجذابًا باستخدام
name="description"
- لا تهمل إعدادات
viewport
لتصميم متجاوب - استخدم
http-equiv="X-UA-Compatible"
إذا كنت تدعم IE - تجنب الإفراط في استخدام
http-equiv="refresh"
لأنه قد يزعج الزوار
نصائح لتحسين محركات البحث (SEO)
الوصف الجيد
اكتب وصفًا مختصرًا (150-160 حرفًا) يجذب انتباه المستخدمين في نتائج البحث.
الكلمات المفتاحية
رغم تراجع أهميتها، يمكن استخدامها كمرجع داخلي لفهم محتوى الصفحة.
الخاتمة
تعتبر علامات <meta>
من العناصر الأساسية في تطوير الويب، حيث توفر معلومات حيوية لمتصفحات الويب ومحركات البحث. استخدامها الصحيح يحسن من تجربة المستخدم ويساعد في تحسين ظهور الموقع في نتائج البحث.