انتقل إلى محتوى الدرس

Defining Primary Content with Main تحديد المحتوى الجوهري والفريد للصفحة

استكشف قوة العناصر الدلالية في لغة HTML واستبدل حاويات div بعناصر header و nav و main و section و article و aside و footer لتعزيز إتاحة الويب والارتقاء بترتيب الصفحة في محركات البحث.
5 صفوف تعليمية
لغة HTML
14,207 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي
يحتضن عنصر <main> المحتوى الجوهري والفريد لصفحة الويب؛ فهو يمثل صلب الموضوع الذي يزوره المستخدم من أجله، ويفصل المقالات التعليمية وشروحات الدروس أو واجهات المنتجات عن الأجزاء العامة المكررة في الموقع مثل القوائم الجانبية والأقسام العلوية وتذييلات الحقوق.
الصف 2 شرح توضيحي
تنص مواصفة HTML5 الصارمة على وجوب احتواء الصفحة على عنصر <main> مرئي واحد فقط في نفس الوقت. ويعد تكرار هذا الوسم مخالفة لمعايير الويب؛ حيث يعطل آلية تخطي الروابط التي يعتمد عليها مستخدمو لوحة المفاتيح وقارئات الشاشة للقفز مباشرة إلى صلب الموضوع وتجاوز القوائم المتكررة.
الصف 3 كود برمجي

Primary Document Content With Mainتحديد المحتوى الرئيسي الفريد بعنصر main

تغليف المحتوى الأساسي الفريد للصفحة داخل وسم main لتمييزه عن القوائم المتكررة.
HTML
<main style="padding: 12px; border: 2px solid #6d28d9; border-radius: 10px; background: #ffffff;">
  <h3 style="margin: 0 0 6px;">Lesson 51: Semantic HTML5</h3>
  <p style="margin: 0;">The &lt;main&gt; landmark holds the core topic of this page.</p>
</main>
الصف 4 معاينة حية

Main Landmark Live Browser Renderمعاينة المحتوى الأساسي main في المتصفح

عرض متصفح لمنطقة المحتوى الرئيسي الفريد للصفحة داخل وسم main.
الصف 5 ملاحظة هامة