في البرامج التعليمية السابقة على شبكة تدريس صفحات الويب، تم التأكيد عدة مرات على جعل ملفات HTML لصفحات الويب ذات دلالية. يجب أن نختار علامات HTML أو XHTML الأكثر ملائمة بناءً على بنية مستند HTML الخاص بصفحة الويب، بدلاً من تحديدها بناءً على مظهرها. استخدم علامة P لتحديد فقرة بدلاً من استخدامها للحصول على تأثير فاصل الأسطر. نحن نستخدم علامات h1-h6 لوضع علامة على العناوين، بدلاً من استخدامها لتحقيق حجم النص وتأثيرات جريئة.
على سبيل المثال، بالنسبة للعنوان، يمكننا استخدام h1 لتعريفه:
<h1>اكتب نص عنوان المقالة هنا</h1>
بدلاً من تعريفه بأي طريقة أخرى:
<p style="font-size:16px;font-weight:bold;">اكتب نص عنوان المقالة هنا</p>
في المقالات السابقة على شبكة التدريس على الويب، قمنا بإدراج جميع العلامات التي يسمح بها XHTML1.0، ويمكننا أيضًا أن نجد أن هناك في الواقع عددًا قليلاً جدًا من علامات العناصر التي يمكننا اختيارها. لكننا ندرك أيضًا بوضوح أن علامات العناصر المكررة هذه لها أيضًا معانٍ أكثر وضوحًا. إذا لم تتمكن حقًا من العثور على العنصر المناسب لوضع علامة عليه، فيمكنك استخدام علامتي div وspan العامتين.
يعد استخدام علامات div وspan في الصفحات مشكلة جديدة، ونحن نميل إلى استخدامها كثيرًا. الاستخدام الضروري والمعقول لـ div يمكن أن يعزز بشكل كبير بنية المستند. إذا نظرت إلى مستند HTML الخاص بك ووجدت أن هناك الكثير من الأقسام والامتدادات، فعليك أن تنظر إلى المشكلة من منظور مختلف. هل هناك علامات أفضل لتحل محلها؟ إذا كان h1 يمكنه تمثيل المحتوى المحدد بشكل أفضل، فيجب عليك التخلي عن p أوspan لتعريفه.
ربما يكون هذا زوجًا من التناقضات، ومن الصعب علينا أن نفهم كيفية استخدامهما بشكل صحيح، أو ربما لا نستطيع الحصول على إجابة واضحة على الإطلاق. ولكن هناك شيء واحد يحتاج إلى توضيح، وهو أننا يجب أن نجعل المستند يتمتع ببنية منطقية واضحة ونجعل من السهل تطبيق الأنماط. يمكننا أن نفكر في div على أنه مجرد حاوية، أو "جزء" من المستند. نحن نستخدم عددًا كبيرًا جدًا من الحاويات، وهذا ليس نمطًا حكيمًا. والحاوية المناسبة تمامًا وفي وضع معقول يمكن أن تجعل المستند بأكمله يبدو منظمًا.
الكود التالي أكثر منطقية وفعالية:
| وفيما يلي المحتوى المقتبس: <div معرف = "رأس"> |