Arabic and Urdu readers notice immediately when a site was designed left to right and only translated. Misplaced arrows, text glued to the wrong edge and broken punctuation make a site feel foreign and untrustworthy.
This guide lists the mistakes we see most and how to avoid them, including what to do on a multilingual site where only some pages are RTL.
Real RTL support is more than aligning text to the right: the whole layout, spacing, directional icons and mixed text must flow from right to left, while logos, numbers and phone numbers stay as they are.
Mirror the layout, not everything
Set the page direction to RTL, not just the text alignment. Navigation, sidebars, form labels, progress steps and table columns should all flip. The common error is a right-aligned paragraph inside an otherwise left-to-right page.
Do not mirror everything: logos, photos, charts with time on the horizontal axis, media play buttons and phone numbers usually keep their original direction.
Icons, numbers and mixed text
These details cause most of the visible bugs:
- Arrows, back buttons and chevrons must point the other way.
- Margins and padding should use logical start and end values, not fixed left and right.
- Brand names, English words and numbers inside Arabic or Urdu sentences must keep correct order and punctuation.
- Phone numbers, emails and links should stay left to right.
- Choose Western or Arabic-Indic digits on purpose and use them consistently.
Fonts and typography
Use a font designed for the script. Never add letter spacing to Arabic or Urdu, because it breaks the joined letterforms, and avoid italics. Give the text more line height than Latin text. For Urdu, decide between a Naskh and a Nastaliq style: Nastaliq is traditional but needs more vertical room and larger sizes to stay readable on phones.
On a multilingual site
Switch direction per language, not per site: the English page stays left to right, the Arabic or Urdu page flips. Keep the language switch in the same place, label each language in its own script, and remember that the direction must also apply to forms, emails and error messages.
A prompt to start with: "Make the Arabic and Urdu versions fully right-to-left, use logical spacing, flip arrows and back buttons, keep phone numbers and the logo left to right, and use a proper Arabic font with no letter spacing."