قد يبدو نموذج التواصل العربي مرتبًا، لكنه يصبح صعبًا عند استخدام لوحة المفاتيح أو تكبير النص أو قارئ شاشة. تحسين إتاحة النماذج العربية لا يتطلب التخلي عن RTL أو ألوان الهوية؛ بل يحتاج تعريفًا واضحًا لكل حقل وطريقة مفهومة للانتقال وتصحيح الأخطاء. قائمة القبول التالية تجمع اختبارًا يدويًا مع الفحص الآلي.
اجعل تسمية الحقل ثابتة ومرتبطة به
توصي إرشادات W3C للنماذج بتسميات تعرّف عناصر التحكم وترتبط بها برمجيًا. لا تعتمد على placeholder وحده، فهو يختفي عند الكتابة وقد يترك المستخدم غير متأكد من المطلوب. جرّب الضغط على التسمية، وافحص اسم الحقل الذي تقرؤه الأداة المساعدة.
في نموذج عربي يحتوي على بريد وهاتف، يمكن أن يبقى وصف الحقل عربيًا بينما تحتاج القيمة لاتجاه يناسب قراءتها. اختبر بريدًا طويلًا ورقمًا بمفتاح دولة، وتأكد أن النص لا يدخل تحت الأيقونة أو زر المسح. حدّد الحقول المطلوبة بنص مفهوم، ولا تعتمد على اللون أو النجمة وحدهما دون تفسير.
راجع رحلة لوحة المفاتيح والتركيز
ابدأ من أول الحقول واستخدم Tab ثم Shift+Tab. هل يسير التركيز بتسلسل يمكن توقعه، ويظهر على كل حقل وزر وقائمة؟ جرّب إرسال النموذج دون ماوس، ثم افتح اختيارًا وأغلقه. لا ينبغي أن تمنع زخرفة الواجهة رؤية المكان الحالي للمستخدم.
تتناول معايير WCAG عدم حجب العنصر ذي التركيز بمحتوى أنشأته الصفحة. راجع خصوصًا رأس الموقع الثابت وشريط الهاتف السفلي؛ قد يصيران فوق الحقل عند التمرير أو ظهور لوحة المفاتيح. اختبر ذلك على الجهاز الفعلي، إضافة إلى محاكاة العرض الضيق.
| الاختبار | دليل القبول |
|---|---|
| إرسال حقول فارغة | رسائل تحدد الحقول وطريقة التصحيح |
| بريد غير صالح | نص واضح مرتبط بالحقل دون فقد بقية البيانات |
| التنقل بلوحة المفاتيح | تركيز ظاهر وتسلسل منطقي |
| تكبير الصفحة | لا اختفاء لتسمية أو زر إرسال |
| أيقونات داخل الحقل | لا تداخل مع القيمة أو اسم التحكم |
اختبر الخطأ كجزء من التصميم
النموذج لا يكون مفهومًا فقط حين تكون كل البيانات صحيحة. أرسل قيمًا ناقصة وغير صالحة، ثم راجع أين ينتقل التركيز وكيف يعرف المستخدم ما حدث. إذا ظهرت رسالة عامة أعلى الصفحة، فأضف إشارة تساعده على الوصول إلى الحقل المعني. احتفظ بالمدخلات الصحيحة، وميّز فشل الشبكة عن خطأ إدخال البيانات حتى لا يكرر المستخدم تغييرًا غير ضروري.
في سيناريو توضيحي، يكتب المستخدم تفاصيل مشروع طويلة ثم يخطئ في البريد. النتيجة المقبولة أن يبقى وصفه موجودًا، ويعرف موضع الخطأ، ويستطيع تعديل البريد والإرسال. إعادة النموذج إلى حالة فارغة قد تجعله يترك الطلب رغم أن المشكلة بسيطة.
اضبط التباين وأهداف اللمس في السياق
تحدد WCAG نسبة 4.5:1 للنص المعتاد و3:1 للنص الكبير مع الاستثناءات المحددة في المعيار. افحص اللون على الخلفية الفعلية، بما فيها حالات الخطأ والوضع الداكن، لا على مربع لون منفصل فقط. يمكن حفظ اللون الأساسي للأزرار وإضافة درجات نص أكثر وضوحًا ضمن الهوية.
ويضع معيار حجم الهدف الأدنى في WCAG 2.2 متطلبات 24×24 بكسل CSS أو استثناءات مثل التباعد الملائم. راجع أزرار الأيقونات وخيارات القوائم المتجاورة، ولا تعتبر حجم الرسم نفسه مساحة الضغط. اختبر النقر حول حافة الهدف على شاشة الهاتف.
سلّم النتيجة مع دليل يدوي
الفحص الآلي يلتقط بعض المشاكل، لكنه لا يثبت أن رسالة الخطأ مفهومة أو أن الرحلة يمكن إكمالها. سجّل الاختبارات التي نفذتها والجهاز والمتصفح والملاحظات، وأعد الجزء المتأثر بعد التصحيح. استخدم القائمة ضمن تصميم واجهة وتجربة المستخدم وعند تطوير الموقع. نجاح التسليم يعني أن الناس يستطيعون إكمال النموذج بطرق مختلفة، وليس أن شكله متوازن في لقطة واحدة.
