→ كل المقالات

بناء موقع عربي (RTL) بشكل صحيح

قلب التخطيط هو ��لـ 20% السهلة. الطباعة، والنصّ المختلط، والنماذج، والتفاصيل التي تجعل الموقع العربي يبدو أصيلاً هي الباقي.

A lot of "Arabic websites" are an English site with the text translated and the layout mirrored. It works, but it reads as a translation. A site that feels native takes more care.

The easy part

Set the document direction to right-to-left and most of the layout flips: text aligns right, columns reverse, the navigation starts from the right. Modern CSS does most of this automatically if the site was built with logical properties rather than hard-coded left/right.

The parts that actually matter

  • Typography. Arabic needs a font chosen for Arabic, a larger line height than Latin text, and enough size that the letterforms are clear. A font that looks fine in English can look cramped in Arabic.
  • Mixed text. "استخدم React و Node" — Arabic and Latin in the same sentence. The bidirectional algorithm handles the basics, but numbers, punctuation, and brand names need testing, not assumptions.
  • Directional elements. Arrows, "next/previous", progress steps, and any icon that implies direction all need to point the other way.
  • Forms. Labels, placeholders, validation messages, and the alignment of inputs — all need to be right in RTL, and it is where cheap builds fall apart.
  • Printed and emailed documents. Invoices, confirmations, PDFs. An Arabic site with left-aligned English invoices is only half done.

Bilingual, not just Arabic

If you serve both audiences, you need real separate URLs for each language (/ and /ar/), a visible language switch, and correct hreflang tags so Google shows the right version to the right user. Done wrong, the two versions compete with each other in search.

Why it is worth it

Arabic-first is a small share of the market doing it well. A site that genuinely feels built for an Arabic reader — not translated at one — stands out, and it converts better. It is a core part of what Codrex builds; see Mattaem and Via Luna.

webArabicRTLdesign

ابنِه مع فريق سوري ينجز

أخبرنا عن مشروعك — الاستشارة الأولى مجّانية.

مقالات ذات صلة

لديك مشروع في بالك؟

لنحقّقه معاً.

سواء كنت شركة ناشئة لديها فكرة، أو نشاطاً متنامياً يحتاج منصّة جديدة، أو مؤسّسة تبحث عن شريك تقني طويل الأمد — يسعدنا أن نسمع عن مشروعك. الاستشارة الأولى مجّانية دائماً.

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