دليل عملي لمراجعة الموقع العربي على الشاشات الصغيرة: اتجاه النص، الأرقام المختلطة، النماذج، تبديل اللغة، وقائمة قبول يمكن مشاركتها مع المصمم.
قد تبدو الصفحة العربية مرتبة على حاسوب المصمم، ثم يظهر رقم الهاتف معكوسا أو يختفي زر الحجز عند فتحها على جوال العميل. التصميم المتجاوب الجيد يحافظ على وضوح المهمة أثناء تغير عرض الشاشة، ويعامل العربية باعتبارها لغة لها احتياجاتها. قبل اعتماد التصميم، اختر ثلاث مهام حقيقية: العثور على خدمة، قراءة شروطها، وإرسال طلب. نفذها بالعربية أولا، ثم باللغات الأخرى، وسجل موضع كل تعثر بدلا من الاكتفاء بالحكم على جمال الصفحة.
ابدأ باتجاه صحيح ومحتوى واقعي
توضح إرشادات W3C لاتجاه النص أن الصفحة ذات الاتجاه العام من اليمين إلى اليسار تحتاج تحديد هذا الاتجاه على مستوى المستند. اطلب من المطور أيضا تعريف لغة الصفحة؛ محاذاة العناوين إلى اليمين وحدها لا تكفي لبناء تجربة عربية سليمة.
جهز عينة تتضمن اسما عربيا طويلا، وبريدا إلكترونيا، ورقم هاتف دوليا، وسعرا بعملة، واسم منتج لاتينيا داخل جملة عربية. راجع ظهور الأقواس والشرطات وترتيب أجزاء العنوان. لا تقلب الصور والشعارات وأزرار تشغيل الوسائط تلقائيا مع اتجاه الصفحة. افحص معنى كل رمز، وحدد مع المصمم العناصر التي تتغير بحسب اتجاه التنقل.
راجع القراءة قبل تصغير العناصر
لا تجعل كل شيء أصغر لتناسب الصفحة الهاتف. ابدأ بعمود واحد للمحتوى الأساسي، واترك مساحة بين الفقرات والأزرار. اختبر الخط بالكلمات العربية الفعلية، خصوصا العناوين الطويلة والتشكيل إذا كان محتواك يستخدمه. يمكن أن يختلف ارتفاع السطر المناسب بين العربية والتركية والإنجليزية، لذلك لا تعتمد مقاسات نسخة واحدة دون مراجعة البقية.
تربط أساسيات التصميم المتجاوب من web.dev تغير التخطيط بمساحة العرض المتاحة. عمليا، اسحب عرض نافذة المتصفح تدريجيا؛ بعض المشكلات تظهر بين مقاسات الهاتف والحاسوب المعتادة. اطلب أيضا تجربة تكبير النص، وتأكد أن البطاقة تتمدد بدلا من إخفاء آخر سطر أو تغطية زر الإجراء.
اختبر النماذج وتبديل اللغة كمسار كامل
- اكتب اسما عربيا مركبا وبيانات اتصال حقيقية للاختبار، وتأكد من بقاء القيم بعد خطأ التحقق.
- اترك حقلا مطلوبا فارغا، ثم راجع أن الرسالة تشرح المطلوب وتظهر قرب الحقل المقصود.
- افتح لوحة مفاتيح الهاتف؛ يجب أن تستطيع الوصول إلى الحقل الحالي وزر الإرسال.
- انتقل إلى الإنجليزية أو التركية من صفحة خدمة داخلية، وراجع الوصول إلى مقابلها إذا كان موجودا.
- راجع قائمة الهاتف بلوحة المفاتيح، وتأكد من وضوح موضع التركيز وإمكان إغلاق القائمة.
تخيل شركة صيانة تستقبل عنوانا عربيا مع رقم بناء وحرف لاتيني. إذا كان موظف المتابعة يعيد سؤال كل عميل عن العنوان، فالمشكلة تستحق أولوية أعلى من حركة ظهور صورة في المقدمة. اطلب مقارنة البيانات التي كتبها المستخدم بما وصل فعلا إلى لوحة الإدارة أو البريد، فسلامة العرض وحدها لا تؤكد سلامة الرحلة.
حوّل الملاحظات إلى شروط قبول
لكل مشكلة، سجل الجهاز واللغة والصفحة والخطوات والنتيجة المتوقعة. مثال واضح: عند تكبير النص في صفحة الحجز، يظل عنوان الخدمة وزر الإرسال ظاهرين ويمكن قراءة الرسالة كاملة. اتفق على الأجهزة والمتصفحات الأساسية قبل التسليم، وأعد اختبار المسار بعد الإصلاح. هذه قائمة عملية للمراجعة، وليست شهادة شاملة بإتاحة الوصول.
ضع متطلبات اللغات ضمن ملف متطلبات الموقع، وراجع تنظيم الموقع متعدد اللغات عند تجهيز الروابط. إذا كانت القراءة سليمة لكن الانتظار طويلا، انتقل إلى تحسين سرعة الموقع على الجوال. ويمكنك مقارنة الواجهات في متجر القوالب باستخدام المحتوى نفسه حتى تكون المقارنة عادلة.