سبان وديف

في (HTML) وأيضا ال (XHTML)، يتم استخدام عناصر ال span وdiv في بعض الأجزاء من الملف التي لا يمكن وصفها لغويا بواسطة عناصر ال HTML.

معظم عناصر ال HTML تحمل معاني لغوية، حيث أن هذه العناصر تقوم بوصف بيانات معينة وتكون تأدية هذه العناصر لوظيفتها بناءً على نوعية البيانات التي تحتويها، مثال : (ap) هي عناصر ينبغي ان تحتوي على فقرات من نص معين، بينما (H1) هو عنصر يحتوي على ترويسة الصفحة، حيث أن مقدمي الخدمة الإلكترونية ينبغي ان يكون لديهم القدرة على التمييز بين هذه الرموز وفقا لذلك. حيث أن ال span وال div ليس لديهم معنى لغوي أساسي إضافة إلى التجميع المنطقي لمحتوى النص، يمكن استخدامهم لتعريف لفظ أو تصرف معين بدون الحاجة إلى ذكر زيادة في المعنى.

الاختلافات والتصرف التلقائي

هنالك فرق واحد بين ال div وال span، في المقاييس المعيارية لل HTML يعتبر ال div عنصر مستوى عام بينما يعتبر ال span عنصر ضمني. حيث يقوم ال div نظريا بفصل جزء من المستند في الصفحة كما هو الحال أيضا في الفقرات المتضمنة في الصفحة. ال span يحتوي على معلومة ضمنية محيطة بالنص، حتى هذه الخاصية يمكن تغييرها عملياً بواسطة خاصية الصفحات المتراصة.

الاستخدام العملي

عناصر ال span وال div يتم استخدامها بشكل نقي لتعبر عن مجموعة منطقية من العناصر المغلقة،

عندما يكون استخدامها متعلقا بمجموعة معينة أو لتحديد هوية شيء ما، حيث يمكن لهذه العناصر ان تدل على أنواع المعلومات التي لا يمكن وصفها بال HTML. مثال :

Fred Smith

يمكن استخدامها للدلالة على اسم المؤلف في ملف معين، 21st Jan 2006 يمكن استخدامها لتحديد تاريخ معين.

هناك ثلاثة أسباب رئيسية لاستخدام div وspan لتحديد الطبقات أو التعريفات :

التنسيق بواسطة CSS

يعتبر الاستخدام الشائع لل span وال div كعناصر يتم تطبيقها في تحديد الطبقات والتعريفات، حيث يتم هذا العمل بالترابط مع ال CSS لتكوين طبقة، أو مادة مطبوعة، لون، وتطبيقات أخرى يتم تنفيذها على الصفحة. بالإضافة إلى أن ال CSS لا يتم تطبيقه فقط مع التطبيقات المرئية، حيث أنها تستخدم أيضا في التطبيقات السمعية للتأثير على ارتفاع حدة الصوت، كثافة الصوت، وتوزيعة بالنسبة إلى صورة صوتيه.

لهذه الأسباب ولتوافقيتها مع مفهوم الشبكة النحوية، سنناقش فيمايلي سمات مرفقة لعناصر متضمنة في ال HTML ينبغي ان تصف أهدافها اللغوية بدلا من الاقتصار على المقصود منها خصائص العرض في وسط واحد بعينه. مثال : password too short لا معنى لها نحوياً، بينما password too short تعتبر واضحة ومفيدة أكثر. بالاستخدام الصحيح لخاصية ال CSS على الشاشة، علامات التحذير يمكن أن تكون ظاهرة باللون الأحمر، بخط صغير، لكن عند الطباعة تكون غير ظاهرة، وبالتالي يكون قد فات الأوان لعمل أي شيء حيال ذلك. ربما بالنسبة للأوامر الصوتية يلزم ان تكون مشددة أكثر، مع تخفيض بسيط في معدل الصوت. المثال الثاني هو الترميز الدلالي، بدلا من مجرد العرض ولكنها تخدم الغرضين عندما تقترن في ال CSS.

الوضوح الدلالي

هذا النوع من التجميع واستخدام الدلالات في محتويات الصفحة يمكن تقديمه بشكل واضح لجعل الصفحة ذات وضوح لغوي أكبر. حيث أنه يصعب التكهن بكيفية تطور الشبكة العنكبوتية في السنوات والعقود المقبلة. ان الصفحات التي تم تصميمها قد تبقى قيد الاستخدام حتى الوصول إلى نظام معلومات لا يمكن تخيله على الشبكة. حتى يومنا هذا، بعض محركات البحث على الشبكة مثل الغوغل ومحركات البحث الأخرى تستخدم خاصية المعالجة بالخوارزميات ذات التعقيد العالي.

إن الشبكة العالمية العنكبوتية (W3C) لسنوات متعددة كانت تدير مشروعا نحويا للشبكة تم تصميمه لجعل الشبكة مفيدة وذات معنى لاستخدام نظام المعلومات في الحاضر والمستقبل.

خلال عملية عملية تصميم الصفحة، يكون لدى المصمم فكرة واضحة عن هدف ومعنى كل عنصر رئيس وعنصر جزئي خلال النص. إذا كانت العناصر المعيارية ل HTML الموجودة تعبر عن المعنى، فإنه يستوجب استخدامها، أما إذا لم تكن موجودة فتكون الأفضلية هنا لاستخدام عناصر ال span وال div بترتيب مناسب واستخدام مناسب للتعريفات، وهذا سيساعد مؤلفيي المستقبل للوصول إلى درجة مناسبة في تنسيق النصوص.

ال Microformat هي حركة يتم الاعتماد عليها في بناء فكرة الطبقات اللغوية، مثال : هذه الحركة أو البرنامج قد يكون لديها القدرة أوتوماتيكيا على إيجاد عنصر مثل 123-456-7890 وذلك لإتمام عملية اتصال هاتفي اوتوماتيكي.

الدخول بواسطة شفرة

عندما يتم استلام ترميزة HTML أو XHTML من قبل متصفح للشبكة هناك احتمال ان تحتاج الشفرة المتواجدة عن المتصفح ان تبحث في الترتيب الداخلي لصفحة الويب,

يعود سبب ذلك إلى أنه يوجد لدى المستقبل أو المتصفح صيغة JavaScript ينتج عنها عمل ديناميكي مستمر يؤثر على الصفحة التي تم استقبالها.. مثال : إذا تم تحريك مؤشر الماوس فوق رابط “Buy now” وهو يستخدم للتسعير فإن هذا يعني ان هذا الجزء من الصفحة قد أصبح مفعلاً، شفرة JavaScript تسطيع القيام بذلك، لكن قبل ذلك يجب تعريف معامل التسعير وذلك لعمل ترميز له وجعله فعالأً، في هذه الحالة، الترميز التالي يكفي لهذه العملية:

$45.99

مثال آخر على هذا الموضوع وهو تقنية برمجة Ajax حيث أن الضغط على رابط هايبر تكست قد يفعل شيفرة JavaScript لتقوم باسترداد النص لسعر جديد ليتم عرضه مكان السعر الحالي الموجود في الصفحة بدون الحاجة إلى إعادة تحميل الصفحة كاملة، عندما يصل السعر الجديد إلى السيرفر أو مقدم الخدمة يجب على ال JavaScript ان يقوم بتحديد المنطقة المعينة في الصفحة لتبديل المعلومات القديمة بمعلومات جديدة.

هناك مثل آخر يعتبر أقل شيوعاً لكنه بنفس الأهمية للدخول إلى الصفحة النهائية ويتم فيه استخدام عناصر ال span وال div في نفس الصفحة وذلك يتضمن استخدام أدوات فحص اتوماتيكية. في حالة ال HTML التي يتم تشغيلها ديناميكياً، هذا قد قد يتضمن استخدام أدوات فحص اتوماتيكية مثل HttpUnit، وعنصر من عائلة xUnit، حيث يقوم بتحميل أدوات فحص مثل JMeter عند تقديمها لمواقع form-driven.

الإفراط في الاستخدام

أن الاستخدام الحكيم لل div وال span يعد استخداما حيويا في مجال ترميز ال HTML وال XHTML، إن الاستخدام المفرط لهذه العناصر يدعى في بعض الأحيان (divitis) (خطأ شائع عند المبتدئين)، حيث تعد شكلا بسيطا من اشكال ال tag soup.

مثال على ذلك: عندما يكون لدينا سلسلة من البنود المترابطة تركيبيا ونحويا، وهذه البنود تحتاج إلى تشكيل خارجي وحاويات عناصر ومن ثم حاويات لكل عنصر على حدة، يكون هناك قائمة متنوعة من التركيبات المتوفرة في HTML، أحد هذه القوائم المفضلة والمعمولة ذاتيا وهي تشكيلة من عناصر ال div وال span.

مثال :

• Main page
• Contents
• Help

\

يتم استخدامه عادةً لهذا الغرض

Main page 
Contents 
Help 

هناك أمثلة من التنسيق الجزئي تعتبر استخدام جيد لعناصر ال div وال span بالنسبة لترتيب التصنيفات لأغراض دلالية.

مثال آخر على الاستخدامات الدلالية في ال HTML غير عناصر ال div وال span فيما يتضمن استخدام عناصر ال fieldset لتقسيم نموذج للشبكة، استخدام عناصر ال legend لتعريف مثل هذه التقسيمات واستخدام ال lable لتعريف نموذج عناصر الإدخال أكثر من ال div وال span أو عناصر القائمة المستخدمة لهذا الغرض.

انظر أيضاً

• لغة ترميز النص الفائق
• صفحات الطرز المتراصة
• البيانات الحرفية
• جافا سكريبت