تصميم المواقع العربية لا يقتصر على RTL

اكتب بالطريقة التي يتحدث بها المستخدم فعلًا

الترجمة الحرفية قد تكون صحيحة لغويًا، لكنها لا تكون دائمًا طبيعية داخل منتج رقمي. المستخدم التقني قد يقول: افتح الـ dashboard، أو اربط المشروع مع Supabase، أو شغّل الـ build مرة ثانية. هذه ليست عربية سيئة تحتاج إلى تصحيح؛ هذه طريقة استخدام حقيقية. لا تحتاج إلى ترجمة كل مصطلح تقني إلى العربية، وفي الوقت نفسه لا يجب أن يتحول المنتج بالكامل إلى الإنجليزية. القرار يعتمد على الجمهور والسياق. قد تكون API هي الكلمة الطبيعية في منتج للمطورين، بينما تكون لوحة التحكم أفضل من Dashboard في منتج موجه لجمهور أوسع. المهم أن تختار المصطلح الذي يفهمه المستخدم أسرع، لا المصطلح الذي يبدو أكثر رسمية. وهذا أحد الأسباب التي تجعل تجربة نواة مبنية حول اللغة التي يستخدمها المطور فعلًا: يمكنك أن تكتب طلبًا يجمع العربية مع المصطلحات التقنية الإنجليزية بدل إعادة صياغة الفكرة كلها بلغة مختلفة قبل أن تبدأ.

العربية والإنجليزية تعيشان في الواجهة نفسها

من الطبيعي جدًا أن تحتوي واجهة عربية على جمل مثل: تم ربط مستودع GitHub بنجاح. أو: شغّل npm install ثم افتح الملف src/app/page.tsx. أو: تم إرسال الرسالة إلى ahmed@example.com. المشكلة ليست في وجود الكلمات الإنجليزية، بل في طريقة عرضها داخل سياق RTL. مسارات الملفات والبريد الإلكتروني والروابط وأوامر Terminal وأسماء الحزم وGit hashes والأكواد وبعض الأرقام تحتاج عادة إلى اتجاه LTR مستقل حتى داخل الصفحة العربية. اختبر نقاط التقاء اللغتين عمدًا، فقد يبدو التصميم ممتازًا إلى أن تدخل جملة تحتوي على اسم ملف طويل أو بريد إلكتروني أو إصدار مثل v2.14.0. واجهة عربية جيدة تتوقع هذا النوع من المحتوى من البداية.

تم ربط مستودع GitHub بنجاح.

شغّل npm install ثم افتح الملف src/app/page.tsx.

تم إرسال الرسالة إلى ahmed@example.com

الإصدار الحالي هو v2.14.0

الخط العربي جزء من تجربة الاستخدام

اختيار الخط ليس قرارًا بصريًا فقط. العربية تتصرف بصريًا بشكل مختلف عن الإنجليزية بسبب شكل الحروف واتصالها وكثافة السطر وارتفاع بعض الحروف. خط يبدو ممتازًا في عنوان إنجليزي قد يكون مزدحمًا أو ضعيفًا بالعربية. كذلك لا يعني font-weight: 500 أن الوزن سيشعر بالقوة نفسها في الخط العربي واللاتيني. اختبر الخط المستخدم فعليًا على العناوين الكبيرة والفقرات والأزرار والحقول ورسائل الخطأ والأرقام والكلمات الإنجليزية داخل النص العربي. واستخدم نصوصًا حقيقية بدل أمثلة قصيرة، مثل: تم ربط مستودع GitHub بنجاح. يمكنك الآن تشغيل npm install والبدء في تعديل المشروع. راجع أيضًا line-height؛ فالهدف ليس زيادة المسافات عشوائيًا، بل إيجاد إيقاع قراءة طبيعي بالعربية.

• العناوين الكبيرة والفقرات
• الأزرار والحقول ورسائل الخطأ
• الأرقام والكلمات الإنجليزية داخل النص
• line-height والعناوين متعددة الأسطر

RTL لا يعني عكس كل شيء

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

النماذج تكشف جودة التصميم العربي بسرعة

صفحة تسجيل أو دفع قد تبدو صحيحة في لقطة شاشة، لكنها تكشف مشكلات كثيرة بمجرد استخدامها. قد يكون اسم المستخدم عربيًا، بينما البريد الإلكتروني LTR. رقم البطاقة قد يحتاج اتجاهًا مختلفًا، ورقم الهاتف يحتوي على رمز دولة وأرقام، ورسالة الخطأ عربية لكن قيمة الحقل قد تكون إنجليزية. لهذا لا يكفي أن تجعل النموذج كله RTL؛ يجب أن يكون لكل حقل اتجاه يناسب البيانات التي يستقبلها. رسائل الخطأ أيضًا جزء من Arabic UX. بدل رسالة عامة مثل حدث خطأ، قل للمستخدم ما الذي حدث وما الذي يمكنه فعله: تعذر تسجيل الدخول. تأكد من البريد الإلكتروني وكلمة المرور ثم حاول مرة أخرى. أو: حجم الملف يتجاوز 10MB. اختر ملفًا أصغر ثم حاول مجددًا. الوضوح أهم من الترجمة الحرفية.

<input type="email" dir="ltr" />

input[type="email"] {
  direction: ltr;
  text-align: left;
}

لا توجد عربية واحدة لكل المنتجات

العالم العربي ليس سوقًا لغويًا واحدًا. النبرة المناسبة لمنتج B2B في السعودية قد تختلف عن تطبيق استهلاكي في مصر أو المغرب. قبل كتابة الواجهة، اسأل: من هو الجمهور؟ هل المستخدم تقني؟ هل نريد لغة رسمية أم ودية؟ هل المصطلحات الإنجليزية طبيعية لهذا الجمهور؟ هل توجد كلمات محلية مستخدمة في هذا القطاع؟ في كثير من المنتجات، تكون العربية الفصحى المبسطة أساسًا جيدًا، ثم تتغير النبرة حسب السوق. وفي منتجات المطورين، يمكن أن تكون الجملة العربية التي تحتوي على كلمات مثل React وAPI وGitHub أكثر طبيعية من محاولة تعريب كل شيء. هذا قريب جدًا من الطريقة التي يمكن بها استخدام نواة: تكتب العربية أو اللهجة التي تناسبك، وتُبقي المصطلحات التقنية الإنجليزية عندما تكون هي التعبير الطبيعي.

اختبر العربية كمستخدم حقيقي

لا تختبر التصميم باستخدام Lorem Ipsum أو جملة قصيرة فقط. استخدم محتوى يشبه ما سيظهر فعلًا داخل المنتج: اسم مستخدم طويل، ومدينة عربية، وفقرة تحتوي على كلمات إنجليزية، وبريدًا إلكترونيًا، وسعرًا، وتاريخًا، ورسالة خطأ، ومسار ملف، وأمر Terminal. واختبر الهاتف مبكرًا؛ فالقائمة المحمولة قد تنفتح من جهة غير مناسبة، والعنوان قد يمتد لثلاثة أسطر، والبريد قد يكسر البطاقة، ومسار الملف قد يخرج من الشاشة، وزر الإغلاق قد يتداخل مع النص. جملة مثل: انسخ الأمر npm install @nuwat/cli ثم شغله في Terminal قد تكشف مشكلة أسرع من صفحة كاملة من النصوص القصيرة. واختبر الرحلة كاملة، لا المكونات منفردة فقط: افتح الصفحة، استخدم القائمة، املأ نموذجًا، شاهد رسالة خطأ، افتح modal، استخدم جدولًا، ثم بدّل إلى الإنجليزية.

SEO العربي يحتاج محتوى مكتوبًا للعرب

وجود dir=rtl لا يجعل الموقع جاهزًا للبحث العربي. قد يبحث المستخدم عن: تصميم موقع عربي، تصميم موقع RTL، برمجة موقع بالعربي، إنشاء موقع بالذكاء الاصطناعي، وكيل برمجة بالعربي، أو كيف أسوي موقع عربي. هذه ليست دائمًا ترجمات مباشرة لعبارات البحث الإنجليزية. لذلك يجب أن يكون المحتوى العربي مكتوبًا حول الأسئلة والطريقة التي يبحث بها الجمهور فعلًا. كل صفحة عربية تحتاج أيضًا إلى عنوان ووصف وcanonical وhreflang مناسبين لها، بدل نسخ metadata الإنجليزية وترجمتها حرفيًا. اللغة المستخدمة داخل الصفحة والعناوين والروابط الداخلية والمحتوى الذي يجيب عن نية البحث أهم من مجرد وجود كلمة RTL عدة مرات.

نواة والمنتجات العربية

عندما تبني منتجًا عربيًا باستخدام وكيل برمجة، لا تريد أن تضطر إلى كتابة prompt إنجليزي طويل في كل مرة لتشرح تفاصيل تعرفها أصلًا. اللغة نفسها تحمل معلومات عن المنتج الذي تبنيه، وعن الجمهور والاتجاه والمحتوى المختلط والنبرة المتوقعة. وهنا تصبح تجربة البرمجة أقرب للطريقة التي يفكر بها المطور العربي فعلًا.

الموقع العربي الجيد لا يبدو مترجمًا

أفضل المنتجات العربية لا تبدو كنسخة إنجليزية تم قلبها وترجمتها. تشعر أن العربية كانت جزءًا من التصميم منذ البداية. النص طبيعي، والمصطلحات مفهومة، والخط مريح، والمحتوى العربي والإنجليزي يتعايش بدون مشاكل، والأيقونات تتصرف بحسب معناها، والنماذج تتعامل مع نوع البيانات الصحيح، وتجربة الهاتف تبدو مقصودة وليست إصلاحًا متأخرًا. RTL مهم، لكنه مجرد طبقة واحدة من التجربة. تصميم المنتج العربي الحقيقي يبدأ من اللغة، والسياق، وطريقة الاستخدام — وليس من اتجاه الصفحة فقط.