معظم المواقع العربية تبدو كمواقع إنجليزية معكوسة. الطباعة العربية الحقيقية على الويب حرفة مختلفة. هذا الدليل يغطي القواعد التي تجعل صفحاتنا العربية تحوّل.
معظم المواقع العربية في 2026 تبدو كقوالب إنجليزية مع عكس اتجاه النص. الخط هو ما يأتي مع إطار العمل الأصلي. ارتفاع السطر هو الافتراضي الإنجليزي. المسافة بين الحروف منسوخة من عينة لاتينية. ثم يتساءل الفريق لماذا التحويل على النسخة العربية نصف النسخة الإنجليزية. الحل هو التعامل مع الطباعة العربية كحرفة مستقلة لها قواعدها، لا كنسخة معكوسة من الإنجليزية.
ماذا تعني الطباعة العربية الصحيحة على الويب؟
تبدأ من اختيار الخط. الخطوط الافتراضية في macOS وWindows وأندرويد تعرض العربية بشكل مختلف، ومعظمها يعرضها بشكل ضعيف. الخطوة الصحيحة هي شحن خط ويب مصمم خصيصاً للقراءة على الشاشة بالعربية. الخطوط الرائدة في 2026 هي IBM Plex Sans Arabic وCairo وTajawal وNoto Sans Arabic وRubik. لكل منها نسب وأوزان مختلفة، فالاختيار يعتمد على شخصية العلامة، لكن استخدام الخط الافتراضي للنظام يكاد يكون دائماً خاطئاً.
لماذا ارتفاع السطر أكثر أهمية في العربية؟
الحروف العربية تمتد فوق وتحت الخط الأساسي بطرق لا تفعلها الحروف اللاتينية. التشكيل (الحركات) يتطلب فضاء عمودياً للتنفس. إذا ضبطت نص المتن العربي على ارتفاع سطر 1.5 كما في الإنجليزية، تتصادم الحروف. القاعدة العملية: ارتفاع سطر من 1.7 إلى 1.85 لنص المتن العربي، مقابل 1.5 إلى 1.6 للاتيني. العناوين تحتاج مساحة أكبر: من 1.3 إلى 1.4 مقابل 1.1 إلى 1.2 للاتيني. هذا التغيير وحده يقدم معظم تحسين الجودة المُدرَك في إعادة التصميم العربية.
هل نستخدم المسافة بين الحروف في النص العربي؟
لا، أبداً في نص المتن. العربية كتابة متصلة. الحروف داخل الكلمة ترتبط في ربطات (ligatures)، وإضافة مسافة بين الحروف تكسر هذه الربطات أو تجعلها تبدو مفككة. قاعدة CSS لأي كتلة عربية يجب أن تضبط letter-spacing على صفر صراحة. حتى مسافة طفيفة تجعل العربية تبدو مكسورة. للنصوص الكبيرة والعناوين، أحياناً تنجح مسافة سالبة صغيرة جداً لتماسك بصري أفضل، لكنها تحتاج اختباراً لكل خط.
كيف نتعامل مع النص العربي واللاتيني في نفس الصفحة؟
معظم المحتوى العربي يحتوي بعض اللاتينية: أسماء العلامات، أسماء المنتجات، المصطلحات التقنية، اختصارات إنجليزية. الفخ هو عرض كليهما بنفس الخط. الخطوط الثنائية النصوص (عائلة IBM Plex Sans Arabic مثلاً) تحتوي حروفاً لاتينية مصممة للتناغم مع الحروف العربية. استخدمها. تجنب خلط خط ويب عربي مع خط ويب لاتيني منفصل إلا إذا تطابقت النسب البصرية تماماً، وهذا نادر. التنفيذ التقني يستخدم unicode-range في CSS @font-face للتحكم في أي حروف تأتي من أي خط.
ما حجم خط نص المتن العربي على الويب؟
العربية تُقرأ بشكل مريح بحجم أصغر من اللاتيني بنقطة أو اثنتين، لكن هذا يعتمد على الخط. لنص المتن اللاتيني المضبوط على 16 بكسل، النص العربي بـ Cairo أو Tajawal غالباً يعمل عند 15 إلى 16. لـ IBM Plex Sans Arabic، غالباً 16 إلى 17. القاعدة: اختبر على أحجام متعددة واختر الحجم الذي يجعل التشكيل مقروءاً دون أن يهيمن على السطر. النص العربي على الجوال يحتاج 16 بكسل على الأقل لتبقى المقروئية، أي حجم أصغر يجبر المستخدمين على التكبير ويُفعّل سلوك التكبير في iOS الذي يقتل التحويل.
هل النماذج العربية تختلف عن الإنجليزية؟
نعم في ثلاث نقاط. أولاً، موضع التسمية: التسميات العربية فوق الحقل، لا على يمين الحقل (ما يقابل اليسار في اللاتيني). نمط التسمية الفوقي يعمل للغتين ويتجنب الالتباس البصري الذي تخلقه التخطيطات المعكوسة. ثانياً، اتجاه الإدخال: dir="rtl" على الحقل نفسه، مع text-align: start لا text-align: right (الذي يكسر عند كتابة المستخدم حروفاً لاتينية). ثالثاً، رسائل التحقق: رسائل الخطأ العربية يجب أن تُكتب بالفصحى أو بلهجة طبيعية، لا أن تكون مترجمة آلياً.
كيف نتعامل مع الأرقام العربية الشرقية مقابل الغربية؟
هذا اختيار حقيقي بنتائج حقيقية. الأرقام الغربية (1، 2، 3) مفهومة عالمياً وتسيطر على الواجهات الرقمية في المنطقة في 2026. الأرقام الشرقية (١، ٢، ٣) تبدو أكثر تقليدية لكنها تخلق احتكاكاً في عرض الأسعار وأرقام الهواتف وإدخال النماذج. للمواقع التجارية في لبنان والإمارات ومعظم الخليج، استخدم الأرقام الغربية افتراضياً. لمحتوى يستهدف مصر، الأرقام الشرقية لا تزال تختبر أفضل في بعض الفئات. الخطأ الأكبر هو خلط النوعين على نفس الصفحة.
ما القائمة التقنية لشحن طباعة عربية عالية الجودة على الويب؟
اثنا عشر عنصراً مطلوبة. استخدم خط ويب عربياً حقيقياً، لا الافتراضي. اضبط line-height على 1.7 أو أكثر للمتن. اضبط letter-spacing على صفر لكل الكتل العربية. استخدم خطاً ثنائي النصوص أو خطين متطابقين. استخدم unicode-range. اضبط dir="rtl" على مستوى html أو body. استخدم خصائص CSS المنطقية (margin-inline-start). استخدم text-align: start لا right. اشحن رسائل تحقق نماذج بالعربية. اعتمد الأرقام الغربية افتراضياً. اختبر على iOS Safari وAndroid Chrome وFirefox سطح المكتب. تحقق من حجم 16 بكسل كحد أدنى على الجوال.
جاهز لتنمية أعمالك على الإنترنت؟
إذا كانت صفحاتك العربية تحوّل أقل من الإنجليزية، الفجوة عادة في الطباعة وبنية النموذج، لا في النص. فريق Voxire يصلح الاثنين. احصل على عرض سعر مخصص هنا.
Voxire
خدمات تطوير الويب
نبني مواقع ويب وتطبيقات سريعة ومحسّنة لمحركات البحث للشركات في لبنان والشرق الأوسط.
تعرف على المزيد
