Arabic and English website design: a Qatar guide

Law No. 7 of 2019 on Protection of the Arabic Language was issued on 14 January 2019. Four of its articles reach a website:

Breaching Article 2's second paragraph or Articles 8 to 10 can bring a fine of up to QAR 50,000 (Article 11), and the responsible manager faces the same (Article 12). The law never says "website", and I found no implementing decision that does. I am a designer, not a lawyer, so have counsel confirm how it applies to you.

For design, that means:

• Arabic is complete at launch, never "coming soon".
• The Arabic trade name leads, exactly as registered, in the header, footer and Arabic titles. I read "more prominent" literally: first in reading order, never smaller than the Latin name. That reading is mine, not the law's.
• Product data starts in Arabic for goods made in Qatar.

Qatar is almost entirely online: DataReportal counted 3.10 million internet users in October 2025, 99.0% of the population. Statcounter put mobile at 62.01% of web traffic in September 2026 and Google at 93.38% of search, so Google's rules matter most.

Language data is thinner. NU-Q notes that expatriates are the majority, but its language figures cover nationals only: in the 2021 to 2022 wave, 92% of 499 Qatari nationals used the internet in Arabic and 61% in English.

So neither language is optional, and the language switcher must open the same page in the other language, never the homepage. My multilingual website guide for Malaysia covers switchers and translation methods.

Divergence starts in the content model: an Arabic page stored as a separate record falls behind. Make each page one entry holding both languages, each with a status.

Use field-level entries for service, about and legal pages, so both languages publish together, and document level for news.

Webflow applies right to left to Arabic locales automatically; Framer needs its Reverse layout setting to flip stacks and grids.

A worked example: your English team edits the About page on Sunday, and in Webflow the translated Arabic fields keep the old wording. Give every collection a "source changed" and an "Arabic approved" date, and review entries where the first is newer each week.

Name a source language per page. If your team drafts in English, say so and review the Arabic hardest.

1. Glossary first: the Arabic trade name, product names, terms kept in Latin script, spellings.
2. Transcreate pages that sell, translate pages that inform, and never publish raw machine translation.
3. One reviewer and sign-off owner per language, plus legal review for regulated text.
4. A status per language: draft, in translation, in review, approved, published, outdated.
5. Review in context on staging, where broken buttons show.
6. Publish core pages in both languages together.

For layered approvals, Webflow's Enterprise plans can limit which locales each member edits. Collect one consolidated feedback round per stage.

Mirroring, icons and logical CSS are in my Arabic RTL interface design guide. For content websites, two more things matter.

Arabic takes less width and more height. I set Article 1 of the Universal Declaration of Human Rights at 16px in headless Chrome: English in Noto Sans ran 1,299px on one line, Arabic 681 to 787px. All 30 articles in a 680px column took 105 lines in English and 68 to 75 in Arabic.

Height goes the other way: at 16px, Noto Sans Arabic's font box is 34px against 22px for Noto Sans, and Almarai reports a 17px box while a vowelled word inked 25.7px. Set line height per language, never normal, and design from real Arabic copy: English layouts look half empty in Arabic.

Weigh the font files. Regular-weight Arabic files from Google Fonts on 4 October 2026, all under the SIL Open Font License:

Load the Arabic face only on Arabic pages with :lang(ar) rules, and pair it with a Latin face of similar weight.

Digits. Unicode's CLDR data (Node.js 24, CLDR 48) formats 1234567.89 for ar-QA as ١٬٢٣٤٬٥٦٧٫٨٩. Yet on 4 October 2026 the Arabic home pages of Qatar News Agency, the National Planning Council and the dailies Al Sharq and Al Arab showed 459, 72, 280 and 573 Western digits and no Arabic-Indic ones. Pin your choice with ar-QA-u-nu-latn, convert typed Arabic-Indic digits before validation, and never string-match prices: Intl wraps "1,500.00 ر.ق." in invisible right-to-left marks.

Mixed text.

• Titles: browsers take a title's direction from its first strong character, the W3C notes, so an Arabic title opening with a Latin brand displays wrongly. Start it with ‏ or the Arabic name.
• Fields holding either language, such as names and testimonials, get dir="auto".
• Phone numbers have eight digits after +974, mobiles starting 3, 5, 6 or 7 (Google's libphonenumber data). Keep them dir="ltr".

Google's guidance, applied to a bilingual website in Qatar:

1. One language per URL. Google "uses the visible content of your page to determine its language", not the lang attribute, and advises against side-by-side translations.
2. Reciprocal hreflang. Each version lists itself and every other, or Google ignores the tags; a region code alone is invalid; add x-default.
3. No language-guessing redirects. Googlebot usually crawls without an Accept-Language header, yet Webflow's Advanced and Enterprise plans route homepage visitors by browser language, and the Next.js guide suggests choosing locale from that header. Switch both off.
4. Choose slugs deliberately. Google accepts UTF-8 URLs, but percent-encoded, خدمات ("services") becomes 30 characters when pasted into an email. Arabic slugs read well in the address bar; Latin ones share cleanly.

A .qa domain is a strong country signal; Qatar also has an Arabic domain, .قطر, delegated in 2010.

Research Arabic keywords; never translate them. Set Keyword Planner to Qatar and Arabic, check spelling variants (الدوحة or الدوحه, إلكتروني or الكتروني) and Gulf phrasing, and filter Search Console by your Arabic folder. Write Arabic titles natively.

Google may also translate result titles and snippets into Arabic, opening a machine-translated page on click. Without a real Arabic page, Arabic searchers meet you through that translation.

Use language-only codes while you have one Arabic version; Webflow warns that a locale with a country set misses browsers set only to "Arabic".

Law No. 13 of 2016 on Protecting Personal Data Privacy (PDPPL) covers personal data processed electronically. For forms it requires:

• Consent or a lawful purpose (Article 4), notice of who you are and why before processing (Article 9), and only relevant data (Article 10).
• Prior consent for electronic marketing (Article 22), with the sender named and an easy way to stop.
• Special care: health, children's, religious and similar data needs permission from the competent department (Article 16), and sites addressing children need guardian consent (Article 17).

Fines reach QAR 1 million (Articles 4, 8 to 12, 14, 15 and 22) and QAR 5 million (Articles 13, 16 third paragraph, and 17).

The National Cyber Security Agency's 2022 guidelines add design detail. Privacy notices belong in each language you serve (an Arabic form needs an Arabic notice), at the point of collection. Marketing consent is a clear opt-in: never pre-ticked or merged with terms, one channel per consent, never a condition for a discount, kept with a timestamp. Marketing cookies wait for an accept click.

Firms in the Qatar Financial Centre have their own regime, the QFC Data Protection Regulations 2021, run by its Data Protection Office.

Aim for WCAG 2.2 AA, a W3C Recommendation since 5 October 2023. Its new criteria include targets of 24 by 24 CSS pixels, focus never hidden under sticky headers, and no re-entering data already given.

Mada, Qatar's assistive technology centre, assesses government websites against WCAG 2.2 at levels A and AA, and led the W3C's authorised Arabic translation of WCAG 2.1 (11 November 2021), useful for your Arabic editors.

• Make alt text and hidden labels localised CMS fields, and mark English passages in Arabic pages with lang="en".
• Match focus order to the mirrored layout, and test with an Arabic screen reader voice.

1. Confirm the legal position with counsel: Law No. 7, the PDPPL or QFC rules.
2. Choose a set-up from the decision table.
3. Write the glossary, starting with the Arabic trade name.
4. Build the content model with statuses and localised SEO and alt fields.
5. Design each template in Arabic with real copy first, then English from the same components.
6. Translate, transcreate and review on staging.
7. Build hreflang, sitemaps, switcher and consent records, run these checks and launch both languages together.

To have this run for you, see how I scope bilingual website projects in Doha.

• Translating the English site at the end, so Arabic inherits layouts that look empty.
• Separate CMS records per language with no status fields.
• Both languages on one page, which muddles Google's language detection.
• Browser-language redirects left on from a platform default.
• An English-only privacy notice behind an Arabic form, or one pre-ticked box for every channel.

Is an Arabic website legally required in Qatar?

It depends on who you are. For ministries, public bodies and state-funded organisations, Law No. 7 of 2019 covers all publications and announcements, so a complete Arabic site is the safe reading. For other companies, the law fixes the name: the trade name appears in Arabic, more prominently than the Latin one. Websites are never mentioned, so confirm details with counsel.

Should the Arabic or English version be the default?

For a public body, or a company whose readers are mostly Qatari, make Arabic primary: at the root or in /ar/, set as x-default. If your buyers are mainly expatriates, give both versions equal weight in /ar/ and /en/. Never choose by guessing the visitor's browser language; Google advises against those redirects.

Do Qatari websites use Arabic-Indic or Western numerals?

The Arabic home pages I checked on 4 October 2026 (Qatar News Agency, the National Planning Council, Al Sharq and Al Arab) used Western digits only. Unicode's locale data for ar-QA still defaults to Arabic-Indic digits, so software picks them unless told otherwise. Choose one style, pin it in code, and convert whatever users type.

Which hreflang code should I use for Qatar?

With one Arabic and one English version, use language-only codes, ar and en, plus x-default; they serve Arabic readers in Qatar and beyond. Use ar-QA and en-QA only when you also run versions for other countries, such as ar-SA. Every version must list itself and the others.

Can I use machine translation for the Arabic version?

For internal drafts, yes. Published as it is, no: tone, terms and form wording go wrong, and Google's spam policies treat automated translating that adds little value as scaled content abuse. Have a native Arabic editor rewrite the pages that sell and review the rest in context.

What does the PDPPL require on a contact form?

Tell people who you are and why you collect their data before they submit, in the form's language, with a link to a full privacy notice in that language. Collect only what you need. Marketing needs a separate, unticked opt-in per channel, recorded with a timestamp, and health or children's data needs extra permission. Have counsel approve the wording.

Fix the structure before the first screen: Arabic primary, one CMS entry per page with a status per language, one language per URL with reciprocal hreflang, and a pinned digit rule. Then design in Arabic with real copy and launch both languages on the same day.

I work remotely from Dhaka on a Sunday to Thursday week, sharing much of Qatar's working day; read more about me or my website design service. A project starts with a free 30 minute intro call, then a written scope and one fixed quote for the whole site, with no retainer. See how I approach website design for Doha companies.

I read every source and ran every test on 4 October 2026. Digit counts cover visible text only. Type tests used Google Fonts at 16px with 24px lines in headless Chrome 154; formatting used Node.js 24.14.1 (CLDR 48). Fines are in Qatari riyals as the laws state, so no conversion was needed. Language data is thin: NU-Q's figures date from 2021 to 2022 and cover nationals only.

• Ministry of Justice, Al Meezan, Law No. (7) of 2019 on Protection of the Arabic Language, 14 January 2019: almeezan.qa
• Ministry of Justice, Al Meezan, Law No. (13) of 2016 on Protecting Personal Data Privacy, 3 November 2016: almeezan.qa
• National Cyber Security Agency, privacy notice and direct marketing guidelines, September 2022: ncsa.gov.qa, ncsa.gov.qa
• Qatar Financial Centre, data protection, read 4 October 2026: qfc.qa
• Northwestern University in Qatar, Media Use in the Middle East 2022, Figure 33 and method, fieldwork 27 December 2021 to 29 April 2022: mideastmedia.org, mideastmedia.org
• DataReportal, Digital 2026: Qatar, 8 November 2025: datareportal.com
• Statcounter Global Stats, platform and search engine share in Qatar, September 2026: gs.statcounter.com, gs.statcounter.com
• Google Search Central, multilingual sites, localised versions, translated results and spam policies, updated 10 December 2025 to 21 September 2026: developers.google.com, developers.google.com, developers.google.com, developers.google.com
• W3C, right-to-left text, bidi controls, WCAG 2.2 (5 October 2023) and WCAG translations, read 4 October 2026: w3.org, w3.org, w3.org, w3.org
• Mada Center, Qatar accessibility portal, read 4 October 2026: ictaccess.mada.org.qa
• Webflow Help Center, four Localize articles, updated 15 May to 11 September 2026: help.webflow.com, help.webflow.com, help.webflow.com, help.webflow.com
• Framer Help, three localisation articles, updated 15 September 2026: framer.com, framer.com, framer.com
• Sanity, localisation docs, 26 August 2026: sanity.io
• Next.js, internationalisation guide, 10 June 2026: nextjs.org
• Google Fonts, CSS API and family metadata, read 4 October 2026: fonts.google.com, github.com
• Google libphonenumber, Qatar metadata, read 4 October 2026: github.com
• IANA, .قطر delegation record, registered 24 December 2010: iana.org
• UDHR in Unicode, English and Standard Arabic texts, read 4 October 2026: github.com
• Arabic home pages checked for digits, 4 October 2026: qna.org.qa, npc.qa, al-sharq.com, alarab.qa