Bilingual Arabic-English Website Development in Saudi Arabia (2026 Playbook)

Many Saudi websites have a bilingual problem: machine-translated copy, broken line-heights, incorrectly mirrored icons, untranslated CTAs, or navigation that fails after the language switches. Compare Arabic and English analytics separately to find the actual gap instead of assuming the two experiences perform alike.

This is the playbook for getting it right. Real bilingual Arabic-English UX, the Tailwind logical properties pattern that makes RTL sane, Arabic typography pairings that actually work, and the Arabic SEO discipline most Saudi agencies skip. Per DataReportal's 2026 Saudi Arabia report, Saudi internet penetration is ~99% — and the Arabic-language web is where most of those 99% spend their day. If your Saudi site doesn't convert in Arabic, you don't have a Saudi site.

The scope of bilingual done wrong

Start with a language-segmented baseline because it determines what actually needs work:

• English version: record qualified actions, landing pages, engagement, and field performance.
• Arabic version: measure the same outcomes and inspect content, RTL, typography, and navigation differences.

If Arabic traffic is material but qualified actions lag, investigate the language experience as a business issue. Any revenue effect must be calculated from the site's own traffic, lead quality, and conversion data; it is not a fixed bilingual uplift or payback period.

RTL is not just “flip the layout”

Real bilingual UX starts with Tailwind's logical properties. If you're using ml-4 and mr-2, you're shipping a broken Arabic side. Use ms-4 (margin-inline-start) and me-2 (margin-inline-end) instead — they automatically adapt to text direction. Same for padding (ps-/pe-), borders (border-s/border-e), and rounded corners (rounded-s-/rounded-e-).

What needs to mirror, what doesn't:

• Mirror: arrow icons (next/back, breadcrumb chevrons, “read more” arrows), progress indicators, slider directions.
• Don't mirror: logos, brand marks, photographs, social media icons, video play buttons, audio controls.

Modals, drawers, dropdowns, tooltips — every one needs RTL testing. The classic failure: a side drawer that slides in from the right in English correctly slides from the left in Arabic, but the close button inside still anchors to the “wrong” corner because someone hardcoded right-4 instead of using end-4. Five-second fix; we see it on most Saudi sites we audit.

Arabic typography is its own craft

Arabic glyphs render taller and have different rhythm than Latin glyphs. A font pair that looks balanced in English at 16px might collapse in Arabic. The right approach is to pair the Arabic and Latin faces deliberately, then test at every breakpoint, every weight, and every line-height.

Solid pairings we use depending on the brand:

• IBM Plex Sans Arabic + IBM Plex Sans — best for technical brands, government-adjacent platforms, and SaaS. Both faces share the same designer DNA so the rhythm carries across scripts.
• Tajawal + Inter — best for SMEs and modern professional services. Tajawal's clean geometric forms pair naturally with Inter's neutral Latin.
• Cairo + Poppins — best for retail, hospitality, lifestyle. Cairo brings warmth without sacrificing legibility.
• Noto Sans Arabic + Noto Sans — best for content-heavy editorial sites where consistency at long-form scale matters.

Tune line-height separately per script. Arabic typically wants leading-relaxed (1.625) where English is fine at leading-snug (1.375). The same body-text component needs different leading per language — easy to set via Tailwind's direction-aware variants or a small wrapper component.

Native Arabic copywriting is the single biggest lever

Honestly? This is where most projects break. The build is competent. The fonts are right. The RTL works. And then the Arabic copy is a one-pass Google Translate of the English, complete with English idioms that don't exist in Arabic, CTAs that read foreign, and headlines that lose their punch entirely.

Saudi shoppers spot machine Arabic instantly. They don't complain — they bounce. The Arabic CTA “احصل على عرض أسعار” (literally “get a proposal”) doesn't carry the urgency of the English “Get a free consultation.” A native Arabic copywriter would write something more direct and culturally resonant — something like “احجز استشارة مجانية” (book a free consultation) which converts noticeably better in Saudi audiences.

Use a qualified Arabic writer or reviewer who understands the target audience and subject matter. Scope that work from the page inventory, research needs, and approval workflow, then measure its effect after launch rather than promising a fixed conversion lift or payback period.

Arabic SEO is its own discipline

Most Saudi agencies do English SEO and check a box. That's not Arabic SEO. The Arabic search query for “web design Riyadh” is not just تصميم مواقع الرياض translated word-for-word — it's a different query universe with different intent patterns. Saudi searchers in Arabic phrase questions differently, use different long-tail modifiers, and respond to different snippet structures.

What proper Arabic SEO actually involves:

• Arabic keyword research using Saudi-tuned tools (Google Trends with Saudi Arabia + Arabic, Ahrefs Arabic database, manual SERP review of high-intent queries) — not just translating English keywords.
• Arabic content structure with appropriate H1/H2/H3 in Arabic, schema markup with Arabic alternateName and inLanguage: "ar" tags.
• hreflang tags properly mapped between Arabic and English versions so Google understands the language relationship.
• Arabic meta descriptions written natively, not translated.
• Arabic-specific FAQ markup matching real Arabic queries, not the literal translations of the English ones.

Skipping language-specific research and metadata can leave Arabic pages poorly aligned with the queries their audience uses. Use Search Console query-and-page data for each language to diagnose the real gap before deciding whether content, architecture, or authority needs work.

The bilingual schema markup most agencies miss

Schema markup helps search engines and AI answer systems understand the visible facts on your page, but it is not a special shortcut into Google AI Overviews or ChatGPT. Bilingual schema should match the Arabic and English content users can actually see. The basics:

• Organization schema with name and alternateName in both Arabic and English (e.g., name: "Ijjad" and alternateName: "إيجاد").
• WebPage schema with inLanguage: "en" on English pages and inLanguage: "ar" on Arabic pages.
• FAQ schema in both languages where the FAQ section exists in both.
• Person schema for the founder with both Arabic and Latin name variants if the site lists the founder.

The implementation effort depends on page types and visible content. Treat structured data as an accuracy and eligibility task, not a guaranteed ranking or citation lever.

The bilingual UX defaults we ship by default

• Language toggle as a deliberate UI element in the header, not a tiny corner link. Saudi IP detection serves Arabic by default unless the user has switched.
• Persistent language choice across sessions via cookie + URL pattern (/ar/ and /en/ prefixes — clean for SEO and analytics).
• Forms with RTL-aware error messages, Arabic-friendly date pickers, phone masks that handle 05X and +966 patterns.
• RTL-tested modals, drawers, dropdowns, tooltips — every interactive surface checked in both directions.
• Bilingual CTAs written natively, not translated. The Arabic CTA on a contact card is different copy from the English one — same intent, different phrasing.
• Bilingual blog and content where the project includes editorial output.

How to measure a Saudi bilingual rebuild

Before changing the site, capture the Arabic and English landing pages, qualified actions, engagement, search queries, field performance, and known content or RTL defects. Keep the definitions and comparison window consistent.

A rebuild may include native bilingual UX, Arabic content review, logical CSS properties, language-specific search research, and accurate metadata. The actual scope and timeline depend on the current site and content readiness.

After launch, compare the same language-segmented metrics and annotate material changes. Publish an outcome only when the source data, metric definition, window, and permission are available.

Where bilingual investment doesn't pay back

Honest answer: very rare. The handful of cases:

• Pure B2B with international decision-makers only — when 100% of buyers are expats or non-Saudi corporates dealing in English, the Arabic version is closer to a courtesy than a conversion lever. Even here we recommend a basic Arabic version for credibility.
• SaaS targeting non-Saudi GCC markets exclusively — Dubai-only or Kuwait-focused products sometimes don't need full Arabic depth.
• Pre-revenue MVPs launching to a tight beta — defer the Arabic version until product-market fit, then add it.

For everyone else operating in Saudi Arabia, bilingual is not optional. It's the floor.

Where to read next

• Web development services across Saudi Arabia
• Web design services in Saudi Arabia
• Web development in Riyadh — scope, process, Saudi must-knows
• Web development in Jeddah — Mada, STC Pay, ZATCA
• SEO audit checklist for Jordan and Saudi Arabia (2026)

Frequently asked questions