Home / Blog / Design

Building a Bilingual Arabic-English Website

DesignBy Gulfline Digital Team··3 min read
Dubai Marina skyline with towers and yachts at dusk
Photo: rawpixel (CC0)

Arabic is the official language of the UAE, and English is the everyday business language for a large part of the population. A website in both languages lets you reach Emirati and Arab clients in their own language while serving the wider expat community — but only if the Arabic version is done properly, not bolted on as an afterthought.

Do you need an Arabic version?

It depends on your clients. If you tutor the UAE Ministry curriculum, teach Arabic, train Emirati families, or work with government and semi-government entities, an Arabic version is highly valuable. If your clients are almost entirely English-speaking expats, you may start in English and add Arabic later. Look at who actually enquires today, and who you want to reach tomorrow.

Right-to-left (RTL) is more than flipping text

Arabic reads from right to left, so the whole layout should mirror: navigation, alignment, icons that imply direction (such as arrows), and the order of columns. In HTML this starts with setting the direction on the page:

<html lang="ar" dir="rtl">

Modern CSS helps a lot. Using logical properties — margin-inline-start instead of margin-left, padding-inline-end instead of padding-right — means the same stylesheet works correctly in both directions. Things that should not mirror include phone numbers, prices written with Western digits, logos and media playback controls.

Choose fonts built for Arabic

Many popular Latin fonts have no Arabic characters, so the browser falls back to a system font that may clash with your design. Pick a font family designed for Arabic — such as Noto Kufi Arabic, Noto Naskh Arabic, Cairo, Tajawal or IBM Plex Sans Arabic — and pair it with a complementary English font. Arabic text often needs a slightly larger font size and more line height to stay readable.

Translation: go beyond machine output

Machine translation is a useful first draft, but marketing copy needs a human touch. Tone, idioms and even how you address the reader differ between languages. Have a fluent speaker — ideally someone familiar with Gulf usage — review every page. Pay special attention to headlines, calls to action and anything legal such as terms or privacy policies.

Structure: separate URLs for each language

For SEO, each language should have its own URL rather than switching text with JavaScript on a single page. Common patterns:

Subfolders are the easiest choice for most freelancers and small businesses. This website uses /ar/ for its Arabic pages.

Tell Google about your languages with hreflang

Add hreflang tags so Google shows the right version to the right searcher. Each page lists itself and its alternate:

<link rel="alternate" hreflang="en" href="https://example.com/" />
<link rel="alternate" hreflang="ar" href="https://example.com/ar/" />
<link rel="alternate" hreflang="x-default" href="https://example.com/" />

Both pages must reference each other; one-way hreflang tags are ignored. You can also include these relationships in your XML sitemap.

Arabic keyword research

Do not simply translate your English keywords. Arabic speakers may search in Modern Standard Arabic, in dialect, or with English loan words, and spelling varies. Tools like Google Search Console and Google's own autocomplete suggestions help you find the phrases people really type.

Test both versions on real phones

Check the Arabic pages on iPhone and Android: text wrapping, mixed Arabic-English sentences, phone numbers (which can appear scrambled if the text direction is wrong), forms and buttons. Mixed-direction text is the most common source of bugs — wrapping numbers in an element with dir="ltr" fixes most of them.

Make switching language easy

Put a clear language switcher in the header on every page, labelled with the language name in its own script ("English" / "عربي"), and link each page to its direct equivalent rather than the home page.

Every Gulfline Digital website can be built in English and Arabic with full RTL support. See our services, or read about how bilingual content affects website cost.

Frequently asked questions

Is an Arabic version of my website necessary in the UAE?

It is not mandatory for most small businesses, but it is valuable if your clients include Arabic speakers, Emirati families or government-related organisations.

What is RTL in web design?

RTL means right-to-left. Arabic websites need a mirrored layout so text, navigation and alignment flow from right to left.

How do I tell Google my site has Arabic and English versions?

Use separate URLs for each language and add hreflang tags on every page that point to both the English and Arabic versions.

Gulfline Digital Team
We are a Dubai-based web design studio building fast, custom-coded, bilingual websites for tutors, trainers, coaches and freelancers across the UAE.

Want a website that brings in clients?

Custom-coded, mobile-first, WhatsApp-ready and delivered in 7 business days.

See services & prices Chat on WhatsApp