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

تُطلَب المواقع العربية غالباً بجملة واحدة: نريد نسخة عربية. وتُنفَّذ أحياناً بترجمة النصوص وتبديل اتجاه الصفحة، ثم تظهر النتيجة مكسورة بطرق يصعب وصفها: أزرار في الجهة الخطأ، وأيقونة سهم تشير إلى عكس المقصود، ونموذج تتزاحم حقوله. السبب أن الاتجاه ليس خاصية نص بل قرار تخطيط يمس كل عنصر على الصفحة.
ما الذي يتغير فعلاً عند قلب الاتجاه؟
يتغير أكثر مما يبدو. مسار العين ينقلب فيصبح أول ما تراه في اليمين، ومواضع الأزرار الأساسية تنتقل، وترتيب الأعمدة ينعكس، والهوامش التي كانت تفصل عنصراً عن حافة تصبح في الجهة المقابلة. أي عنصر بُني بافتراض جهة ثابتة يظهر في المكان الخطأ.
ولهذا تفرّق صفحة المقارنة لدى منصة مُبَرمِج بين دعم عربي أصيل في المخرجات ودعم مضاف لاحقاً، وتذكر أن الإضافة اللاحقة تترك عادة مشكلات محاذاة وترقيم واتجاه. هذا التمييز عملي لا تسويقي: هو الفرق بين تصميم يعمل وبين تصميم يحتاج ترقيعاً بعد كل تحديث.
أكثر خمسة أعطال شيوعاً
- الأيقونات الاتجاهية: سهم التالي والسابق، وأيقونة الرجوع، وأسهم القوائم — تحتاج انعكاساً صريحاً وإلا أشارت إلى العكس.
- الهوامش أحادية الجهة: مسافة أُضيفت من جهة واحدة تبقى مكانها بعد القلب فتلتصق العناصر بحافة وتترك فراغاً في الأخرى.
- حقول النماذج: النص الإرشادي داخل الحقل، وعلامة الحقل الإلزامي، ورسالة الخطأ — كلها تحتاج محاذاة صحيحة.
- خلط الأرقام والرموز: الأرقام تُقرأ من اليسار إلى اليمين داخل النص العربي، فتضطرب الأسعار والتواريخ وأرقام الهواتف إن لم تُعالَج.
- حركة الانتقال: الشرائح والقوائم المنزلقة تتحرك في الاتجاه المعاكس لتوقع القارئ العربي.
القاسم المشترك بينها أنها كلها تمر في الفحص السريع وتظهر عند الاستخدام الحقيقي. لهذا لا يكفي أن تفتح الصفحة وتنظر إليها؛ عليك أن تستخدمها كما يستخدمها زائر.
الخط العربي ليس تفصيلاً
الخط يحدد وضوح القراءة أكثر من أي اختيار بصري آخر. اختر خطاً صُمم للشاشات وله أوزان متعددة تكفي للعناوين والنصوص، وحمّله مع الموقع بدل الاعتماد على خط النظام الذي يختلف من جهاز لآخر فيغيّر شكل صفحتك دون علمك.
وانتبه إلى ارتفاع السطر. النص العربي يحتاج تنفّساً رأسياً أكثر من اللاتيني بسبب الحركات وامتداد الحروف، والقيم الافتراضية في معظم القوالب مضبوطة على اللاتينية فتبدو الفقرات العربية مضغوطة.
حجم الخط على الجوال
الأجهزة تسمح للمستخدم برفع حجم الخط على مستوى النظام، والتصميم الذي يفترض حجماً ثابتاً ينكسر عند أول مستخدم يفعل ذلك. اختبر صفحتك مع إعداد خط أكبر من الافتراضي، فهذا سيناريو حقيقي وشائع بين قرّاء العربية تحديداً.
لماذا لا تكفي الترجمة؟
لأن النص العربي يختلف في طوله وسلوكه. الأسماء المركّبة أطول من نظيرتها اللاتينية، والعناوين تمتد إلى سطرين حيث كانت سطراً واحداً، والجمل الوصفية تتوسع. التصميم الذي ضُبط على نص إنجليزي قصير يبدأ في الانكسار عند أول محتوى حقيقي.
الطريقة العملية أن تختبر بأسوأ الحالات لا بأفضلها: اسم من ثلاث كلمات، وعنوان طويل، وتوصيف منتج مفصّل، ورسالة خطأ كاملة. إن صمدت الصفحة أمام هذه فستصمد أمام غيرها.
القوائم والجداول: حيث تظهر المشكلة متأخرة
القوائم المنسدلة والجداول هما آخر ما يُختبر وأول ما ينكسر. القائمة التي تنفتح نحو اليسار تخرج خارج الشاشة على الجوال، والجدول الذي بُني بأعمدة ثابتة يقلب ترتيب أعمدته فيصبح العمود الأول في الجهة الخطأ ويفقد القارئ تسلسله.
عالج الجداول بقاعدة بسيطة: على الجوال حوّلها إلى بطاقات متتابعة بدل الإبقاء على شكل الجدول مع تمرير أفقي. القارئ العربي على شاشة صغيرة يقرأ البطاقات أسرع، والتمرير الأفقي يخفي أعمدة لا يعرف أنها موجودة.
الاتساق بين الصفحات
مشكلة أقل وضوحاً من الانكسار البصري: اختلاف الاتجاه والمحاذاة بين صفحة وأخرى. يحدث هذا حين تُبنى صفحات في أوقات مختلفة أو تُنسخ مكونات من مصادر متعددة، فينتهي الموقع بصفحات تبدو من مواقع مختلفة.
الحل أن تُعرّف قواعد الاتجاه والمسافات والخطوط في مكان واحد يرثه كل مكوّن، لا أن تُضبط في كل صفحة على حدة. الموقع الذي يعالج الاتجاه في مستوى واحد يبقى متسقاً مهما أضفت إليه لاحقاً.
واجعل لكل عنصر متكرر — الأزرار، البطاقات، النماذج — شكلاً واحداً معتمداً. التنوع البصري بلا سبب يقرأه الزائر كفوضى لا كثراء، ويجعل الموقع يبدو غير مكتمل.
كيف تفحص موقعك قبل النشر؟
افحص بترتيب ثابت: الجوال أولاً، ثم اللوحي، ثم سطح المكتب. وفي كل حجم استخدم الصفحة فعلياً — املأ النموذج، افتح القائمة، اضغط أزرار التنقل — بدل الاكتفاء بالنظر. تتيح وثائق منصة مُبَرمِج معاينة على ثلاثة أحجام شاشات أثناء التطوير، وهذا النوع من المعاينة يختصر جولات المراجعة لأنه يُظهر الانكسار وقت حدوثه.
وأضف فحصاً أخيراً بعد النشر: افتح الموقع على جهاز لم تختبر عليه من قبل، ويفضّل جهاز شخص آخر. الأجهزة التي نطوّر عليها تكون دائماً مضبوطة بطريقة تخفي بعض المشكلات.
ماذا عن المواقع ثنائية اللغة؟
الموقع الذي يقدّم العربية والإنجليزية معاً يضاعف المشكلة إن لم يُخطَّط له. لا يكفي زر تبديل لغة؛ يحتاج كل اتجاه تخطيطه الخاص، ويحتاج المحتوى أن يبقى متطابقاً بين النسختين وإلا صار أحدهما نسخة مهملة تضر أكثر مما تنفع.
القرار العملي: إن لم تكن مستعداً لتحديث النسختين معاً، فابدأ بلغة واحدة تخدمها جيداً. نسخة إنجليزية قديمة بمعلومات خاطئة أسوأ من غيابها، ومحركات البحث تقرأ الاثنتين وتحكم عليهما معاً.
وإن مضيت في الثنائية فاحرص على أن يقود كل رابط إلى نظيره في اللغة الأخرى لا إلى الصفحة الرئيسية. قطع المسار عند تبديل اللغة سبب شائع لمغادرة الزائر.
إمكانية الوصول ليست إضافة
كثير من أعطال الاتجاه هي أعطال وصول أيضاً: تباين لوني ضعيف يصعب قراءته، وأزرار صغيرة يصعب ضغطها على شاشة صغيرة، وحقول بلا تسميات واضحة. معالجة هذه الثلاثة تحسّن تجربة الجميع لا فئة بعينها.
ابدأ بأبسطها: تباين كافٍ بين النص وخلفيته، ومساحة ضغط مريحة للأزرار، وتسمية صريحة لكل حقل بدل الاعتماد على النص الإرشادي الذي يختفي عند الكتابة. هذه تعديلات صغيرة أثرها ملموس فوراً.
الخلاصة
اجعل الاتجاه العربي قراراً في التصميم لا خطوة بعده، وانتبه للأيقونات والهوامش والنماذج والأرقام، واختر خطاً عربياً مناسباً بارتفاع سطر مريح، واختبر بمحتوى حقيقي طويل على أجهزة حقيقية. الترجمة تنقل الكلمات، أما التخطيط فيحتاج أن يُبنى للعربية من البداية.
المصادر والمراجع
- مُبَرمِج مقابل البدائل — مقارنة — مُبَرمِج
- دليل استخدام مُبَرمِج — مُبَرمِج
الكيانات المذكورة
كلمات دلالية
هل وجدت هذا المقال مفيداً؟ شاركه مع شبكتك.



