التعليق: HTML5 تطوير اتفاقيات التسمية والتنسيقات الصغيرة.
في 29 مايو 2004 ، على مدونتي المتقاعدة وجميع المحادثة الكبيرة ، عندما قمت بمسح 40 موقعًا على مصمم لمشاهدة اتفاقياتها لعناصر الصفحات العامة مثل العناوين واللنزلة والمحتوى والتذييلات (النتائج في ذلك الوقت).
لم يكن ذلك بالكاد بحثًا علميًا ، لكن في يونيو من ذلك العام ، تابعت بعض آراء إريك ماير ونشرت مجموعة من اتفاقيات التسمية. عندما أجد أن موقع الويب قد اجتاز هذه الاتفاقيات التسمية ، يسعدني دائمًا أن أستخدمه كل يوم ، حتى بعد أكثر من 4 سنوات.
يمكن تلخيص أفكاري بهذا
يجب أن تعكس أسماء سمات المعرف والفئة وظيفة أو محتوى العنصر ، وليس المقدمة. لذلك خرجت من الرأس وذهبت إلى العلامة التجارية مرة أخرى ؛ خرجت من التذييل واستبدلت به بموقع.
يجب أن يأخذ التسمية بنية نمط XML تقريبًا. سوف تأخذ تسمية بنية نمط XML تقريبا. لذلك ، يأتي المحتوى الداخلي محتوى محتوى ، محتوى محتوى وعمود محتوى.
هذه الاتفاقيات تخدمني بشكل جيد ، وما أفعله ، بالكاد يغير جوهرها. ليس هناك شك في أنهم جميعًا يجعلون عملي أسرع وأكثر اتساقًا وأكثر فائدة. إنها تسهل بناء المنتجات وزراعة الأشخاص الذين أعمل معهم مع عقلي. مؤتمر التسمية يعمل.
microformat وأسماء السمات ذات الصلة
دعونا نواجه الأمر ، فإن التنسيقات الدقيقة مثل HCARD و HCALENDAR و HATOM وغيرها من المسودات تجلب الكثير من قيم السمات لدرجة أنه من غير الضروري في كثير من الأحيان النظر في ملف البناء أو الخطافات التي يتم توفيرها في نمط CSS لقيم أكثر السمات هذه. الآن يمكنني استخدام Microformats للوصول إلى هذا المستوى الذي لا أستخدم حتى سمات الفصل (باستثناء سمات الفئة التي تصاحب microformat) لتطوير الصفحة بأكملها.
في حالات نادرة ، أحتاج إلى إضافة عنصر جديد (على افتراض أن تقسيم الغرض من التصميم) أنا أفكر أولاً هو ما هو موجود بالفعل في ملحق microformat. سأعطيك مثالًا على استخدام وضع Hatom:
<div class = hentry>
<h2 class = entry-title> title </h2>
<div class = enter-tontent>
المحتوى الرئيسي
</div>
<div class = intenging>
المحتوى ذي الصلة
</div>
</div>
إذا كنت تحافظ على مزايا التنسيقات الصغيرة ، فقد لاحظت أن المرتبطة بالدخول ليس جزءًا من نمط Hatom ، لكن في هذه الحالة ، يجب أن يكون لدي عامل إضافي تمامًا ، كيف يمكنني تشكيل قيمة خاصية مثل sidelinks ذات الصلة؟
متى يبدو أكثر منطقية لتوسيع نمط التسمية لتنسيقات ميكروفات؟
HTML5
في بداية هذا الفصل ، يجب أن أكون بصراحة ، في هذه اللحظة ، لا يمكنني إيلاء اهتمام أقل إلى HTML5. ومع ذلك ، ليس هذا هو مفتاح المشكلة. يقدم HTML5 بعض العناصر الجديدة المفيدة للغاية ، مثل:
قسم
ملف أو قسم طلب عادي. الفصول ، في هذا الصدد ، هي تصنيف موضوع للمحتوى.
شرط
جزء من صفحة مكونة من مقالات تشكل جزءًا مستقلًا من مستند أو صفحة ويب أو موقع ويب. يمكن أن يكون هذا منشورًا للمنتدى أو مقالًا في مجلة أو صحيفة أو إدخال سجل الويب أو تعليقًا مقرفًا للمستخدم أو أي عنصر مستقل آخر من المحتوى.
جانبا
جزء من صفحة مكونة من المحتوى مستقل عن المحتوى المتعلق بالعناصر جانباً ويمكن اعتباره منفصلاً عن المحتوى. غالبًا ما تتجلى هذه الأجزاء على أنها أشرطة جانبية مطبوعة ومطبعة.
نظرًا لأنه كان من المنطقي أن يقوم مخترعو التنسيق الدقيق بإعداد مخططاتهم على المواصفات الحالية ، فمن المؤكد أنه من المنطقي الآن أن أتكيف مع اتفاقيات التسمية الخاصة بي لمتابعة تلك الموجودة في HTML5؟ بالطبع ، لا يمكنني استخدام:
<section>
<h2> العنوان </h2>
<article>
المحتوى الرئيسي
</article>
<جانب جانب>
المحتوى ذي الصلة
</isside>
</القسم>
ولكن الآن يمكنني استخدام قيم السمة المعرّفة والفئة لمساعدتي على دراية بـ HTML5 ، مع أخذ وثائق لي لتوضيح خطوة إلى الأمام نحو ذلك.
<div class = section>
<h2> العنوان </h2>
<div class = article>
المحتوى الرئيسي
</div>
<div class = جانبا>
المحتوى ذي الصلة
</div>
</div>
أعتقد أنها الخطوة التالية المنطقية بالنسبة لي. إذا نظرنا إلى ملف العرض التوضيحي هذا ، فقد أخذت أساسًا لعناصر HTML5 لاتفاقي التسمية. بالإضافة إلى ما ذكرته للتو ، لاحظ أنني حددت الطريق لتصنيف (NAV) ، وإنشاء الحقول مع Colgroup و Col ، وتحويل قائمة غير مرتبة إلى شبكة ، واستخدام DataGrid.
تتضمن مواصفات وضع العلامات في HTML5 أيضًا التفاصيل وحوار الحوار والرقم ، والتي يمكنني أيضًا استخدامها كقيم سمة.
إذا تمكنت من تحقيق رغبة اليوم ، فإن هذه الرغبة هي أن جميع تطوير إطار عمل CSS سيعتمد نفس اتفاقية التسمية (وأيضًا مضمنة على نطاق واسع في تنسيقات صغيرة) بحيث يكون لدى الأشخاص الذين لديهم علامات ذات مغزى و CSS نقطة انطلاق صحيحة لاستخدام أكثر معنى ومنطقية بدلاً من المعرف التمثيلي والفئة.