الوسم dfn — تعريف المصطلحات

dfn htmlتعريف مصطلح htmldefinition htmlhtml dfn tag

جدول مرجعي سريع

الحالة البنائية للوسم	كيف يحدد المتصفح المصطلح	طريقة الظهور والقيمة الدلالية
الوسم يحتوي على نص مباشر فقط	يعتبر النص الموجود داخل الوسم هو المصطلح المراد تعريفه	يظهر بخط مائل افتراضياً ويوجه محركات البحث للمصطلح مباشرة
الوسم يحتوي على وسم الاختصار abbr داخله	يعتمد المتصفح على نص سمة title الموجودة داخل abbr كعنوان للمصطلح	يجمع بين ميزة تفكيك الاختصارات وتحديد مكان التعريف الأول
الوسم يمتلك سمة title مباشرة فيه	تصبح قيمة سمة title للوسم نفسه هي المصطلح المعتمد وتلغي النص الداخلي بصرّياً	يظهر التلميح عند تحويم الفأرة ويمنح مرونة عالية في التوثيق

الشرح

عندما يقرأ الشخص مقالاً علمياً أو توثيقاً برمجياً، فإنه يمر بمصطلحات غريبة تحتاج إلى شرح. هنا يأتي دور الوسم الدلالي العبقري <dfn> (مختصر Definition).

هذا الوسم لا يُستخدم في كل مرة يذكر فيها المصطلح، بل يُستخدم مرة واحدة فقط في العمر البنائي للصفحة، وتحديداً في الجملة التي تشرح وتُعرّف هذا المصطلح لأول مرة. هو بمثابة إشارة ضوئية ضخمة تقول لمحركات البحث ولأنظمة القراءة الذكية: "يا محرك البحث، إذا بحث مستخدم عن معنى هذه الكلمة، فهذا السطر هو المكان الرسمي الذي قمنا فيه بتعريفها!".

كيف يقرأ المتصفح ومحركات البحث وسم dfn؟ (3 سيناريوهات ذكية)

هذا الوسم ذكي جداً، ويمتلك خوارزمية محددة لقراءة "المصطلح المستهدف" بناءً على طريقة كتابتك للكود. إليك الحالات الثلاث التي يفهمها المتصفح:

حالة النص المباشر: إذا كتبت النص داخل الوسم مباشرة دون أي إضافات، فإن المتصفح يعتبر هذا النص هو المصطلح الذي تشرحه. (مثال: يظهر النص مائلاً افتراضياً).
حالة الدمج مع الاختصارات (abbr): إذا كان المصطلح عبارة عن اختصار، يمكنك وضع وسم <abbr> داخل <dfn>. هنا سيعتبر المتصفح أن المصطلح الرسمي هو النص المكتوب داخل سمة title الخاصة بالاختصار.
حالة سمة العنوان المباشرة (title): إذا أضفت سمة title لوسم <dfn> نفسه، ستصبح قيمة هذه السمة هي المصطلح الفعلي للتعريف، بغض النظر عن النص المكتوب بين الوسمين.

متى نستخدم هذا الوسم

صفحات القواميس والمصطلحات (Glossary): عندما تبني صفحة كاملة تسرد فيها مصطلحات البرمجة ومعانيها.
المقالات التعليمية الطويلة: في أول فقرة من المقال عندما تقدم المفهوم الأساسي للطلاب.
التوثيقات التقنية (Documentation): لشرح الأدوات والـ APIs البرمجية الجديدة.

الصياغة (Syntax)

syntax

1	<!-- تعريف بسيط -->
2	<p>
3	<dfn>HTML</dfn> هي لغة ترميز النص التشعبي المستخدمة لبناء صفحات الويب.
4	</p>
5
6	<!-- dfn مع abbr -->
7	<p>
8	<dfn><abbr title="Application Programming Interface">API</abbr></dfn>
9	هي واجهة تتيح للبرامج التواصل مع بعضها.
10	</p>
11
12	<!-- dfn مع title -->
13	<p>
14	<dfn title="Object-Oriented Programming">البرمجة الكائنية</dfn>
15	هي نموذج برمجي يعتمد على الكائنات والأصناف.
16	</p>

أمثلة عملية

html

1	<!-- الحالة الأولى: نص مباشر داخل الوسم -->
2	<p>
3	<dfn>الويب الدلالي</dfn> هو أسلوب لبناء صفحات الويب يجعل البيانات المتاحة على الإنترنت قابلة للقراءة والفهم من قِبل الآلات ومحركات البحث وليس البشر فقط.
4	</p>
5
6	<!-- الحالة الثانية: دمج dfn مع abbr للمصطلحات المختصرة -->
7	<p>
8	تعتمد المنصات الحديثة على تقنيات
9	<dfn><abbr title="Search Engine Optimization">SEO</abbr></dfn>
10	وهي عملية تحسين المواقع لتظهر في النتائج الأولى لمحركات البحث بشكل مجاني.
11	</p>
12
13	<!-- الحالة الثالثة: استخدام سمة title الخاصة بوسم dfn نفسه -->
14	<p>
15	يُعد وسم
16	<dfn title="Cascading Style Sheets">CSS</dfn>
17	المسؤول الأول عن تحديد الألوان، الخطوط، التوزيع البصري، والتصميم الخارجي لهيكل الصفحات.
18	</p>

نصائح احترافية

—المتصفحات تعرض الـ dfn بخط مائل تلقائياً. لا تتركه هكذا؛ اذهب إلى ملف الـ CSS وامنحه لوناً مميزاً (مثل اللون البنفسجي الخاص بموقعك) وخطاً سميكاً (font-weight: bold) ليبرز للعين وسط الفقرة الطويلة ويعرف الطالب فوراً أن هذه الكلمة محورية ولها تعريف مخصص.

الدرس السابق

وسوم الأكواد التقنية (code, kbd, samp, var, pre)

الدرس التالي

الوسم cite — مرجع العمل الإبداعي

الحالة البنائية للوسم

كيف يحدد المتصفح المصطلح

طريقة الظهور والقيمة الدلالية

الوسم يحتوي على نص مباشر فقط

يعتبر النص الموجود داخل الوسم هو المصطلح المراد تعريفه

يظهر بخط مائل افتراضياً ويوجه محركات البحث للمصطلح مباشرة

الوسم يحتوي على وسم الاختصار abbr داخله

يعتمد المتصفح على نص سمة title الموجودة داخل abbr كعنوان للمصطلح

يجمع بين ميزة تفكيك الاختصارات وتحديد مكان التعريف الأول

الوسم يمتلك سمة title مباشرة فيه

تصبح قيمة سمة title للوسم نفسه هي المصطلح المعتمد وتلغي النص الداخلي بصرّياً

يظهر التلميح عند تحويم الفأرة ويمنح مرونة عالية في التوثيق

كيف يقرأ المتصفح ومحركات البحث وسم dfn؟ (3 سيناريوهات ذكية)

حالة النص المباشر: إذا كتبت النص داخل الوسم مباشرة دون أي إضافات، فإن المتصفح يعتبر هذا النص هو المصطلح الذي تشرحه. (مثال: يظهر النص مائلاً افتراضياً).

حالة الدمج مع الاختصارات (abbr): إذا كان المصطلح عبارة عن اختصار، يمكنك وضع وسم <abbr> داخل <dfn>. هنا سيعتبر المتصفح أن المصطلح الرسمي هو النص المكتوب داخل سمة title الخاصة بالاختصار.

حالة سمة العنوان المباشرة (title): إذا أضفت سمة title لوسم <dfn> نفسه، ستصبح قيمة هذه السمة هي المصطلح الفعلي للتعريف، بغض النظر عن النص المكتوب بين الوسمين.

متى نستخدم هذا الوسم

صفحات القواميس والمصطلحات (Glossary): عندما تبني صفحة كاملة تسرد فيها مصطلحات البرمجة ومعانيها.

المقالات التعليمية الطويلة: في أول فقرة من المقال عندما تقدم المفهوم الأساسي للطلاب.

التوثيقات التقنية (Documentation): لشرح الأدوات والـ APIs البرمجية الجديدة.