---
title: Semantic HTML Elements
localeTitle: عناصر HTML الدلالية
---
## عناصر HTML الدلالية

يمثل العنصر `<em>` النص كما يتم التأكيد عليه أعلى النص حوله. عادةً ، يقوم المتصفح بعرض هذا _بخط مائل_ ، ولكن يمكنك إضافة أنماط أخرى باستخدام CSS.

توفر عناصر HTML الدلالية معنى للمتصفحات ومطوري البرامج ومستخدمي الموقع. وعلى النقيض من عناصر مثل `<div>` أو `<span>` ، فإن العناصر الدلالية مثل `<header>` و `<footer>` تشرح بوضوح غرض كل قسم من موقع الويب.

### لماذا استخدام عناصر الدلالي؟

يستخدم المطورون عناصر دلالية لتعزيز ما يلي:

*   إمكانية الوصول: مساعدة التقنيات المساعدة في قراءة وتفسير صفحة الويب الخاصة بك
*   البحث: مساعدة أجهزة الكمبيوتر على فهم محتواك
*   التدويل: 13٪ فقط من العالم هم من الناطقين باللغة الإنجليزية
*   إمكانية التشغيل المتبادل: مساعدة المبرمجين الآخرين على فهم بنية صفحة الويب الخاصة بك 1

### عناصر دلالية الدلالي مفيدة

*   يحدد `<header>` رأس المستند أو القسم
*   يعرّف `<footer>` تذييل للمستند أو مقطع
*   `<nav>` يحدد ارتباطات التنقل في المستند
*   يحدد `<main>` المحتوى الرئيسي للمستند
*   يحدد `<section>` قسمًا في المستند - تحدده هذه المواصفة كـ "تجميع مواضيعي للمحتوى ، وعادةً ما يكون عنوانًا له" ، حتى يمكنك التفكير فيه على أنه مثل الفصل
*   `<article>` يحدد مقالة في المستند
*   يحدد `<aside>` المحتوى بخلاف محتوى الصفحة
*   يحدد `<address>` معلومات الاتصال الخاصة بمؤلف / مالك مستند أو مقال
*   يعرّف `<figure>` المحتوى المكتفي ذاتيًا ، مثل الرسوم التوضيحية والرسوم البيانية والصور ومجموعات الرموز وما إلى ذلك. 2

### العناصر الدلالية الأقل شهرة

*   `<bdi>` يحدد جزء من النص قد يتم تنسيقه في اتجاه مختلف عن النص الآخر (على سبيل المثال ، اقتباسًا بالعبرية أو العربية في مقالة إنجليزية بخلاف ذلك)
*   يحدد `<details>` إضافية يمكن للأشخاص عرضها أو إخفاءها (مثل تلميح الأداة)
*   `<dialog>` يحدد مربع حوار أو نافذة
*   يعرّف `<figcaption>` التسمية التوضيحية لـ `<figure>`
*   يعرّف `<mark>` النص المميز أو المميز
*   يعرّف `<menuitem>` عنصر أمر / قائمة يمكن للمستخدم تحديده من قائمة منبثقة
*   يحدد `<meter>` القياس القياسي ضمن نطاق معروف (مقياس)
*   يعرّف `<progress>` تقدم المهمة
*   `<rp>` يحدد ما يتم عرضه في المتصفحات التي لا تدعم التعليقات التوضيحية في روبي
*   `<rt>` يحدد شرح / نطق الحروف (للطباعة الآسيوية الشرقية)
*   `<ruby>` يعرّف تعليقًا روبيًا (للطباعة الآسيوية الشرقية)
*   يعرّف `<summary>` عنوانًا مرئيًا لعنصر `<details>`
*   `<time>` يحدد التاريخ / الوقت
*   `<wbr>` يحدد احتمال كسر خط 2

### مصادر

1.  [لي ، ميشيل. "نظرة عامة على دلالات HTML5." _CodePen_ . 16 فبراير 2016. الوصول: 24 أكتوبر 2017](https://codepen.io/mi-lee/post/an-overview-of-html5-semantics)
2.  [Bidaux ، فينسنت. "العناصر الدلالية HTML5 و Webflow: الدليل الأساسي." _Webflow_ . 16 ديسمبر 2016. تم الوصول إليها: 24 من تشرين الأول 2017](https://webflow.com/blog/html5-semantic-elements-and-webflow-the-essential-guide)

#### معلومات اكثر:

لمزيد من المعلومات: https://codepen.io/mi-lee/post/an-overview-of-html5-semantics

راجع [مقالة MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/em) .