اطلب جلسة استراتيجية

دليل مارون للخطوط

أفضل الخطوط العربية للمواقع وتنسيقاتها مع الخطوط الإنجليزية.

اختيار الخط العربي ليس تفصيلاً تجميلياً. فهو يؤثر في سهولة القراءة، وإحساس العلامة التجارية، ومدى اتساق الموقع بين العربية والإنجليزية.

Aaأب

العربية والإنجليزية يجب أن تشعرا بأنهما جزء من نظام واحد.

وضوح القراءةاتساق ثنائي اللغةأداء الموقعتنفيذ RTL

01 / ابدأ بالوظيفة

لا يوجد خط واحد هو الأفضل لكل موقع.

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

ابدأ بخط قابل للقراءة في النصوص الطويلة، ثم اختبر العناوين والأزرار والقوائم والنماذج على الهاتف قبل اعتماد أي تنسيق.

02 / أفضل التنسيقات

ستة تنسيقات عربية وإنجليزية نوصي بها للمواقع.

كل بطاقة تعرض شكل الخطين معاً. اختر التنسيق الذي يناسب وظيفة الموقع ونبرته، لا مجرد التنسيق الأكثر لفتاً للنظر.

IBM Plex Sans Arabic

+

IBM Plex Sans

وضوح يجعل القرار أسهل

Clarity makes the next decision easier.

مناسب لـالخدمات المهنية والأعمال والتقنية

الخيار الأكثر توازناً لموقع أعمال ثنائي اللغة. واضح وموثوق ومناسب لقطاعات كثيرة.

Tajawal

+

Tajawal

تجربة رقمية أكثر وضوحاً

A clearer digital experience.

مناسب لـالعلامات الحديثة والضيافة والخدمات

عائلة واحدة متناسقة للعربية والإنجليزية عندما تكون وحدة الأسلوب البصري هي الأولوية.

Cairo

+

Cairo

نظام مصمم حول المستخدم

A system designed around people.

مناسب لـالجهات الحكومية والمبادرات العامة والتطبيقات

منظم ومعاصر بطابع كوفي واثق. مناسب بصورة خاصة للواجهات التي تكون العربية فيها اللغة الأساسية.

Noto Kufi Arabic

+

Inter

تفاصيل مدروسة من البداية

Considered details from the start.

مناسب لـالعلامات الرقمية والمهنية الراقية

تنسيق معاصر عندما تحتاج إلى عناوين عربية واضحة ونص إنجليزي سهل القراءة في الواجهات.

Noto Naskh Arabic

+

Source Serif 4

النص الجيد يترك مساحة للتفكير

Good writing leaves space to think.

مناسب لـالمواقع التحريرية والتقارير والمحتوى المطول

تنسيق يضع القراءة أولاً، بإيقاع أكثر هدوءاً للمقالات العربية والتقارير والشروحات المفصلة.

Almarai

+

Manrope

خطوة واضحة نحو الخدمة المناسبة

A clear route to the right service.

مناسب لـالرعاية الصحية والتعليم والخدمات القريبة من الناس

ودود وعملي للمواقع التي تحتاج إلى وضوح مريح بدلاً من أسلوب رسمي جداً.

03 / جرّب بنفسك

اكتب نصك وشاهد الخطوط الحقيقية.

استخدم رابط Google Fonts في كل بطاقة لتنزيل ملفات الخط الأصلية أو كود التضمين والترخيص.

03 / كيف تختار

ابنِ قرار الخط حول ما يحتاجه الزائر.

يمكن أن يبدو الخط جميلاً في نموذج قصير ثم يفشل في فقرة طويلة أو زر ضيق أو قائمة عربية على الهاتف.

اللغة الأساسية

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

طبيعة المحتوى

تحتاج المقالات والتقارير إلى إيقاع هادئ في النصوص. أما واجهات الخدمات فتحتاج إلى وضوح سريع في العناوين والأزرار.

الحجم والوزن

قارن الوزن البصري لا رقم الوزن فقط. قد يبدو وزن 500 بالعربية أثقل بكثير من 500 بالإنجليزية.

اختبار الهاتف

افحص العناوين والحقول والأزرار والنصوص متعددة الأسطر على هاتف فعلي. المسافات التي تعمل على سطح المكتب لا تنجح دائماً على الهاتف.

04 / تنفيذ مدروس

خط جيد يحتاج إلى تنفيذ جيد أيضاً.

حمل فقط الأوزان المستخدمة فعلاً. غالباً تكفي أوزان 400 و500 و600 للموقع الخدمي. استخدم ملفات خطوط حديثة، واسمح للنص بالظهور بسرعة، واحتفظ بخط بديل مناسب أثناء التحميل.

01

عرّف الخط العربي والإنجليزي بوضوح

--font-latin: "IBM Plex Sans", Arial, sans-serif;
--font-arabic: "IBM Plex Sans Arabic", Tahoma, sans-serif;
02

طبّق الخط العربي داخل الصفحات RTL

[lang="ar"] { font-family: var(--font-arabic); }
[lang="en"] { font-family: var(--font-latin); }

05 / قائمة الاعتماد

راجع هذه النقاط قبل اعتماد الخط.

المقارنة الحقيقية تحصل داخل تصميم الموقع، لا في صفحة عرض الخط وحدها.

  • العناوين العربية والإنجليزية تبدو متوازنة بصرياً

  • النص العربي مريح للقراءة في الفقرات الطويلة

  • الأرقام وعلامات الترقيم تظهر بصورة صحيحة

  • الأزرار والقوائم لا تنكسر على الهاتف

  • وزن الخط لا يبدو ثقيلاً في العربية أو خفيفاً في الإنجليزية

  • تم تحميل أقل عدد عملي من الأوزان والملفات

اختيار واضح

اجعل اللغتين جزءاً من تجربة واحدة متماسكة.

التصميم ثنائي اللغة الجيد لا يترجم الواجهة فقط. بل يوازن الخطوط والمسافات والاتجاه وسلوك القراءة لكي يشعر كل زائر أن الموقع صُمم بلغته.

اطلب جلسة استراتيجية