11 – العناوين < h1 > – < h6 > – النصوص – المستوى الاول
📌 العناوين (Headings) في HTML
🔹 ما هي العناوين؟
-
العناوين هي نصوص كبيرة أو بارزة تُستخدم لتقسيم الصفحة لمحتويات وأقسام.
-
في HTML عندنا 6 مستويات من العناوين:
-
<h1> = أكبر عنوان وأهم واحد.
-
<h6> = أصغر عنوان.
-
🔹 وسوم العناوين
🔹 ترتيب الأهمية (Hierarchy)
-
<h1> يستخدم عادة كـ العنوان الرئيسي للصفحة (Main Title).
-
<h2> يستخدم كـ عنوان فرعي تحت الـ <h1>.
-
<h3> تحت <h2> … وهكذا.
📌 مثلًا لو عندك مقالة:
🔹 الشكل الافتراضي في المتصفح
-
<h1> يظهر بخط كبير جدًا.
-
كل ما الرقم زاد (h2, h3…) حجم الخط بيصغر تدريجيًا.
-
لكن ممكن تغير الحجم والألوان باستخدام CSS.
🔹 الفرق بين العناوين والفقرات
-
<h1> – <h6> = عناوين، لها دلالة معنوية وهيكلية (SEO مهم).
-
<p> = فقرات نص عادي.
مثال:
🔹 أهمية العناوين في SEO
-
محركات البحث (جوجل) تستخدم العناوين لفهم محتوى الصفحة.
-
نصائح:
-
يجب أن تحتوي كل صفحة على عنوان رئيسي واحد فقط <h1>.
-
استخدم العناوين بالترتيب (لا تبدأ بـ <h3> قبل <h2>).
-
ضمّن الكلمات المفتاحية داخل العناوين.
-
مثال: بدل:
❌ <h2>مقدمة</h2>
✅ <h2>مقدمة عن شركات التنظيف في دبي</h2>
-
-
🔹 مثال عملي كامل
🔹 ملخص
-
عندنا 6 عناوين: <h1> إلى <h6>.
-
<h1> = الأهم والأكبر، ويُستخدم مرة واحدة غالبًا.
-
باقي العناوين لتنظيم المحتوى بشكل هرمي.
-
مهمة جدًا للزائر ولتحسين ترتيب موقعك في محركات البحث.