إمكانية الوصول في تطبيقات الجوال
يتحقق اختبار إمكانية الوصول في تطبيقات الجوال (Mobile accessibility testing) من أن الأشخاص ذوي الإعاقة يستطيعون استخدام تطبيق Android أو iOS بالتقنيات المساعدة والإعدادات المدمجة في هواتفهم: قارئَي الشاشة TalkBack وVoiceOver، والتحكم بالصوت، والوصول بالمفاتيح البديلة (Switch access)، والنص الأكبر، والتباين الأعلى، وتقليل الحركة. ومعايير النجاح (Success criteria) في WCAG 2.2 التي عرفتها في دليل اختبار إمكانية الوصول تنطبق على شاشات التطبيقات أيضاً، وتضيف Android وApple فوقها إرشاداتهما الخاصة.
مثال ملموس: مستخدمة كفيفة تفتح تطبيق تسوّق وVoiceOver مفعّل، وتنتقل إلى عنصر تحديد الكمية فلا تسمع إلا «زر». لا تعرف هل يضيف قطعة أم يحذفها، فلا تستطيع إتمام الطلب. أما المختبِر المبصر الذي يلمس الأيقونة نفسها فلا يرى أي خلل، ولهذا تُجرى فحوص هذا الدرس وقارئ الشاشة وإعدادات النظام مفعّلة.
لماذا يهم
الهاتف عند كثير من الناس هو الحاسوب الأساسي، ويعتمد عليه كثير من ذوي الإعاقة تحديداً لأن التقنيات المساعدة مدمجة فيه. وحين يتجاهلها التطبيق لا تكون النتيجة عيباً شكلياً بل مهمة متعذّرة: دفعة لا يمكن تأكيدها، ونموذج لا يمكن إرساله. وإمكانية الوصول أيضاً متطلب قانوني أو تعاقدي في أسواق كثيرة، كتطبيقات القطاع العام، وفي الاتحاد الأوروبي لخدمات مثل التجارة الإلكترونية والخدمات المصرفية للأفراد بموجب قانون إمكانية الوصول الأوروبي (European Accessibility Act).
أما بالنسبة إلى المختبِر، فمعظم عيوب إمكانية الوصول في الجوال تأتي من أنماط قليلة متكررة: أزرار أيقونات بلا أسماء، ونص بأحجام ثابتة، وأهداف صغيرة، وإجراءات لا تُنفَّذ إلا بالإيماءات، وألوان تُخفق في الوضع الداكن. وجولة قصيرة بقارئ الشاشة وإعدادات النظام على كل شاشة جديدة تكشفها وهي ما زالت إصلاحات من سطر واحد؛ أما بعد الإصدار فتكون الأنماط نفسها قد انتشرت في كل شاشات التطبيق.
TalkBack وVoiceOver: إلامَ تستمع
يغيّر TalkBack على Android وVoiceOver على iOS طريقة عمل اللمس. فالنقرة الواحدة تحدد العنصر وتقرؤه بصوت مسموع، والنقر المزدوج في أي مكان يفعّل العنصر المحدد، والسحب (Swipe) يميناً أو يساراً ينتقل إلى العنصر التالي أو السابق، والتمرير يحتاج إلى إصبعين في TalkBack وثلاثة أصابع في VoiceOver. وقبل تشغيل أيٍّ منهما اضبط اختصار إمكانية الوصول (الضغط المطوّل على مفتاحي الصوت معاً في Android، والنقر الثلاثي على الزر الجانبي أو زر الشاشة الرئيسية في iPhone) لتستطيع إيقافه مجدداً، ومرّ على الدرس التعليمي المدمج مرة واحدة.
ثم تنقّل في كل شاشة من أعلاها، سحبةً بعد سحبة، وقارن ما تسمعه بما تراه. يحدد المطورون النص المنطوق عبر خصائص المنصة، مثل contentDescription في Android وaccessibilityLabel وaccessibilityValue وaccessibilityTraits في iOS، لذا يرجع معظم العيوب إلى خاصية واحدة مفقودة أو خاطئة.
- الاسم: لكل عنصر تحكم اسم قابل للوصول (Accessible name) قصير وذو معنى. والأزرار المكوّنة من أيقونة فقط، مثل زائد وناقص والقلب والمشاركة، هي الإخفاق الأكثر شيوعاً (4.1.2 Name, Role, Value؛ و1.1.1 Non-text Content للصور ذات المعنى).
- الدور والحالة: تسمع ما هو العنصر (زر، مفتاح تبديل، مربع اختيار، تبويب) وحالته (مفعّل، محدد، موسَّع، معطّل)، وتتغير الحالة عندما تتصرف.
- القيمة: بعد تغيير الكمية أو تحريك منزلق القيمة (Slider) تُعلَن القيمة الجديدة.
- الترتيب والتجميع: ترتيب السحب يتبع الترتيب المرئي والمنطقي (من اليمين إلى اليسار في العربية)، وبطاقة المنتج تُقرأ عنصراً واحداً لا أربع قطع متفرقة.
- التركيز والرسائل: ينتقل التركيز إلى داخل الحوار عند فتحه، ويعود إلى العنصر الذي فتحه عند إغلاقه، وتُعلَن رسائل مثل «أُضيف إلى السلة» (المعيار 4.1.3 Status Messages).
- مستخدمو الصوت: مع Voice Access في Android أو Voice Control في iOS ينطق المستخدم التسمية المرئية، لذا يجب أن يحتوي الاسم المنطوق على النص المرئي (المعيار 2.5.3 Label in Name).
حجم هدف اللمس وحجم النص والتباين
تضع WCAG 2.2 حداً أدنى للأهداف: يشترط 2.5.8 Target Size (Minimum) من المستوى AA ألا يقل الهدف عن 24 × 24 بكسل CSS، أو أن تحيط بالهدف الأصغر مسافة كافية؛ ويشترط 2.5.5 Target Size (Enhanced) من المستوى AAA حجم 44 × 44. وتقيس المنصتان بوحدات مستقلة عن كثافة الشاشة، هي dp في Android والنقاط (Points) في iOS، تحافظ على الحجم الفعلي نفسه تقريباً على كل كثافة شاشة، وتوصيان بأكثر من ذلك: 48 × 48 dp على الأقل في Android، وفي إرشادات واجهة الإنسان (Human Interface Guidelines) من Apple حجم افتراضي لعناصر التحكم قدره 44 × 44 نقطة في iOS، وحد أدنى قدره 28 × 28. وفي صفحة ويب على الجوال مصممة بعرض الجهاز يرسم المتصفح بكسل CSS الواحد بمقدار dp واحد في Android أو نقطة واحدة في iOS، لذا تُقارَن الأرقام مباشرةً. قِس مساحة اللمس لا الأيقونة المرسومة: أيقونة بحجم 24 dp مع حشوة 12 dp من كل جانب هدفها 48 dp.
ومن يحتاج إلى نص أكبر يضبطه مرة واحدة للهاتف كله: إعداد حجم الخط في Android (حتى 200% بدءاً من Android 14)، والنص الديناميكي (Dynamic Type) في iOS الذي تتجاوز أحجامه الكبيرة الخاصة بإمكانية الوصول 200%. ويشترط المعيار 1.4.4 Resize Text من المستوى AA أن يكبر النص حتى 200% دون فقدان محتوى أو وظيفة. ولا يتبع النص الإعداد إلا إذا استخدم التطبيق وحدات قابلة للتحجيم: sp في Android (وهي dp تكبر أيضاً مع إعداد حجم الخط) وأنماط نص Dynamic Type في iOS؛ أما النص المحدد بوحدة dp أو بنقاط ثابتة فيبقى صغيراً. وعند أكبر الأحجام ابحث عن التسميات المقصوصة أو المبتورة، والنصوص المتداخلة، والأزرار المدفوعة خارج الشاشة، والشاشات التي لم تعد تتمرر.
ويتبع التباين المعيار 1.4.3 Contrast (Minimum): 4.5:1 للنص العادي و3:1 للنص الكبير (18 نقطة على الأقل، أو 14 نقطة بخط عريض). وتقصد WCAG النقاط الطباعية، ويقدّرها دليل Understanding WCAG بنحو 24 و18.5 بكسل CSS، فالنص بحجم 18 dp أو 18 نقطة في iOS لا يُعد كبيراً بعدُ وفق WCAG؛ أما إرشادات Apple فتطبّق 3:1 بدءاً من 18 من نقاطها، لذا اتفق مع فريقك على الحد الذي تختبرون وفقه. ويشترط 1.4.11 Non-text Contrast نسبة 3:1 للأيقونات وحدود الحقول والحالة المرئية لعناصر التحكم. قِس كل شاشة في الوضعين الفاتح والداكن: فالرمادي #616161 يبلغ 6.19:1 على الأبيض، لكنه لا يبلغ إلا 3.02:1 على الخلفية الداكنة #121212، أي أن لوناً ينجح في سمة قد يُخفق في الأخرى.
معايير المؤشر والإيماءات والاتجاه على شاشة اللمس
كُتب الإرشاد 2.5 Input Modalities في WCAG 2.2 وشاشات اللمس في الحسبان، ويشرح درس إمكانية الوصول للمؤشر والحركة معاييره بعمق. ويواجه مستخدمو قارئ الشاشة المشكلة نفسها من جهة أخرى: مع تشغيل TalkBack أو VoiceOver ينقل السحبُ التركيزَ بدلاً من أن يصل إلى التطبيق، لذا يجب أن تُتاح إجراءات الإيماءات أيضاً بوصفها إجراءات إمكانية وصول (Accessibility actions)، يعرضها VoiceOver تحت «الإجراءات» في الدوّار (Rotor)، ويعرضها TalkBack في قائمة الإجراءات. وعلى الهاتف يتحول كل معيار إلى اختبار ملموس:
- 2.5.1 Pointer Gestures (A): كل ما يُنفَّذ بإيماءة متعددة النقاط أو قائمة على المسار، مثل ضمّ الإصبعين للتكبير أو السحب للحذف أو السحب بين البطاقات، يمكن تنفيذه أيضاً بإصبع واحد ودون مسار، كالنقرات المفردة: زرّا زائد وناقص، أو زر «حذف»، أو زرّا التالي والسابق.
- 2.5.7 Dragging Movements (AA): إعادة ترتيب قائمة أو تحريك خريطة أو تحريك مقبض منزلق القيمة تعمل أيضاً دون جرّ، مثل زرَّي «تحريك للأعلى» و«تحريك للأسفل»، أو أزرار التحريك، أو النقر على مسار المنزلق.
- 2.5.2 Pointer Cancellation (A): يقع الإجراء عند رفع الإصبع لا عند اللمس. اضغط على زر، وحرّك إصبعك خارجه، ثم ارفعه: يجب ألا يحدث شيء، أو أن يُتاح التراجع عن الإجراء بعد وقوعه. أزرار المنصة القياسية تتصرف هكذا، أما معالجات اللمس المخصصة فكثيراً ما لا تفعل.
- 2.5.4 Motion Actuation (A): الميزة التي تعمل بهز الهاتف أو إمالته لها أيضاً عنصر تحكم على الشاشة، ويمكن إيقاف الاستجابة للحركة كي لا يشغّلها ارتعاش اليد أو حركة كرسي متحرك.
- 1.3.4 Orientation (AA): تعمل الشاشات في الوضعين الطولي والعرضي ما لم يكن اتجاه بعينه جوهرياً، كتطبيق لوحة مفاتيح بيانو. فمن يثبّت هاتفه على حامل في كرسي متحرك أو سرير لا يستطيع تدويره.
أدوات الفحص في المنصتين وما لا تستطيع الحكم عليه
لكل منصة أداة فحص مجانية. يفحص تطبيق Accessibility Scanner في Android الشاشة التي أنت عليها، ويقترح إصلاحات لتسميات المحتوى المفقودة، وأهداف اللمس الصغيرة، والعناصر القابلة للنقر، وتباين النصوص والصور المنخفض. ويعرض Accessibility Inspector في Xcode التسمية والقيمة والسمات (Traits) لأي عنصر في تطبيق يعمل على محاكي iOS، ويُجري تدقيقاً (Audit) يبلّغ عن مشكلات مثل الأوصاف المفقودة ومناطق اللمس الصغيرة والتباين المنخفض والنص المقصوص وغياب دعم Dynamic Type، ويتضمن حاسبة لتباين الألوان. ويمكن تشغيل فحوص من النوع نفسه داخل اختبارات واجهة المستخدم عبر AccessibilityChecks.enable() في Espresso وperformAccessibilityAudit() في XCUITest.
تفحص هذه الأدوات قواعد على حالة شاشة واحدة في كل مرة، ولا تحكم على المعنى. فهي تجد زراً بلا اسم، لكنها لا تجد اسماً خاطئاً. ولا تستطيع أن تحكم هل ترتيب القراءة منطقي، وهل للسحب بديل، وأين يستقر التركيز بعد إغلاق الحوار، وهل يظل نموذج طويل يعمل عند أكبر حجم للنص. دعها تلتقط العيوب الآلية الطابع مبكراً، وخصّص وقتك اليدوي لجولة قارئ الشاشة والإعدادات وفحوص الإيماءات.
| الفحص | WCAG 2.2 | Android | iOS |
|---|---|---|---|
| الاسم المنطوق والدور والحالة | 4.1.2A · Name, Role, Value | يشير Scanner إلى التسميات المفقودة؛ وTalkBack يخبرك هل للاسم معنى | يشير تدقيق Inspector إلى الأوصاف المفقودة؛ وVoiceOver يخبرك هل للاسم معنى |
| ترتيب القراءة والتركيز | 1.3.2 · 2.4.3A · Meaningful Sequence, Focus Order | بالسمع: اسحب عبر الشاشة كلها مع TalkBack | بالسمع: اسحب عبر الشاشة كلها مع VoiceOver |
| حجم هدف اللمس | 2.5.8AA · 24 × 24 بكسل CSS على الأقل | يشير Scanner إلى الأهداف الأصغر من 48 × 48 dp | يشير تدقيق Inspector إلى مناطق اللمس الصغيرة؛ والحجم الافتراضي في HIG: 44 × 44 نقطة |
| حجم النص | 1.4.4AA · Resize Text حتى 200% | بالنظر: حجم الخط في أقصاه، ثم ابحث عن النص المقصوص | يشير تدقيق Inspector إلى النص الذي لا يدعم Dynamic Type؛ ثم افحص الأحجام الكبيرة |
| التباين | 1.4.3 · 1.4.11AA · 4.5:1 للنص، و3:1 للنص الكبير والأيقونات | يشير Scanner إلى تباين النص والصور المنخفض؛ أعِد الفحص في الوضع الداكن | تدقيق Inspector وحاسبة التباين؛ أعِد الفحص في الوضع الداكن |
| بدائل الإيماءات والجرّ | 2.5.1 · 2.5.7A · AA · Pointer Gestures, Dragging Movements | يدوياً: يوجد بديل بالنقر؛ ويعرضه TalkBack في قائمة الإجراءات | يدوياً: يوجد بديل بالنقر؛ ويعرضه VoiceOver تحت «الإجراءات» في الدوّار |
| إلغاء المؤشر | 2.5.2A · Pointer Cancellation | يدوياً: اضغط، وحرّك إصبعك خارجاً، وارفعه؛ لا يحدث شيء | يدوياً: الضغط والتحريك خارجاً والرفع نفسها |
| الهز والإمالة | 2.5.4A · Motion Actuation | يدوياً: عنصر تحكم على الشاشة يؤدي الوظيفة نفسها، ويمكن إيقاف الحركة | يدوياً: كما في Android، ومع إيقاف Shake to Undo في الإعدادات أيضاً |
| الاتجاه | 1.3.4AA · Orientation | يدوياً: دوّر الهاتف مع تفعيل التدوير التلقائي؛ الشاشة تتبعه | يدوياً: دوّر الهاتف مع إيقاف قفل الاتجاه الطولي؛ الشاشة تتبعه |
- تبلّغ عنه أداة فحص المنصة، ويؤكده إنسان
- لا تحسمه أداة فحص: اختبره بالسمع أو يدوياً
أسماء أدوات الفحص كما في Accessibility Scanner من Android وAccessibility Inspector في Xcode؛ وما تكشفه قد يتغير بين الإصدارات.
مثال تطبيقي: شاشة سلة على المنصتين
تعرض سلة تطبيق تسوّق المنتجات مع أداة لتحديد الكمية (أيقونتا ناقص وزائد، وزر الناقص يتوقف عند 1)، وتحذف المنتج بالسحب إلى اليسار، وتنتهي بزر «إتمام الشراء» (Checkout). يتجوّل المختبِر في الشاشة بـTalkBack على هاتف Android وبـVoiceOver على iPhone، ثم يكرر الجولة عند أكبر حجم للنص وفي الوضع الداكن، ويشغّل أداتي الفحص، ويدوّر الهاتف. ويسجّل كل نتيجة مع المعيار أو الإرشاد الذي تُخفق فيه:
- زرّا الناقص والزائد يُعلَنان «زر» بلا اسم على المنصتين: 4.1.2. المتوقع: «إنقاص الكمية، قميص أزرق» و«زيادة الكمية، قميص أزرق».
- بعد النقر على الزائد لا تُعلَن الكمية الجديدة: 4.1.2، لأن التغيير لا يصل إلى قارئ الشاشة.
- السحب للحذف هو الطريقة الوحيدة لإزالة المنتج، والسحب المخصص غير متاح كإجراء: 2.5.1. المتوقع: زر «إزالة» في كل صف، متاح أيضاً كإجراء إمكانية وصول.
- زرّا أداة الكمية بحجم 32 × 32 (dp في Android ونقاط في iOS): يستوفيان 2.5.8 لكنهما دون 48 dp في Android ودون الحجم الافتراضي 44 نقطة لدى Apple، ويشير إليهما Accessibility Scanner. يُبلَّغ عنهما مقابل الحد الذي اتفق عليه الفريق.
- عند حجم خط 200% يُقص السعر ويُبتر نص زر «إتمام الشراء»: 1.4.4.
- ملاحظة «توصيل مجاني» باللون
#616161تنجح على الأبيض لكنها تهبط إلى 3.02:1 في الوضع الداكن: 1.4.3، في الوضع الداكن فقط. - الشاشة مقفلة على الوضع الطولي: 1.3.4، فلا شيء في السلة يحتاج إلى اتجاه واحد.
جرّبها: مولّد حالات الاختبار جرّبها: مولّد الاختبار الزوجي (Pairwise)
أخطاء شائعة
- فحص إمكانية الوصول بالنظر إلى الشاشة فقط: الأسماء المفقودة والإعلانات الخاطئة لا تظهر حتى يُشغَّل TalkBack أو VoiceOver.
- اختبار منصة واحدة وافتراض أن الأخرى تتصرف مثلها: تستخدم Android وiOS خصائص مختلفة، حتى لو بُني التطبيق بإطار عمل متعدد المنصات.
- اعتبار نتيجة نظيفة في Accessibility Scanner أو Accessibility Inspector دليلاً كافياً: أدوات الفحص تختبر قواعد على حالة شاشة واحدة، لا التجربة كاملة.
- قياس الأيقونة المرسومة بدلاً من مساحة اللمس، أو الخلط بين البكسلات الفعلية ووحدتي dp والنقاط.
- اختبار حجم النص والتباين بالإعدادات الافتراضية وفي الوضع الفاتح فقط.
- إغلاق إجراء لا يُنفَّذ إلا بالإيماءات على أنه «يعمل» لأن المختبِر يستطيع السحب: السؤال هو هل يوجد بديل بنقرة مفردة.
من منظور ضمان الجودة
في الفريق الفعلي تبدأ إمكانية الوصول في الجوال أثناء تحسين المتطلبات (Refinement): اطلب أن تكون أسماء أزرار الأيقونات وأحجام الأهداف وأنماط النص جزءاً من التصميم ومعايير القبول، واتفقوا على المستوى الذي يختبر الفريق وفقه؛ والاختيار الشائع هو WCAG 2.2 بالمستوى AA مع إرشادات المنصتين. بعد ذلك تحصل كل شاشة جديدة على جولة قصيرة بـTalkBack وVoiceOver وأكبر حجم للنص والوضع الداكن قبل اعتبار القصة منجزة. وتتضاعف الإعدادات بسرعة (المنصة وقارئ الشاشة وحجم النص والسمة والاتجاه)، لذا يُبقي الاختيار الثنائي (Pairwise) التوليفات قليلة، ويمكن تشغيل فحوص المنصة في CI حيث يملك الفريق اختبارات لواجهة المستخدم.
يذكر تقرير الخطأ الجيد في إمكانية الوصول على الجوال الجهازَ وإصدار نظام التشغيل والتقنية المساعدة أو الإعداد وقيمته (TalkBack، حجم الخط 200%، الوضع الداكن)، والخطوات، وما أُعلن أو ظهر، والمتوقع، والمعيار. ولتوثيق ما نُطق فعّل خيار Display speech output في إعدادات المطوّر الخاصة بـTalkBack، أو لوحة التسميات التوضيحية (Caption Panel) في إعدادات VoiceOver، وأرفق تسجيلاً للشاشة. وبعد الإصلاح أعد الاختبار بالإعداد نفسه وأبقِ الحالة في مجموعة اختبارات الانحدار: فإعادة تصميم لاحقة قد تحذف التسمية بالسهولة نفسها التي أضافها بها الإصلاح.
تمرين عملي
افحص شاشة تحديد مواقع المتاجر
يضيف تطبيق متجر تجزئة شاشة لتحديد مواقع المتاجر على Android وiOS، وتصفها ملاحظات المطوّر أدناه. دون تشغيل التطبيق، اكتب مشكلات إمكانية الوصول التي تتوقعها، وسمِّ معيار WCAG 2.2 أو إرشاد المنصة لكل منها، واذكر كيف ستتأكد منها على جهاز.
ثم اكتب عناوين أخطاء لأول ثلاث نتائج ستبلّغ عنها.
Screen: StoreLocator (Android and iOS), locked to portrait
map map view, full screen
zoom: pinch only move: drag only
storeCard card at the bottom, swipe left/right to change store
btnCall phone icon, no label, 36 x 36 dp / pt
icon #FFFFFF on #4CAF50
txtHours opening hours, textSize 12dp (Android), fixed 12 pt (iOS)
#9E9E9E on #FFFFFF
btnDirections text button "Directions", 120 x 48 dp / pt
#FFFFFF on #1565C0- مرّ على العناصر واحداً واحداً واطرح أسئلة قارئ الشاشة: الاسم والدور والحالة والترتيب.
- قارن كل حجم ووحدة خط وزوج ألوان بالأرقام الواردة في هذا الدرس، واحسب نسب التباين.
- افحص كل إيماءة وقفل الاتجاه وفق معايير المؤشر والإيماءات والاتجاه.
- لكل نتيجة اكتب كيف ستتأكد منها: TalkBack أو VoiceOver أو أداة فحص المنصة أو يدوياً.
إظهار الإجابة النموذجية
btnCall: بلا اسم، فلا يعلن TalkBack وVoiceOver إلا «زر» (4.1.2)؛ تأكّد بالسحب إليه، وتشير أداتا الفحص كلتاهما إلى التسمية المفقودة. والأيقونة البيضاء على #4CAF50 نسبتها 2.78:1، أقل من 3:1 التي يشترطها 1.4.11. وبحجم 36 × 36 يستوفي 2.5.8، لكنه دون 48 dp في Android ودون الحجم الافتراضي 44 نقطة لدى Apple.
txtHours: اللون #9E9E9E على الأبيض نسبته 2.68:1، أقل من 4.5:1 (1.4.3)؛ افحصه بأداة Color Converter أو بحاسبة التباين في Inspector. وحجمه ثابت بوحدة dp وبالنقاط، فلن يكبر مع إعداد حجم الخط أو Dynamic Type، وهذا إخفاق في 1.4.4؛ تأكّد عند 200% في Android وعند أحجام إمكانية الوصول الكبيرة في iOS.
الخريطة: التكبير بضمّ الإصبعين فقط يُخفق في 2.5.1، والتحريك بالجرّ فقط يُخفق في 2.5.7؛ أضف أزرار التكبير والتحريك، وقائمة متاجر قابلة للبحث وسيلة إضافية مفيدة للوصول إلى كل متجر. storeCard: السحب هو الطريقة الوحيدة لتغيير المتجر (2.5.1)؛ أضف زرَّي التالي والسابق وأتِحهما لقارئ الشاشة كإجراءات.
قفل الاتجاه الطولي: يُخفق في 1.3.4، لأن تحديد مواقع المتاجر لا يحتاج إلى اتجاه واحد؛ تأكّد بتدوير الهاتف مع تفعيل التدوير التلقائي. أما btnDirections فناجح: 120 × 48 حجم كافٍ، والأبيض على #1565C0 نسبته 5.75:1؛ تأكّد أنه يُقرأ «Directions، زر».
عناوين الأخطاء، بدءاً بالعيوب التي تعطّل مهمة: «شاشة المتاجر: زر الاتصال بلا اسم قابل للوصول (TalkBack وVoiceOver)»؛ «شاشة المتاجر: لا يتغير المتجر إلا بالسحب، ولا بديل بنقرة مفردة (WCAG 2.5.1)»؛ «شاشة المتاجر: تباين نص ساعات العمل 2.68:1، أقل من 4.5:1 (WCAG 1.4.3)». فالعيبان الأولان يعطّلان مستخدمي قارئ الشاشة، إذ لا يعرفون أي زر يتصل بالمتجر ولا يستطيعون الانتقال إلى متجر آخر. وبلّغ عن النتائج الأخرى أيضاً، كل عيب في تقرير مستقل، مثل نص ساعات العمل الذي لا يكبر مع حجم خط النظام.
أسئلة شائعة
هل تنطبق WCAG على تطبيقات الجوال الأصلية؟
كُتبت WCAG 2.2 لمحتوى الويب، لكن معايير نجاحها تُطبَّق عادةً على التطبيقات الأصلية (Native apps). وتشرح مذكرة W3C المسماة WCAG2ICT كيف يُقرأ كل معيار للبرمجيات التي ليست صفحات ويب، وتطبّق معايير مثل EN 301 549 متطلبات مبنية على WCAG على البرمجيات، ومنها تطبيقات الجوال. وعملياً تختبر الفرق التطبيقات وفق WCAG 2.2 بالمستوى AA مع إرشادات Android وApple.
هل أحتاج إلى TalkBack وVoiceOver معاً إذا بُني التطبيق بإطار عمل متعدد المنصات؟
نعم. تربط أطر العمل مثل Flutter وReact Native مكوّناتها بخصائص إمكانية الوصول في كل منصة، وقد تختلف النتيجة: اسم يقرؤه VoiceOver قد يكون مفقوداً في TalkBack، أو قد يتغير ترتيب القراءة. اختبر الرحلات الأساسية على الأقل على المنصتين.
هل يكفي حجم 24 × 24 لهدف لمس في تطبيق؟
إنه الحد الأدنى في WCAG 2.2 بالمستوى AA، فالهدف الأصغر الذي لا تحيط به مسافة كافية يُخفق. وتوصي Android بحجم 48 × 48 dp، وتجعل Apple الحجم الافتراضي 44 × 44 نقطة، وهي أسهل إصابةً لمن يعانون الارتعاش أو محدودية المهارة الحركية. اتفق مع فريقك على القيمة التي تمثل معيار القبول، وبلّغ عن الانحرافات وفقها.
هل يجب أن أكون مستخدماً خبيراً لقارئ الشاشة لأختبر به؟
لا. تعلّم الإيماءات الأساسية واختبر بالطريقة التي يتنقل بها المستخدمون: اسحب من عنصر إلى عنصر بدلاً من لمس ما تراه، لأن اللمس قد يصل إلى عناصر يتخطاها ترتيب السحب. ومع ذلك يلاحظ المستخدمون المتمرسون من ذوي الإعاقة مشكلات يفوّتها المختبِرون، فأشركهم في اختبار قابلية الاستخدام متى استطعت.
المراجع
- Web Content Accessibility Guidelines (WCAG) 2.2توصية W3C التي تحدد معايير النجاح القابلة للاختبار لإتاحة محتوى الويب، مرتّبةً تحت أربعة مبادئ وثلاثة مستويات مطابقة (A وAA وAAA).
- Understanding WCAG 2.2الشرح التوضيحي لكل إرشاد ومعيار نجاح في WCAG 2.2: الغرض، ومن يستفيد، والأمثلة والتقنيات (غير إلزامي).
- Test your app's accessibilityكيف تُختبر إمكانية الوصول في تطبيق Android يدوياً باستخدام TalkBack وغيره، وآلياً بأدوات الاختبار في المنصة.
- Accessibility — Human Interface Guidelinesإرشادات Apple لتصميم إمكانية الوصول في iOS وغيره: VoiceOver والنص الديناميكي والتباين وأهداف اللمس والحركة.
تدرّب بأدوات متقن
تحويل الألوان بين HEX وRGB(A) وHSL(A) وHSB/HSV وCMYK وألوان CSS المسمّاة مع معاينة مباشرة.
ولّد حالات اختبار منظّمة (المعرّف والعنوان والشروط المسبقة والخطوات والنتيجة المتوقّعة والأولوية) من وصف الميزة وقائمة الحقول.
ولّد أصغر مجموعة اختبارات زوجية (all-pairs) من المعاملات وقيمها.
ولّد السجلات نفسها بلغات متعددة (الإنجليزية والعربية والهندية وغيرها) لاختبار التدويل (i18n) واختلاط RTL/LTR.
للتعمّق أكثر
تقدّمك في هذا الموضوع
سجّل الدخول لتتابع تقدّمك
علّم الموضوعات مكتملة، وتابع من حيث توقفت، وافتح امتحانات التخصص.