Table of Contents
مقدمة: تحدي الملاحة الهندسية
ويخدم الموقعان الهندسيان غرضين اثنين: يجب أن يقدما معلومات تقنية معقدة بوضوح، وأن يسترشدا أيضاً بمهندسي مختلفين، ومديري المشاريع، وأخصائيي المشتريات، والطلاب، والمستثمرين - إلى الموارد المناسبة بسرعة، ويمكن لنظام الملاحة غير المنظم أن يدفن البيانات الحيوية، ويضع الإحباط، ويقوّض في نهاية المطاف مصداقية الموقع، ويستلزم بناء هيكل ملاحي غير ملائم لهذه المواقع اتباع نهج منهجي يوازن بين المحتوى وبين سهولة الوصول.
فهم احتياجات المستخدمين والمعالجين
وقبل رسم قائمة واحدة، يجب أن تستثمروا في فهم من هم مستخدموكم وما يتوقعونه، وتجتذب المواقع الهندسية على الشبكة زواراً ذوي أهداف مختلفة على نطاق واسع، ولدى مهندس مدني يبحث عن مواصفات الحمل نموذج عقلي مختلف عن نموذج يقوم به زبون يقيِّم حافظة مشاريع الجسر التي تقوم بها شركة ما، كما أن أساليب البحث التي يقوم بها المستعملون، وتحليل المهام، وعمليات التحليل التي يجري استعراضها - غير مستوعبة لهذه الاختلافات.
الفصل وتحليل المهام
إنشاء أشخاص مستعملين على أساس الدور والصناعة ومستوى الخبرة التقنية، وبالنسبة لكل شخص، يرجى ذكر المهام الخمس الأولى التي يتوقعون إنجازها في موقعكم، ويمكن أن تشمل المهام المشتركة ما يلي:
- البحث عن المواصفات التقنية أو صحائف البيانات
- مشاهدة المشاريع المنجزة حسب الصناعة أو الموقع
- تحميل ملفات مركز التحقيقات الجنائية أو نماذج 3D
- الاتصال بخبير في الموضوع
- قراءة دراسات الحالة أو الأوراق البيضاء
ويكشف رسم هذه المهام على مضمونكم الحالي عن وجود ثغرات ويساعد على إعطاء الأولوية لأصناف الملاحة، فعلى سبيل المثال، إذا توصل العديد من المستعملين إلى البحث عن " تقارير الاستدامة " ، ولكن هذا المصطلح لا يظهر إلا في إطار " مسؤولية الشركات " ، فإن لديك مشكلة في الاكتشاف.
اختبارات القلب والشجرة
وتتفهمون كيف يتعامل المشاهدون مع مواضيع المجموعات الطبيعية، وقد يضخ مهندس " الممتلكات المادية " و " تحليل الإجهاد " و " بيانات الوكالة المالية الدولية " تحت " الموارد التقنية " ، بينما قد يتوقع العميل نفس الموارد تحت " دعم المشاريع " ، وتثبت اختبارات الأشجار ما إذا كان الهيكل الهرمي الناتج يتيح للمستعملين العثور على مواد دون رؤية واجهة.
هيكل المحتوى
فالهرم الهرمي الواضح والمنطقي هو العمود الفقري للملاحة غير الملائمة، وكثيرا ما تتضمن المواقع الهندسية آلاف الصفحات؛ وبدون هيكل عميق، يضيع المستخدمون في قائمة مسطحة، ويبدأون بتحديد تصنيف أعلى مستوى يعكس الهيكل الداخلي للمنظمة ونماذج عقلية المستخدمين.
مراكز التقييم الرفيعة المستوى
:: قصر بنود الملاحة الرئيسية على خمسة إلى سبعة بنود، وتشمل الأقسام النموذجية من أعلى المستويات للموقع الهندسي ما يلي:
- المشاريع - أبرز المواضع، دراسات الحالات، مغالطات المشاريع
- Solutions] — Industry-specific offerings, services, capabilities
- Technical Resources] - صحائف البيانات، الأدلة، المعايير، أدوات الحساب
- About] - لمحة عامة عن الشركات، والقيادة، والتاريخ، والثقافة
- Careers] — Job openings, internship programs, employee stories
- Contact] - Office locations, inquiry forms, expert directors
Each top-level category should have no more than three levels of subnavigation. Beyond that, consider using search or faceted filtering instead of deeper menus.
الإحالة والتفاهم
نادراً ما يُدخل المحتوى الهندسي في فئة واحدة، ويمكن لصفحة من المشاريع أن تشير إلى الوثائق التقنية، ويمكن أن تناقش ورقة بيضاء حلولاً متعددة، وأن تنفذ نظاماً للعلامات يتيح للمحتوى أن يظهر في مسارات ملاحية متعددة، مثلاً، يمكن العثور على دراسة حالة عن إعادة استخدام الجسر في كاليفورنيا في إطار مشاريع > نقل و[Fctuents:2]
تصميم واجهة الملاحة
ومع وجود هيكل هرمي قوي للمحتوى، تركز على عناصر الوصل التي تقدم هذا الهيكل إلى المستعملين، والهدف هو جعل عمق الموقع يشعر بالضجر بتوفير علامات واضحة في كل مرحلة.
الملاحة الأولية (ماين مينو)
وينبغي أن تكون القائمة الرئيسية قابلة للفحص المستمر من كل صفحة ومقياس مسموع عبر الأجهزة، وأن تستخدم بطاقات وصفية وغير تقنية عند الإمكان، فعلى سبيل المثال، فإن " الموارد التقنية " أكثر وضوحاً من " قاعدة Knowledge " أو " حمولات مثبتة " .
الملاحة الثانوية
وبالنسبة للأقسام العميقة )مثلا مكتبة بحث تضم مئات الورقات(، أو الملاحة الثانوية مثل الحيز الجانبي الأيسر، أو الألواح المزدوجة، أو قائمة الطعام الأكورديون تعمل جيدا، مما يبقي الوجبة الرئيسية في الوقت الذي يعطي فيه للمستعملين خيارات السياق، وكثيرا ما يكون للمواقع الهندسية أثر " أنت هنا " يستكمل في المنطقة الثانوية ليظهر الفرع الحالي.
اصابع الخبز
وتُعد البقعة أساسية للمواقع الهندسية المعقدة، وهي تقلل من الارتباك عن طريق عرض المسار من صفحة الاستقبال وتسمح للمستعملين بالعودة إلى فئة الوالدين، وتستخدم أسلوب " الموقع " (مثلاً، شركة " المشاريع " للنقل " جسر البوابة الذهبية) وتتجنب استخدام الشفرات كبديل عن التسلسل الهرمي السليم للملاحة، فهي تحمل تكلفة تكميلية.
الملاحة الجوية
- البحث عن وصلات منفصلة للمرافق - البحث، واختيار اللغات، وقطع الدخول في الحسابات، والاتصال بالمحتوى، ووضعها في حانة عليا فوق القائمة الرئيسية، والبحث أمر بالغ الأهمية؛ وكثيرا ما يتعدى المستخدمون الهنديون على النسيج كليا عن طريق البحث عن أرقام جزئية، أو أسماء المشاريع، أو المعايير، ويجعلون البحث بارزاً ويدعمون مرشحات متقدمة.
الملاحة الردية والمتنقلة
:: زيادة نسبة المهنيين في المهندسين الذين يطلعون على المواقع الشبكية على الأقراص والهواتف - على مواقع البناء، أثناء عمليات التفتيش الميدانية، أو بين الاجتماعات، ويجب أن تعمل الملاحة بحرارة عبر الشاشات.
Mobile Patterns
" قائمة الهامبرغر " )ثلاثة خطوط أفقية( هي أكثر النمط النقالة شيوعا، ولكنها تستطيع إخفاء الملاحة الثانوية، أما بالنسبة للمواقع الهندسية ذات الهياكل العميقة، فتنظر في نهج للإفصاح التدريجي: تبين القائمة الرفيعة المستوى في درج قابل للتلف، ثم تكشف عن فئات فرعية مع صنبور، وتضمن أن الدرج لا يحجب المحتوى عندما يكون مفتوحا.
- Mega menu on tablet] - A two-column layout that shows categories and children side by side
- Persistent bottom tab bar] - For sites with few primary sections, a fixed tab bar can keep core actions accessible
- In-page anchor navigation] - For long technical documents, use sticky jump links that scroll to sections
Touch Targets and Gestures
ويجب أن يكون لجميع عناصر الملاحة أهداف لمسية لا تقل عن 4444 بيكسل (توصية الفريق) أو 48 كيلو48 بيكسل (تصميم المواد في غوغل) وتفادي الاعتماد على قطرات مرتكزة على هوافر؛ وتفشل في الاتصال، وتنفيذ النقر إلى الفتح لشركات فرعية، وتوفير زر مرئي قريب يمكن أن تعمل لفتات النوافذ على عصي العجلات ولكن لا يمكن الاعتماد عليها.
أجهزة الملاحة المتقدمة للمحتوى الهندسي
فبعد الرماد والخبز، يمكن أن تؤدي الأنماط المتقدمة إلى تحسين كبير في إمكانية اكتشافها.
Mega Menus
ويوسع قائمة ميغا عدد مرات الانقطاع بحيث تظهر عدة أعمدة من الروابط، وأحياناً بالنص الوصفي أو الصور، وهذا مثالي للمواقع الهندسية التي تضم فئات فرعية عديدة (مثلاً " الحلول " قد تكون لها أعمدة " البنية " ، و " الانهيار الجغرافي " ، و " البيئة " ، و " إدارة التعليمات " ).
البحث المرئي والتخزين
وبالنسبة للمجموعات الكبيرة من الوثائق التقنية أو دراسات الحالات الإفرادية للمشاريع - التي تحل محل المبردات التقليدية بالتفتيش المواجه - يمكن للمستعملين أن يرشوا حسب نوع المواد أو الصناعة أو السنة أو المنطقة، وهذا النمط شائع في مواقع التجارة الإلكترونية ولكنه يستخدم بصورة متزايدة في البوابات الهندسية، ويدمج النتائج المصاحبة للملاحة الرئيسية: عندما يُختار المستخدم " المشاريع " أو "
Site Map Pages
وفي حين أن صفحة خريطة موقعية يمكن الوصول إليها ليست طريقة رئيسية للملاحة، فهي لا تقدر بثمن بالنسبة لمستخدمي الطاقة وللمكتب الإقليمي، وتشمل وصلة في القدم تفتح صفحة بها التسلسل الهرمي الكامل في قوائم قابلة للتوسع، كما تساعد على فهرسة محركات البحث، كما أنها تمثل هبوطا في متعاطي المواصلات التفاعلية.
منظمة " الهرمية " و " كوي "
فالهواء هو أكثر من ربط التصميم النصي - البصري الذي يسترشد به العين ويورد الأهمية.
Icons and Symbols
ويمكن لليوندس أن يسرع في الاعتراف، ولا سيما فيما يتعلق بالمحتوى التقني، كما أن هناك جهازاً مستعملاً مستعملاً يستعمله " سيرفيتس " ، وجهازاً مصمماً ل " المشاريع " ، ووثيقة " الموارد " ، يساعد المستعملين على الفحص السريع، ويستخدم الرموز المعترف بها عالمياً ويختبرها مع الجمهور - أيقونات يمكن أن تكون منطقية للمهندسة بالنسبة للعملاء، كما أن تكون مشفرة للزكية، وتدرجون دائماً دائماً في النص دائماً في النص مع الزبائن، كما أن يُه دائماً، ولا يُدرجون بطاقات النص على بطاقات النص مع بطاقات النص مع غيره.
Color and Typography
وينبغي أن يكون لون الاستخدام تمييزاً بين الملاحة الأولية وبين الملاحة الثانوية لون مميز (مثلاً، الأزرق الأسود على الأبيض) يظل متسقاً في الموقع، حيث أن مؤشرات الصفحات النشطة - أي لون خلفي مختلف، أو خط تحت، أو تغيير اللون - تجعل الموقع الحالي للمستعمل واضحاً، أما بالنسبة للطباعة، فيكفل أن يكون النص الموصلات مرئياً بما يكفي (يوصي الفريق الاستشاري المعني بالربطة Avoiding، وهو أكبر من خطوط الملاحة المتنقلة).
الدول العاملة والتغذية
وينبغي أن يقدم كل نقرة أو نقر على عنصر الملاحة تعليقات فورية، فالتغييرات البصرية - تغيير اللون، وتصوير مبسط، وبيان موجز يؤكد أن الإجراء قد سُجل، وبالنسبة للتسرب، يُقلل التوسع من أجل الإبلاغ عن التحول، ولكن يُبقي المدة التي تقل عن 300 ميلي ثانية للحفاظ على السرعة.
الاعتبارات المتعلقة بإمكانية الوصول
ويجب أن يكون الملاحة صالحة للعمل من جانب جميع المستعملين، بمن فيهم من يستخدمون أجهزة قراءة الشاشة أو الملاحة على اللوحات أو مراقبة الصوت، وكثيرا ما تخدم المواقع الشبكية الهندسية جمهورا عالميا يشمل المستخدمين ذوي الإعاقة؛ وتتجاهل مخاطر الوصول وتستبعد المواهب القيمة.
Semantic HTML and ARIA
(ب) استخدام عناصر HTML التي تنقل معناها: ) العناصر تغلف مناطق الملاحة، و الهياكل تمثل بنوداً قائمة، وبالنسبة للتسريح، تنطبق و] على المناطق التي يمكن تحديدها، وضمان أن يُدرج مستعملو اللوحات الرئيسية من خلال أصناف مصغرة وضواحيّة، مع فضاءة، مع فضاء.
Skip Links and Landmarks
Provide a “Skip to main content” link as the first focusable element. Use landmark roles like , , and ] to help screen readers jump between sections. Keep navigation landmarks unique (e.g., “Main navigation” vs. “Secondary Sea”).
ألف - إدارة التركيز
عندما تفتح قائمة ميدالية أو موسعة، تنقل التركيز على أول بند داخلها، وعندما تغلق، تركز العودة على مشغل القائمة، وتختبر مع قارئين حديثين مثل NVDA وJAWS و VoiceOver.
الاختبارات والملاحة
وحتى أفضل الملاحة التي يتم تصميمها ستكون لها عيوب لا تكتشف إلا من خلال الاستخدام الحقيقي، فالاختبارات والتحسينات المستمرة أمران أساسيان.
اختبار القابلية للاشتعال
تعيين مشاركين من الجمهور المستهدف (المهندسون، العملاء، إلخ) وطلب منهم أداء مهام محددة باستخدام ملاحتكم، وتسجيل ما يتخذونه من خطوات، وما إذا كانت ناجحة، وفحص الهياكل المختلفة للملاحة - مثلاً، قائمة مصغرة مقابل هبوط بسيط - لمعرفة ما يؤدي إلى إنجاز المهمة على نحو أسرع.
التحليلات وأجهزة التحلل
وتكشف أدوات مثل محللي غوغل أو هوتجار أو موسى حيث يضغط المستعملون ويقفزون ويسقطون ويبحثون عن أنماط مثل " نقرات الغضب " (نقرات متكررة مكررة على عنصر لا يُمكن التنبؤ به) أو ارتفاع معدلات المكافأة في صفحات عميقة في التسلسل الهرمي، وإذا ما فتح المستخدمون صفحة " كونت " من صفحة " أرضية " ، فإنهم ينظرون في إضافة صفحات اتصال بارزة مباشرة.
Research Log Analysis
فاستفسارات البحث هي عبارة عن صورة ذهبية لبصيرة الملاحة، فإذا ما سعى المستخدمون مرارا إلى مصطلح موجود في الملاحة ولكن يصعب العثور عليه، فإن بطاقة القائمة أو الهيكل بحاجة إلى تعديل، مثلا، إذا بحث العديد من المستعملين عن " نسب كبيرة " ، ولكن هذا المحتوى مدفون تحت " النواتج " بيانات تقنية " ، أو يعاد تسمية بند القائمة إلى " سبيكات التقنية " أو يخلق وصلة بارزة إلى صفحة المعدات.
الترميم الإصطناعي
فالهواء ليس مشروعاً لمرة واحدة، إذ أن الجدول الزمني للاستعراضات الفصلية لأداء الملاحة، ومع تزايد المحتوى - وهو خطوط المنتجات الجديدة، والمعايير المستكملة، ودراسات الحالات الإضافية - إعادة النظر في التسلسل الهرمي والتفاعل، واستخدام ما يعمل، والتخلص من ما لا يعمل، والاحتفاظ دائماً بنموذج المستعمل العقلي في المركز.
الاستنتاج: الملاحة كمؤسسة
والملاحة المناسبة هي العمود الفقري لكل موقع هندسي مركب ناجح، وهي تقلل من الحمولة المعرفية، وتبني الثقة، وتسمح للمستعملين بتحقيق أهدافهم دون الإحباط، وتستحق الاستثمارات في بحوث المستعملين، وتهيكل المحتوى، وتصميم وصلات وصلات مستجيبة وميسرة، والاختبار المستمر مع المستعملين الحقيقيين، يمكن للمنظمات الهندسية أن تخلق هياكل للملاحة تكون بمثابة ميزة تنافسية.
For further reading, explore Nielsen Norman Group’s navigation guidelines], the ]WAI-ARIA Authoring Practices for menus, and Smashing Magazine’s inclusive navigation patterns.