Skip to content

Web

Bilingual Arabic and English websites: what usually goes wrong

Head of Design — UI/UX & Web2 min readMore in Web
A designer's desk at dusk with the same web layout shown twice on a monitor, once left-aligned and once mirrored right-to-left

Most bilingual sites in the UAE are an English site with Arabic poured into it, and the layout, the type and the content all show it. What a proper second language involves.

Half the sites we are asked to rebuild in the UAE have an Arabic version. Almost none of them were designed with one in mind. The Arabic was added afterwards, into a layout built for English, and it shows.

Direction is a layout decision, not a text setting

Right-to-left affects the whole page: the order of the navigation, the side the logo sits on, which way the arrow in a button points, the direction a carousel advances, the alignment of every form label. Flipping the text direction and leaving the layout as it was produces a page that reads backwards. We build layouts with logical properties — start and end rather than left and right — so the mirroring is automatic and complete.

Arabic type needs its own scale

Arabic letterforms sit lower and run wider than Latin ones at the same nominal size. A typeface pairing that looks balanced in English will look small and cramped in Arabic, or the reverse. Each language gets its own font sizes, line heights and spacing, and every heading is checked in both before anything is signed off.

Translated by a person, not only a machine

Machine translation has become good enough for a first pass and is still not good enough to publish. Brand names, product names and marketing lines need someone who writes Arabic for a living, and a decision about whether numerals are Arabic-Indic or Western. Both are used in the UAE; consistency is what matters.

Content parity, or say so

A visitor who switches to Arabic and finds half the pages missing, or an English PDF at the end of an Arabic form, loses trust in the whole site. Either every page exists in both languages, or the site says plainly which parts are English only.

The technical side

Each language lives at its own URL, with hreflang links between the pairs so search engines serve the right one. Dates, currency and number formatting come from the locale rather than being typed by hand. And the language switch keeps the visitor on the page they were reading, not the home page.

  • Arabic
  • localisation
  • RTL
  • web design