Arabic and English website: how to structure it for Dubai
Two languages, two reading directions, one brand. The structure decides whether both versions feel like home.
Short answer: a good Arabic and English website gives each language its own URL, links the two versions with hreflang, sets Arabic pages right to left, and lets visitors switch language themselves. The harder decision is editorial: which pages exist in Arabic at all, and which lines are rewritten rather than translated.
This guide is for Dubai businesses planning a bilingual website, or fixing one that feels half finished. It covers the structure decisions first and the code second, because the code is the easy part.
Why does a Dubai website need Arabic and English?
Because the city reads in both. Arabic is the official language of the UAE, and signs on commercial outlets are in Arabic and English, according to the UAE government fact sheet. The same source says the expatriate community outnumbers UAE nationals, and the total population was 9,282,410 people in 2020.
Most of those visits happen on phones. The fact sheet reports 220.1 active mobile subscriptions per 100 people as of September 2023, citing TDRA. So plan the bilingual site on a small screen first.
Which pages should exist in Arabic?
Start with the pages where an Arabic speaker makes a decision: home, the main services, contact and the guides your Arabic-speaking customers actually need. You do not have to translate everything on day one.
What you should avoid is the half-translated page. Google says translating only the boilerplate, while the main content stays in one language, can create a bad user experience (Google Search Central). A smaller Arabic site that is complete beats a large one that switches language halfway down the page.
Should Arabic and English pages share one URL?
No. Google recommends different URLs for each language version of a page, rather than cookies or browser settings (Google Search Central). Google also notes that its crawler sends requests without an Accept-Language header, so it may never see a version that only appears through language detection.
A simple pattern is a folder per language, such as /ar/ for Arabic. Google lists subdirectories as easy to set up and low maintenance. Pick one pattern and keep it the same across the whole site.
How does hreflang connect the two versions?
Hreflang tells Google that two pages are the same content in different languages. Google's localized versions guide sets three key rules: each version lists itself and every other version, the URLs are fully qualified, and the links must point both ways. If two pages do not point to each other, the tags are ignored.
Use the ISO 639-1 language codes, such as "ar" and "en". Google also supports an x-default value for a fallback page, such as a language selector.
One detail surprises many teams. Google says it does not use hreflang or the HTML lang attribute to detect a page's language. It reads the visible content. So the words on the page have to be in the language you say they are.
Should a bilingual website redirect visitors by language?
No. Google advises against automatically redirecting users from one language version to another based on what you think their language may be (Google). Those redirects can stop people and search engines from seeing all the versions.
Instead, add a clear language link on every page that goes to the matching page in the other language, not to the home page. Label it in its own language: "العربية" on the English page and "English" on the Arabic one.
How do you set up right-to-left pages?
Add dir="rtl" to the html tag of every Arabic page. The W3C says this sets the base direction for the whole document, so blocks right-align, tables run right to left and form fields start at the right. Do not use CSS to set the direction.
Declare the language too. The W3C recommends a lang attribute on the html tag, such as lang="ar". It also warns that language and direction are separate, so set both.
- Use logical CSS. W3C recommends start and end, not left and right, for margins, padding and alignment. Then the layout mirrors with far less work.
- Let forms detect direction. W3C suggests dir="auto" on form fields, so a name typed in English or Arabic displays correctly.
- Check icons and arrows. A "next" arrow should point the way the reader is going.
Which lines should be rewritten, not translated?
The lines that carry the brand. Headlines, calls to action, the opening of each page and anything with humour or rhythm. A literal translation keeps the meaning and loses the voice.
Give the Arabic writer the intent of each line, not only the English words. Ask for the Arabic to sound like the same person speaking, not a translation of them. We wrote more about this in marketing to a bilingual audience in the UAE.
Some things must stay exactly the same in both languages: your registered business name, phone number, address and opening hours. Consistent facts help people and search engines trust you.
Arabic and English website checklist
- Decide which pages exist in Arabic at launch, and make each one complete.
- Give every language version its own URL, in one consistent pattern.
- Add hreflang links that point both ways, plus an optional x-default.
- Set dir="rtl" and lang="ar" on Arabic pages, and lang="en" on English pages.
- Build the layout with logical CSS, so it mirrors cleanly.
- Add a language switch on every page that goes to the matching page.
- Rewrite headlines and calls to action with a native Arabic writer.
- Test both versions on a phone before launch.
What are the most common bilingual website mistakes?
- One URL that swaps language with a cookie.
- Hreflang tags that only point one way.
- Arabic pages that are flipped English layouts, with the text still aligned left.
- An English menu and footer on Arabic pages.
- Machine translation published without a native review.
Key takeaways
- An Arabic and English website needs separate URLs and two-way hreflang links.
- Choose which pages exist in Arabic, and make each one complete.
- Set dir="rtl" and lang on Arabic pages, and build with logical CSS.
- Rewrite the lines that carry the brand. Never redirect visitors by guessed language.
Written by Allen Antony James, Co-founder of Storytellers, a storyteller-first studio based in Dubai, telling stories worldwide. Want help putting this into practice? See Web design in Dubai or tell us about your business.
Sources
Every claim in this guide links to its source. All sources were checked on 14 Oct 2026.
- UAE Government portal (u.ae): UAE fact sheet
- Google Search Central: Managing multi-regional and multilingual sites
- Google Search Central: Tell Google about localized versions of your page
- W3C Internationalization: Structural markup and right-to-left text in HTML
- W3C Internationalization: Declaring language in HTML
- W3C Internationalization: Languages using right-to-left scripts