)
)
؟Semantic elementsما هي ال
هي عناصر يكون اسمها معبراً عن معناها ووظيفتها.
أغلب هذه العناصر تظهر بنفس الشكل للمستخدم ومع هذا
فإن عليك استخدامها بالشكل الصحيح للأسباب التالية :
الاستخدام الصحيح لهذه العناصر يحسن من قدرة محركات البحث على فهم موقعك وبالتالي تحسين ظهوره.
تحسن من شكل الكود الخاص بك وتجعله أسهل للقراءة والفهم.
div & p
block كحاوي لعناصر أخرى وهو عنصر >div<يستخدم العنصر
Semantic elementsأي أنه يأخذ كامل السطر. لا يعتبر من ال
Semanticsولكنه مستخدم جداً وستجد لاحقاً فائدة استخدام ال
عوضاً عنه.
لكتابة فقرة نصية وهو لا يمكن أن يحوي>p<يستخدم العنصر
.blockداخله أي عنصر
<nav>
<footer>
<article>
<aside>
<hgroup>
<section>
شريط التنقل
المنطقة السفلية للصفحة
مقال مستقل الفكرة
قسم جانبي مستقل المحتوى
حاوية مجموعة عناوين
لتحديد قسم من العنصر الأب
واستخداماتهاSemanticsال
<header>
يستخدم لرأس الصفحة
<figure>
<figcaption>
<details>
<summary>
<time datetime>
حاوي لصورة ووصفها
وصف الصورة داخل العنصر
السابق
محتوى مخفي يظهر عند
الضغط عليه
عنصر ابن يحدد عنوان العنصر
السابق
تكتب الأوقات بداخله وباستخدام الخاصية يقوم بترجمة التاريخ إلى لغة datetimeيفهمها المتصفح
<main>
لتحديد القسم الرئيسي من
العنصر الأب
، حيث أن استخدام عنصر Semanticsالفرق الذي يحدثه استخدام ال يعبر عن مكانه ومحتواه يجعل موقعك مفهوماً لكل من المبرمجين ومحركات البحث.