RTL ليست مجرد مرآة: ما علّمتنا إياه العربية والأردية عن التخطيط
المحاولة الأولى لدعم الكتابة من اليمين لليسار تبدو متشابهة في كل موقع: استبدال left وright بـmargin-inline-start وmargin-inline-end، إضافة dir="rtl" إلى وسم <html>، ومشاهدة معظم التخطيط يصحح نفسه تلقائيًا. خصائص CSS المنطقية تتعامل فعلًا مع الغالبية تلقائيًا. المشكلات المتبقية هي الأكثر إثارة للاهتمام.
الأرقام لا تنعكس، لكن جيرانها يظنون ذلك
"+١٥٠" داخل جملة عربية له عطل محدد: خوارزمية bidi في يونيكود تعامل + كحرف محايد وتعيد ترتيبه حسب السياق المحيط، فقد يُعرض كـ"١٥٠+" — يبدو صحيحًا بصريًا، لكنه معكوس دلاليًا. الحل ليس قاعدة CSS؛ بل عزل الرقم عن اتجاه الفقرة المحيطة بعنصر <bdi>، بحيث تبقى الأرقام وعلامات ترقيمها وحدة LTR مكتفية ذاتيًا بغض النظر عن الاتجاه الذي يحيط بها. نُغلّف كل إحصائية وسعر ونسبة مئوية تُعرض في هذا الموقع بهذه الطريقة.
transform لا يعرف شيئًا عن dir
الأيقونات المرتبطة بالاتجاه — سهم يشير "للأمام" — تحتاج إلى الانعكاس بصريًا في RTL. الغريزة الطبيعية هي transform: scaleX(-1) تحت محدد [dir="rtl"]، وهذا يعمل للأيقونة نفسها لكنه ينهار بمجرد أن تريد أيضًا حركة تحويم على نفس العنصر: يمكن لـtransform أن يحمل قيمة واحدة فقط، فالانعكاس وحركة التحويم يتنازعان على نفس خاصية CSS، وينتهي الأمر إما بإلغاء حركة التحويم للانعكاس أو العكس. كان الحل فصل الاهتمامين على خاصيتي CSS مختلفتين تمامًا — يبقى الانعكاس على transform، وتنتقل حركة التحويم إلى translate، مُدرَّجة بخاصية مخصصة --dir: 1 | -1 تعكس إشارتها تحت [dir="rtl"]. خاصيتان لا تتصادمان، بدلًا من خاصية واحدة تؤدي مهمتين.
رياضيات العارض المتحرك تفترض نظام إحداثيات
flex-direction: row تحت dir="rtl" لا يعكس فقط كيف تُقرأ الصفّ بصريًا — بل يعكس أيضًا ترتيب DOM الذي تُرتَّب به العناصر الفرعية على المحور الرئيسي. هذا عادة هو السلوك المطلوب. لكنه ليس ما تريده رياضيات translateX(-page * 100%) لعارض متحرك، لأن هذه الصيغة تفترض أن الصفحة صفر تقع عند الموضع الفيزيائي صفر بغض النظر عن اللغة. تثبيت مسار الانزلاق الخاص بالعارض المتحرك نفسه — وذلك العنصر فقط — على dir="ltr" يبقي الحساب مستقلًا عن الاتجاه، بينما تُستعاد الاتجاهية الحقيقية للمستند مستوى واحدًا للأسفل بحيث يظل النص داخل كل شريحة معروضًا بشكل صحيح. عزل الطبقة الميكانيكية عن طبقة المحتوى تبيّن أنه النمط العام، لا حلًا مؤقتًا لمرة واحدة.
الخلاصة
لا شيء من هذا حيل خاصة بـRTL بقدر ما هي أمثلة على نفس الفكرة: الواجهة لها اتجاه محتوى وسلوك ميكانيكي/إحداثي في آن واحد، وأي كود يخلط بينهما سيعمل باللغة التي بُني بها وسيسيء التصرف بصمت في اللغة الأخرى. الاختبار حصريًا في متصفح مضبوط على الإنجليزية لن يكشف أيًا من هذا أبدًا — الطريقة الموثوقة الوحيدة لإيجاده هي عرض صفحات العربية والأردية فعليًا والنظر إليها.