مع النشر المستمر لمعايير WEB في الصين، أصبحت مفاهيم مثل فصل سلوك الأداء الهيكلي، والنمطية، والدلالات، والتدهور الأنيق أيضًا عناصر مهمة لتقييم فهم موظفي الواجهة الأمامية لمعايير WEB، بسبب التأثير نظرًا للقيمة التجارية وراء تحسين محركات البحث، فقد حظيت "الدلالة" باهتمام كبير باعتباري عاملًا جديدًا في الواجهة الأمامية، كنت أعتقد ببساطة أن "الدلالة" هي طريقة لتنظيم (x) بنية HTML باستخدام العلامات الأكثر فائدة لمحرك البحث. وزن.
بعد قراءة العديد من الكتب الأمامية والعديد من المقالات التي كتبها أسلافي، بدأت أدرك ضحالة وعيي وأدركت ببطء قيمة "الدلالة". المحتوى التالي ما هو إلا ملخص للممارسة الشخصية في الحياة اليومية فهو يجمع آراء العديد من كبار السن ويقف على أكتاف العمالقة من أجل رؤية المزيد.
ما هو "الدلالي"
ويشير مصطلح "الدلالي" إلى قدرة الآلات على البحث وجمع المعلومات بتدخل بشري أقل، مما يجعل صفحات الويب مفهومة بواسطة الآلات ويستفيد منها البشر في نهاية المطاف. على وجه التحديد، لاستعارة تفسير شائع من أحد مستخدمي الإنترنت في منتدى BI، "المعنى الدلالي يعني عدم معاملة صديقتك كصديقة عادية." فيما يلي مثال بسيط لنموذج XML:
ومع ذلك، من خلال التحكم في CSS، يمكننا بسهولة عرض "صديقة" مثل "الأصدقاء". لا تزال تؤكد على "الدلالة"، والتي سيتم مناقشتها بالتفصيل أدناه.
المعنى الدلالي
1. محرك البحث
فيما يتعلق بتحسين محرك البحث، قدم العديد من كبار السن بالفعل تفسيرات غنية حول وزن Hx والنص المخفي وما إلى ذلك، لذلك لن أخوض في التفاصيل هنا منذ بعض الوقت، حيث تم استخدام برنامج يسمى Wolfram (http://www.wolframalpha لقد جذب محرك بحث .com/) الانتباه. ونحن نعلم أن Google ستقوم بفرز نتائج البحث وفقًا لقيمة العلاقات العامة لكل موقع ويب. تمتلك محركات البحث الأخرى أيضًا خوارزميات مستقلة خاصة بها، ويدعي Wolfram أنه "يفهم" محتوى إدخال المستخدم أصدر حكمًا بناءً على الفرضية عندما أدخلت "من هو أدريان"، أعطاني ولفرام مثل هذه التعليقات، على الرغم من أن النتيجة لم تكن دقيقة جدًا.
فيما يتعلق بالعمل الأمامي، أليس "الدلالي" الذي نعجب به هو مجرد السماح لأجهزة الكمبيوتر بفهم المحتوى الخاص بنا؟ بمثال بسيط مثل <acronym title="World Wildlife Fund">WWF</acronym>، يمكن للكمبيوتر أن يفهم أن WWF يستحق أن يكون الصندوق العالمي للحياة البرية، وليس المنتدى العالمي للمياه، ومن غير الواقعي أن يفعل الكمبيوتر ذلك تمامًا فهم المحتوى الذي نقدمه نعم، على الرغم من أن محركات البحث مثل ولفرام قد تكون قصيرة العمر، إلا أن الرؤية التي تسعى إلى تحقيقها، والتي تجعل المعرفة العالمية قابلة للحساب، تستحق بالفعل سعينا.
2. تجربة المستخدم
لنأخذ مثالاً أولاً. ما يلي هو نموذج تسجيل المستخدم على Dangdang.com (https://login.dangdang.com/Register.aspx)، وقد تم اعتراض جزء من بنية XHTML.
دعونا نختبر ما سيحدث إذا قمنا بتغيير <span class="span_n">تعيين اللقب:</span> إلى <label class="span_n" for="txtNickName">تعيين اللقب:</label>.
عندما ينقر الماوس على "تعيين اللقب"، فإن مربع إدخال النص الذي يحمل اسم المعرف "txtNickName" سوف يكتسب التركيز تلقائيًا. تعريف تسمية التسمية نفسها هو تحديد تسمية (علامة) لعنصر التحكم (http://www. w3school.com.cn/tags/tag_label.asp)، تتمتع جميع المتصفحات السائدة بشكل أساسي بنفس الدعم للتسمية، ويعتبر عنصر التحكم في النموذج في المتصفح نفسه عنصر تحكم تفاعليًا ناضجًا جدًا، بعد الاختبار بواسطة بطل في مجموعة غابة CCS فعالة جدًا لعمليات التحكم الصوتي وهي أيضًا تجربة جيدة جدًا.
نفس الشيء هو Dangdang.com، لا تزال قائمة المنتجات الموجودة على الصفحة الرئيسية عبارة عن جزء صغير من كود XHTML
الكود الذي تم اعتراضه هو جزء السعر. بغض النظر عن اسم الفئة، دعنا نجرب ما إذا قمنا بتغيير "span class = "del Gray s10""￥94.00 "/span" إلى "del class = "del Gray s10" date = ". ” cite=””》￥94.00《/del》《ins》￥46.00《/ins》، لا يوجد تغيير مرئي، ولكن عندما نركض عاريا حول الصفحة.
النتائج واضحة، كعاملين في الواجهة الأمامية، نحتاج أيضًا إلى مراعاة أن سرعة الإنترنت للمستخدم قد تكون بطيئة جدًا (ربما يستخدم Thunder BT)، مما يؤدي إلى عدم القدرة على تحميل CSS، بالإضافة إلى حالة الهاتف المحمول. المستخدمين، واختيار العلامة المناسبة، تكلفة العلامات منخفضة للغاية، كل ما عليك فعله هو إضافة بعض المعرفة الأساسية بـ HTML، بالإضافة إلى ذلك، تعد سمة التاريخ وسمة الاستشهاد مفيدة جدًا.
هناك أيضًا أهمية السمة alt لعلامة abbr وعلامة img لقارئات الشاشة، نظرًا لأن الظروف لا تسمح بذلك، لا يمكنني تجربتها شخصيًا على الجانب الآخر من الساحل، يوجد بالفعل شيء مثل القسم 508 حماية الأشخاص ذوي الإعاقة من النظرة الاحتقارية من قبل المواقع الحكومية.
3. كفاءة التطوير
إن بنية صفحة الويب الغنية بالدلالات لها تأثير كبير على التطوير المبكر وإصلاح الأخطاء لاحقًا، وعلى وجه التحديد، فهي تشبه رمز قائمة المنتجات البسيط التالي.
من خلال العلامات "الدلالية"، يتم إثراء "الخطافات" في قائمة المنتجات عن طريق إضافة معرف وتسمية الفئة إلى الطبقة الأصلية، ويمكن التحكم في الأداء العام في قائمة المنتجات لتعديلات النمط، في ظل ظروف مثالية، ويمكن تجنب التغيير ومع ذلك، عند العودة إلى الواقع ومواجهة الاحتياجات المختلفة للمنتجات والرؤساء، لا يزال من غير الواقعي تغيير النمط تمامًا عن طريق تعديل CSS على نطاق واسع الاحتياجات والأخطاء، فإن أفضل طريقة هي حجز "خطافات" للصفحة بشكل معقول في مرحلة التطوير المبكرة لتسهيل التعديل والاستخدام لاحقًا، وفي هذا الوقت، تعد العلامات الدلالية الغنية عملية تمامًا.
بالنسبة للتعاون الجماعي، يمكن للمعرف الدلالي وتسمية الفئة أن يجعل الهيكل واضحًا لكل فرد في الفريق. فقط تخيل أن التسمية ذات الفئة الحمراء قد تم تغييرها إلى اللون الأزرق بسبب التغييرات في المتطلبات، ويمكنك فهم سبب الحاجة إلى التسمية الدلالية.
في المناقشات السابقة حول التنقيط والأطر، قادنا إلى التفكير في اصطلاحات التسمية. ما يلي هو مجرد مناقشة لطرق التسمية ولا تتضمن تأثير العوامل الأخرى. لقد تعرفت مؤخرًا على مجموعة كاملة من التخطيطات أعتقد أن معظمهم عندما اتصلوا بها لأول مرة، كانوا جميعًا مثلي، وشعروا بالدوار بسبب هذا النوع من الأسماء، مثل "area_01" و"layout_01" وما إلى ذلك. لأنهم لم يختبروا الحجم الكبير من قبل. حجم المشاريع التي يتولى الفريق تنفيذها الآن، لذا فهم غير متأكدين مما إذا كانت هذه الطريقة مناسبة أم لا، ولكن هناك شيء واحد مؤكد، وهو أن هذا يزيد من تكلفة التعلم للأشخاص الجدد، وبالنسبة للتطوير المستقبلي، أعتقد أن هذه الطريقة مناسبة. مرغوب فيه أيضًا، على المدى الطويل، والغرض منه أيضًا هو تحسين كفاءة الفريق والحد من الصراعات، وأعتقد أن هذه هي الطريقة التي ظهرت بها YUI وBlueprint و960 Grid System تخمين، وآمل أن يتم تأكيده في المستقبل.
4. معايير الصناعة
هناك ألف هاملت لألف شخص، وبالمثل، يمكن لألف واجهة أمامية أيضًا كتابة ألف صفحة بنفس الأداء ولكن بهياكل مختلفة. هذا هو بالضبط الوضع الحالي في إعادة بناء الصفحة، من خلال CSS، يمكننا التلاعب بجميع الجوانب عناصر الصفحة حسب الرغبة، لكن القليل من الناس ينتبهون إلى بنية HTML الأساسية، فمن ناحية، السبب هو عدم وجود دلالات لعلامات HTML. العلامات الجديدة في HTML5 تحل هذا الجزء من المشكلة إلى حد ما أعتقد أن السبب الآخر هو عدم اهتمام المؤلف بأساسيات لغة HTML، كما قال غوي جي: "ينظر الشخص العادي إلى الباب، وينظر الخبير إلى الإثارة". إذا كنت تريد أن تحدث فرقًا في هذه الصناعة، فإن التخصص أمر لا بد منه، وهذا يعني أنه إذا كنت لا تعتبر نفسك تطورًا، فلا داعي لمناقشة مسألة "الدلالة".
الهدف من "الدلالة" هو تحقيق معايير موحدة. الإنترنت المستقبلي "يجب أن يكون إنترنت مفتوحًا. لن يكون الأمر كما هو الحال الآن حيث لا يمكن للبيانات أن تتدفق دون عوائق وهناك عدد كبير من جزر المعلومات والنقاط العمياء للمعلومات." ستتم مناقشة الممارسات الجيدة والواجهات المفتوحة والمحتوى المشترك بالتفصيل أدناه.
الممارسة الدلالية
في المحتوى أعلاه، تم تتخلل معظم المحتوى العملي، وهنا مقدمة موجزة.
1. هيكل الوثيقة
إن أبسط طريقة "لإضفاء الدلالة" هي البدء بالبنية، واختيار العلامات التي تتوافق بشكل أفضل مع معنى المحتوى، ومراجعة "الدليل الموثوق لـ HTML وXHTML" مرة أخرى، والتفكير أكثر في معنى المحتوى بدلاً من مجرد التفكير إصدار الأحكام بناءً على عروض الصفحة. في كثير من الأحيان، سنواجه مثل هذا الموقف، لكي نرى تأثيرًا بسيطًا، من أجل متابعة دلالات معقولة، علينا أن نختار حلاً ليس من السهل تنفيذه. أعتقد أن هذا أيضًا هو ضمير العامل الأمامي فيما يتعلق بمعايير الويب وفهمه للعمل وكيفية اتخاذ خيارات متوازنة، كما أن لدى Realazy فهمًا عميقًا للغاية (http://realazy.org/blog/2009/06 /29/مهندس مقابل عالم/).
في مرحلة ما قبل الإنتاج، يمكنك أيضًا التفكير في الوضع المستقبلي وحجز روابط للصفحة بناءً على دلالات المحتوى. بالطبع، يجب تحليل المشكلات المحددة بالتفصيل وفقًا لمتطلبات المشروع المختلفة، ويجب أن يكون التطوير المعتمد مرنًا وقابلاً للتكيف، على سبيل المثال، بالنسبة للصفحات الخاصة الترويجية، نظرًا لأن الحاجة إلى تعديلات لاحقة ليست كبيرة، في ظل الفرضية الأساسية للاجتماع سهولة الاستخدام وإمكانية الوصول، يجب اعتماد التطوير. يركز وضع التطوير السريع على استعادة تأثير مسودة التصميم، ولكن بالنسبة لتأثير مواقع الويب الكبيرة، من الواضح أن المتطلبات مختلفة.
2. قواعد التسمية
تظهر أنظمة التسمية القياسية للمعرف والفئة من وقت لآخر على الإنترنت. المبدأ العام هو التسمية وفقًا لمعنى المحتوى. دعونا نستعير صورة من الإنترنت.
إذا كنت تريد تغيير موضع الشريط الجانبي، فأنت تحتاج فقط إلى تعديل CSS دون تغيير بنية صفحة الويب. بالنسبة لوحدات الصفحة التي تحدث بشكل متكرر، أوصي شخصيًا بتكوين اصطلاح التسمية الخاص بك تدريجيًا أثناء عملية التطوير، مثل الرأس/التذييل. /main/hd/bd /nav/box/mode، وما إلى ذلك، استخدم الواصلات "-" أو حالة الجمل لتشكيل أسماء أكثر تعقيدًا، مثل site-nav/quick-menu/ SecondaryContent/.
ولكن بالعودة إلى الموقف المحدد، يجب على المشاريع المختلفة أيضًا اختيار طريقة التسمية وفقًا للحالة المحددة، ويجب استخدام قواعد تسمية مختلفة معًا، حيث تعد مواقع الويب الكبيرة، مثل تاوباو، أكثر ملاءمة لاستخدام مزيج من التنقيط والتسمية الدلالية. بالنسبة لتعديل نمط الصفحات، يمكن إجراء التعديلات المقابلة بسرعة وسرعة. بالنسبة للإنتاج، يمكن تجميعها معًا بسرعة بالنسبة لمعظم الصفحات الفردية من نوع الإعلان، أوصي شخصيًا باستخدام التسمية المنظمة. يمكن لمنشئ الصفحة إكمال الصفحة بسرعة وسهولة. بدلاً من قضاء الكثير من الوقت في التفكير في التسمية،
3. التنسيقات الدقيقة
Microformat هي طريقة جديدة لتضمين البيانات المنظمة في كود XHTML القياسي. ببساطة، تستخدم مجموعة من معايير تسمية الفئات للإعلان عن محتوى المستند. يبدأ فهم معظم الأشخاص للتنسيقات الدقيقة بـ hCard، فيما يلي مثال بسيط لـ hCard (http://www.oppenheim.com.au/) هذا هو hCard الذي تم تطبيقه على التذييل بواسطة James Oppenheim.
من بينها، يتم إنشاء جميع أسماء فئات منطقة المنطقة المحلية vcard url fnعطى-اسم adr لتنسيق التنسيقات الصغيرة. يجب أن تلاحظ أيضًا أنه تتم إضافة العديد من علامات الامتداد لإضافة أسماء الفئات. إذن ما هي أهمية التنسيقات الدقيقة؟ من خلال المكون الإضافي للمشغل لمتصفح Firefox، قمت بتصدير بطاقة العمل الخاصة بي من سيرتي الذاتية (http://adriancheng.name/resume.html)
يمكنني استيراد ملف vcf الذي تم تصديره إلى عملاء البريد الإلكتروني المختلفين كمعلومات اتصال، أو استيراده إلى دفتر العناوين في الهاتف المحمول (http://tommyfan.com/blog/skill/add_phone_from_hcard/) ويمكن ملاحظة ذلك من خلال التنسيق المصغر يمكن للعملاء المختلفين معالجة البيانات في صفحات الويب. إن دور التنسيقات الدقيقة في هذا الوقت مشابه أيضًا لواجهة برمجة التطبيقات في صفحات الويب. بالطبع، تتمتع التنسيقات الدقيقة برؤية أوسع لمعايير التنسيق الأخرى تفضل بزيارة http:///microformats.org/ تعرف على المزيد.
خاتمة
يمكن القول أن ممارسة "الدلالة" هي الجزء الأساسي من الواجهة الأمامية، ولكن لأسباب مختلفة، تم إساءة فهمها أو تجاهلها ولم تحظ بالاهتمام الذي تستحقه هذه المقالة لفرز المرحلة الماضية من تراكم التعلم، وآمل أن تعطي جميع القراء بعض التفكير حول معايير الويب.