12 Arabic website design mistakes that cost UAE businesses customers

Around half of the UAE's residents read Arabic as their first language, and the share of Arabic-speaking decision-makers in government, healthcare, real estate and family businesses is higher still. Yet most "bilingual" websites we audit in Dubai treat Arabic as an afterthought: a Google-translated page, a flipped layout that breaks on mobile, and English fonts pretending to be Arabic.

Here are the twelve mistakes we see most often, roughly in order of how much damage they do.

1. Translating words instead of adapting the site

The Arabic version of your site is a product for a different audience, not a copy. Tone is more formal, calls to action are phrased differently, and some English marketing idioms have no equivalent. "Let's build something awesome" translated literally reads like a children's TV show. Brief an Arabic copywriter with the goal of the page, not the English text.

2. Machine translation without review

Automatic translation has improved enormously, but it still produces gendered mismatches, wrong register, and the occasional sentence that means the opposite. Arabic readers forgive a site that is only in English; they do not forgive one that is in broken Arabic. If budget forces machine translation, label the page as a draft until a native speaker has reviewed it — which is what we do on our own site.

3. A mirrored layout that mirrors the wrong things

Right-to-left means the reading order flips: navigation, text alignment, columns, breadcrumbs, carousels, progress steps. It does not mean flipping everything. Logos stay as drawn. Phone numbers, email addresses, URLs and prices in Latin digits stay left-to-right inside the Arabic text. Media controls (play, pause) stay as they are. Icons flip only if they imply direction: arrows and "back" chevrons flip; a search magnifier, a clock or a tick do not.

4. Using physical CSS instead of logical CSS

If your stylesheet is full of margin-left, padding-right, text-align: left and float: left, every one of those has to be overridden for Arabic — and half of them will be missed. Modern CSS has logical properties: margin-inline-start, padding-inline-end, text-align: start. In Tailwind that is ms-4, pe-6, text-start. Build with them from the first template and the RTL version is mostly free.

5. Letting a Latin font render Arabic

Set font-family: Inter and the browser will silently fall back to its default Arabic font — Arial on Windows, Geeza Pro on macOS, Noto on Android — for the Arabic characters. The result looks cheap and inconsistent, and the line height is usually wrong. Load a real Arabic typeface (Cairo, IBM Plex Sans Arabic, Noto Sans Arabic, Tajawal, Almarai) and scope it to html[lang="ar"].

6. Keeping English letter-spacing and line-height

Arabic letters connect. letter-spacing breaks the joins and makes text look corrupted. Headings designed with tight tracking in English need tracking reset to zero in Arabic, and body text usually needs a taller line height (1.7–1.9) because of the ascenders and diacritics.

7. Wrong or missing lang and dir attributes

The HTML element must carry lang="ar" dir="rtl" on Arabic pages. Without dir, punctuation sits at the wrong end of sentences and mixed English/Arabic lines scramble. Without lang, screen readers use the wrong voice and search engines have to guess. Any embedded English block (a code snippet, an address, a testimonial in English) should be wrapped with lang="en" dir="ltr".

8. Numbers and dates done inconsistently

The UAE overwhelmingly uses Western Arabic numerals (0–9) in business contexts, not Eastern Arabic numerals (٠–٩). Pick one and apply it everywhere, including prices, phone numbers and dates. Prices should show the currency the way your audience expects: "1,099 درهم" or "AED 1,099", not a mixture.

9. No Arabic SEO

If the Arabic page has the English title tag and meta description, Google has nothing to rank it for. Each Arabic page needs its own title, description, H1, image alt text and structured data in Arabic, keyword research done in Arabic (including dialect and transliterated variants such as "ويب سايت" alongside "موقع إلكتروني"), and hreflang="ar" / hreflang="en" links between the two versions, with an x-default.

10. The language switcher sends people to the homepage

The switcher should take the visitor to the same page in the other language. Sending every switch to the homepage loses the context and the conversion. It should also be visible on mobile, labelled in the target language ("العربية" on the English site, "English" on the Arabic one), and not rely on a flag — flags represent countries, not languages, and the UAE flag does not mean "Arabic".

11. Forms, validation and emails only in English

The contact form fields, placeholder text, validation messages ("Please enter a valid phone number"), success message and the auto-reply email all need Arabic versions. A visitor who filled in the Arabic form and receives an English error has been told the Arabic site is a façade.

12. Testing only on desktop Chrome

RTL bugs hide on mobile: a sticky header that slides from the wrong side, a carousel that swipes backwards, a hamburger menu that opens off-screen, a WhatsApp button that overlaps the text. Test on an iPhone and an Android phone with the system language set to Arabic, and check the keyboard behaviour in form fields.

A short checklist for your next build

• Arabic copy written or reviewed by a native speaker, briefed on goals rather than given the English text.
• Logical CSS properties throughout; no left/right without an RTL override.
• Dedicated Arabic typeface, zero letter-spacing, taller line height.
• lang and dir set correctly, with ltr islands for Latin content.
• Directional icons flip; logos, media controls and symbols do not.
• Consistent numerals and currency formatting.
• Arabic titles, descriptions, headings, alt text, schema; hreflang in both directions plus x-default.
• Page-to-page language switcher, text-labelled, no flags.
• Forms, validation, confirmations and emails localised.
• Tested on real phones in both directions.

Arabic done well is a competitive advantage in the UAE precisely because so few sites do it. It is also, honestly, not much extra work when it is designed in from the start — the expensive version is retrofitting it onto a site that assumed left-to-right everywhere.