Building an Arabic and English Website: RTL Design, SEO and Translation Done Right
A proper Arabic and English website is more than translated text. It needs true right-to-left layouts, suitable Arabic typography, separate language URLs with correct hreflang tags, and a translation workflow that keeps both versions accurate as content changes.
In the UAE, offering Arabic alongside English builds trust and widens your audience. Yet many bilingual sites feel unfinished: mirrored layouts are broken, fonts look wrong, and Arabic pages never appear in search results.
Here is how to do it well.
What Does a True Right-to-Left Layout Involve?
Arabic reads right to left, so navigation, text alignment, forms, sliders, and many icons must mirror. Using logical CSS properties instead of fixed left and right values makes this much easier. Numbers, phone numbers, and English brand names inside Arabic sentences need careful handling so punctuation does not jump around.
Which Fonts and Typography Work Best?
Choose fonts designed for Arabic with good readability on screens, rather than falling back to a default. Arabic text often needs larger sizes and more line height than Latin text to feel comfortable. Test headings, buttons, and tables with real Arabic content, since word lengths differ from English.
How Should URLs and Language Switching Work?
- Give each language its own URL, such as /ar/ and /en/.
- Provide a visible language switcher that stays on the equivalent page.
- Avoid forcing language by location, which frustrates users and search engines.
- Remember the visitor's choice for next time.
How Do You Handle SEO for Two Languages?
Add hreflang tags linking each page to its equivalent in the other language, set the correct language attribute in the page code, and include both versions in the sitemap. Translate titles, descriptions, headings, and image text, and research Arabic keywords separately, since search behavior is not a literal translation of English terms.
Should Arabic Content Be Machine Translated?
Machine translation is useful for a first draft, but business content should be reviewed by a native speaker. Tone, formality, and local expressions affect credibility.
How Do You Manage Translation Over Time?
Content changes constantly, so build a workflow: mark pages as needing translation when English changes, assign reviewers, and show translation status in your CMS. A glossary of approved terms keeps brand and product names consistent.
What Common Mistakes Should You Avoid?
- Mirroring the layout but not images, icons, or arrows.
- Using Latin-only fonts that render Arabic poorly.
- Translating menus but leaving forms and error messages in English.
- Forgetting date, number, and currency formats.
- Blocking Arabic pages from search through wrong tags.
What Does Bilingual Development Cost?
Adding proper Arabic and RTL support to a new business website typically adds 20 to 35 percent to design and development effort. A bilingual business website commonly ranges from AED 18,000 to AED 80,000, depending on size and content volume, excluding professional translation.
At The Codx, we build bilingual websites where Arabic is a first-class experience, with proper RTL design, hreflang SEO, and translation workflows that scale.
Frequently Asked Questions
What is RTL design?
Right-to-left layout used for Arabic and similar languages.
Do I need separate URLs for Arabic?
Yes, it helps users and search engines.
What is hreflang?
A tag linking equivalent pages in different languages.
Is machine translation enough?
Not for business content without human review.
Does Arabic need different fonts?
Yes, choose fonts built for Arabic.
Does it cost more?
Typically 20 to 35 percent more effort.
How much does a bilingual site cost?
Often AED 18,000 to AED 80,000.
Can my CMS handle two languages?
Many can, with proper setup.
Do numbers need special handling?
Yes, for formats and direction.
How does The Codx help?
We design and build bilingual sites properly.