ابدأ بالمهام وببنية معلومات صغيرة
بنية المعلومات هي كيفية تجميع المحتوى والوظائف وتسميتها وربطها. أدرج مهام الزوار، ثم ارسم خريطة لصفحة بدء كل مهمة، والصفحة التالية، والحالة النهائية الناجحة. هذا يوضح ما إذا كان عنصر القائمة مفيدًا أم مجرد تسمية داخلية يجب على الزوار فك شفرتها. اجعل التنقل الأساسي مركزًا على الأقسام التي تبدأ تلك المهام.
التنقل ليس خريطة موقع. تنصح GOV.UK بإدراج أقسام مستوى أعلى مفيدة بدلًا من كل جزء من الخدمة. عندما تتطلب الرحلة ترتيبًا محددًا، اعرضه في المحتوى أو قائمة المهام بدلاً من جعل الناس يستنتجون ذلك من قائمة عامة.
ضع الصفحات معًا عندما يتوقع الزوار نفس الإجابة أو نفس الإجراء، وليس لأن فريقًا واحدًا يملكها.
استخدم صفحات هبوط وروابط سياقية للتفاصيل بدلًا من رأسية مكتظة.
استخدم تسميات تُنبئ بالوجهة
التسمية هي وعد بما يليها. فضّل الأسماء المألوفة مثل “التسعير”، “الوثائق”، “الحصول على الدعم”، أو “إدارة الحساب” عندما تتطابق مع الوجهة. تجنّب التسميات الغامضة مثل “الموارد” أو “استكشاف” ما لم يتمكن الزوار من التنبؤ بالمحتوى. حافظ على اتساق الصياغة والترتيب.
تنصح Google بنص رابط موجز وملائم يكون مفهومًا خارج سياقه. لا تفعل روابط “اضغط هنا” العامة أو الروابط المحشوة بالكلمات الرئيسية ذلك. امنح عنصر تحكم أيقوني فقط اسمًا قابلًا للوصول يصف إجراءه.
استخدم “عرض الخطط” بدلًا من “معرفة المزيد” عندما تكون الوجهة صفحات الخطط.
علّم الوجهة النشطة بصريًا وبرمجياً؛ تشرح W3C استخدام aria-current=page للصفحة المعروضة.
اجعل الوجهات قابلة للزحف وهيكلية الوضوح
يجب أن تكون الوجهة في العادة عنصر مرساة HTML مع href يشير إلى عنوان ويب حقيقي. تقول Google إنها يمكن أن تزحف عادةً هذا الشكل، بما في ذلك المراسي المُدخلة ديناميكيًا عندما يحتفظ العلامة المعروضة بهذه البنية. معالج النقر أو سمة مخصصة وحدها ليست بديلًا موثوقًا. افحص المخرجات المعروضة، لا مصدر الإطار فقط.
استخدم بنية معنوية حول التنقل الرئيسي. توصي W3C بعنصر nav ولائحة للقوائم في التنقل الاعتيادي للموقع. إذا كانت الصفحة تحتوي على عدة مناطق تنقّل، سمّ كل واحدة حتى يتمكن مستخدم قارئ الشاشة من تمييز التنقل الأساسي عن التنقل في التذييل أو التنقل المحلي.
أكد أن الوجهات المهمة على سطح المكتب والمحمول لها مراسي وقيم href بعد العرض من جهة العميل.
يوفر URL Inspection معلومات عن الزحف والفهرسة وخدمة Google؛ لكنه لا يثبت أن الزوار يمكنهم العثور على صفحة.
صمم قائمة الجوال كتفاعل مكتمل
قد يتقلص التنقل المتجاوب، لكن الوجهات المتبقية يجب أن تحتفظ بنفس الصياغة والترتيب والهدف عبر أحجام الشاشات. تسمح W3C بإخفاء أو طي العناصر في التنقل الفرعي مع الدعوة للاتساق. لا تجعل مسارًا حرجًا مخصّصًا لسطح المكتب فقط لأن الرأس مزدحم؛ انقل المواد منخفضة الأولوية أو أعد التفكير في التسلسل الهرمي.
للقائمة التي تُظهر وتُخفي، استخدم زرًا للتحكم في مجموعة الروابط وتواصل ما إذا كانت مفتوحة. يستخدم مثال disclosure-navigation في W3C aria-expanded وaria-controls ويوثق مفاتيح Tab وShift+Tab وEscape. هو للتوجيه، لذا اختبر مكوّنك مع مجموعات المفاتيح التي يستخدمها جمهورك.
عندما تكون صفحة الأصل وروابطها الفرعية مطلوبة معًا، فرّق بين رابط الصفحة وعنصر التحكم الذي يوسّعها.
أي شيء يُكشف بالحوم بالمؤشر يجب أن يكون قابلاً للاكتشاف بالتركيز عبر لوحة المفاتيح واللمس.
ادعم الاتجاه والتنقل بلوحة المفاتيح
الوصول بلوحة المفاتيح ليس لمسة نهائية. يتطلب WCAG 2.1 Success Criterion 2.1.1 أن تكون الوظائف قابلة للتشغيل عبر واجهة لوحة مفاتيح باستثناء الإدخال المعتمد على المسار. في الرأس، يجب أن يكون بإمكان الزوار التنقل عبر الضوابط باستخدام Tab، رؤية التركيز، تفعيل الروابط والأزرار، والمغادرة بدون وقوع في فخ.
يمكن أن تجعل الروابط المكررة في الرأس الصفحات بطيئة للتنقل. يوفر رابط تخطّي (skip link) بالقرب من البداية مسارًا لمستخدمي لوحة المفاتيح إلى المحتوى الرئيسي. تشرح GOV.UK أنه مخفي بصريًا حتى يفعل استخدام لوحة المفاتيح ظهوره. اختبر أنه يصل إلى هدف ذي معنى.
لا تزل مؤشر التركيز في المتصفح دون بديل واضح يبقى مرئيًا حتى عند التكبير.
استخدم Tab وShift+Tab وEnter وSpace وEscape من الرأس إلى الصفحة الوجهة.
اختبر إمكانية العثور قبل وبعد الإطلاق
اطلب من أشخاص ممثلين إكمال مهمة واقعية، مثل إيجاد إرشادات الإلغاء أو مقارنة الخطط. راقب إلى أين يتوقعون الذهاب، أي تسميات يسئون قراءتها، وما إذا لجأوا إلى البحث لأن التنقل فشل في خدمتهم. لا تقودهم إلى التسمية المقصودة. سجّل كل عائق وأصغر تغيير من المحتمل أن يزيله.
زاوج اختبار المهام مع فحوص تقنية. توصي W3C’s Easy Checks بالاختبار بدون فأرة، بما في ذلك رؤية التركيز، ترتيب التبويب، فخاخ لوحة المفاتيح، والقوائم المنسدلة. كرر المهام الأساسية على عرض ضيق وأحجام نص كبيرة. يمكن للفحوص الآلية أن تشير إلى مشكلات في الوسوم، لكنها لا تثبت أن التسمية منطقية.
سجّل النقطة النهائية المقصودة والجهاز أو طريقة الإدخال المدعومة قبل الاختبار.
اختبر المسار القديم والجديد مقابل نفس المهام بدلًا من الاعتماد على تفضيل الجهات المعنية.
عامل تغييرات التنقل كإصدارات حساسة للتوفر
قد يتم تحميل رأس الصفحة بينما يكون مسار حرج غير متاح فعليًا: قد يكون الدفع، تسجيل الدخول، مسار الدعم، أو صفحة الوثائق خلف حالة معطلة، رابط قديم، أو إعادة توجيه خاطئة. قبل الإطلاق، جرد الوجهات الحرجة، اختبر المسارات على سطح المكتب والمحمول، وتأكد أن الروابط المعروضة تصل للصفحة المقصودة. استخدم بيئات مخوّلة للمسارات المصادقة أو الإقليمية.
دور SIU هو الإصلاح الاستباقي: أجرِ فحصًا مسبقًا، تحقق من المسارات الأساسية بعد النشر، واجعل التصحيح قابلاً للانعكاس. احتفظ بتكوين قائمة مرقم بالإصدارات، سمّ الشخص القادر على استعادتها، وتحقق من المسارات المستعادة. هذا يحد من تأثير الإصدار؛ لكنه لا يغني عن أبحاث قابلية الاستخدام أو مراقبة حالة الخدمة الحية.
أوقف النشر عندما تكون وجهة حرجة مفقودة أو خاطئة أو لا يمكن الوصول إليها بلوحة المفاتيح واللمس.
وثق التكوين السابق، المالك، الزناد، وخطوات التحقق قبل إعادة هيكلة.
