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