تخطَّ إلى المحتوى

<h1>–<h6>

وسوم العناوين <h1>–<h6>

ستة مستويات من العناوين تبني الهيكل الهرمي للصفحة — h1 للعنوان الرئيسي الأوحد وh2-h6 للتفريعات.

العناوين ليست «نصًّا كبيرًا» بل هيكل المستند: محركات البحث تبني منها فهم الصفحة، وقارئات الشاشة تتنقل بها، وجداول المحتويات تتولد منها. h1 هو عنوان الصفحة الأهم (واحد لكل صفحة كأفضل ممارسة)، وh2 لعناوين الأقسام، وh3 لتفريعاتها، وهكذا نزولًا.

القاعدة الذهبية: اختر مستوى العنوان حسب موقعه في الهرم لا حسب حجمه المرئي — الحجم يضبطه CSS متى شئت.

الصياغة

<h1>عنوان الصفحة</h1>
<h2>عنوان قسم</h2>
<h3>عنوان فرعي</h3>

⚡ جرّب بنفسك

عدّل الكود واضغط «تحديث» لترى النتيجة فورًا — التجربة أفضل معلّم.

🎨 محرّر HTML/CSS
<h1>تعلم HTML</h1>
<h2>الوسوم الأساسية</h2>
<p>شرح الوسوم...</p>
<h3>وسوم النصوص</h3>
<p>تفصيل أدق...</p>
النتيجة المباشرة:

أهم الخصائص

الخاصيةالوظيفة
idيجعل العنوان هدفًا لرابط داخلي ‎#id — أساس جداول المحتويات

💡 نصائح عملية

  • h1 واحد لكل صفحة يحمل كلمتها المفتاحية الأهم — إشارة SEO مباشرة
  • لا تقفز المستويات (من h2 إلى h4) — التسلسل المنطقي يخدم الوصولية والفهرسة

⚠️ أخطاء شائعة

  • اختيار h3 لأن «حجمه مناسب» — الحجم وظيفة CSS والهيكل وظيفة الوسم
  • استخدام العناوين لتكبير نص عادي ليس عنوانًا فعليًّا

وسوم ذات صلة

🎓 تريد فهم الصورة الكاملة خطوة بخطوة؟ ابدأ من مسار HTML الكامل بالعربي.

📚 للتعمق التقني الكامل بالإنجليزية: MDN Web Docs