HomeCompanyPortfolioServicesSoftware & AIMobile AppsIndustriesLocationsPricingBlogContact
Englishالعربية
Home  /  Blog  /  Design
DesignFeb 16, 2026·10 min read

Mobile-First Design for a 99%-Connected Market

IW
IITWares Editorial Team
Digital Strategy & Search
Mobile-First Design for a 99%-Connected Market

Everything below is written for decision-makers who need mobile first design to produce commercial results, not for people collecting best practices.

A website in Saudi Arabia has to work twice: once in Arabic and once in English, on a mid-range phone, for a buyer who will check your commercial registration before filling in a form. Design decisions here carry commercial weight that they simply do not in single-language markets.

Framing the problem properly

The commercial case for mobile first design in Saudi Arabia rests on a simple comparison: what a qualified enquiry currently costs you through paid channels, against what the same enquiry would cost once this work compounds. In most categories we see, the organic and owned-channel figure settles well below the paid one within a year — which is why this is a margin decision as much as a marketing one.

Performance budgets prevent slow decay

Agree a maximum page weight, a maximum number of third-party scripts and a target for Interaction to Next Paint before development begins, then enforce them in review. Sites do not become slow in one release; they accumulate a chat widget here and a tracking pixel there until a fast build is a slow site two years later. A written budget is what stops that drift.

Trust signals Saudi buyers look for

A visible commercial registration number, a national address, a landline in addition to mobile, a Maroof badge for ecommerce, named team members with photographs, real client logos with permission, and a WhatsApp route to a human. Saudi buyers verify before they enquire, and the absence of these elements costs more conversions than any amount of aesthetic refinement recovers.

Forms: ask for less, get more

Every field you add costs completions. Name, phone and one open field is usually enough to start a conversation; qualification can happen in the call. Support Arabic input properly, validate Saudi mobile formats without rejecting valid ones, offer WhatsApp as an alternative to the form entirely, and confirm submission with a message that says what happens next and when. Silent success screens are why prospects call competitors.

RTL is a layout system, not a text direction

Setting dir="rtl" flips text and starts the argument. Navigation order, breadcrumbs, progress steps, sliders, form alignment, icon direction, chart axes and animation origin all need deliberate decisions. Meanwhile numerals, telephone numbers, email addresses, currency codes and Latin brand names stay left-to-right inside a right-to-left sentence. Use logical CSS properties — inline-start and inline-end rather than left and right — and the two directions can share one stylesheet honestly.

Every technical fix on this list is cheaper than the traffic it recovers. That is unusual, and it is why the audit comes first.

Arabic typography deserves its own scale

Arabic script has no capital letters, taller ascenders and connected letterforms, so it needs roughly 10–15% more line height and often a slightly larger optical size than Latin text at the same nominal point size. Choose a family with a genuine Arabic cut rather than a Latin face with bolted-on glyphs. Test with real content at real lengths — Arabic translations commonly run shorter than English, which breaks layouts tuned to the wrong measure.

The language switch is a conversion element

Put it top-right in the English view, top-left in Arabic, label it in the target language, and preserve the current page rather than dumping users on the homepage. Remember the choice. Default by browser preference on first visit but never trap: a visitor who wants English must always be one click away from it. This small component is one of the most frequently mishandled details on bilingual Saudi sites.

Security, HTTPS and trust signals

Valid certificates, HSTS, no mixed content, sensible headers, and a visible privacy policy are baseline. In the Saudi market they are also conversion factors: buyers check for a national address, a landline, a commercial registration number and a Maroof badge before submitting a form. Technical trust and commercial trust are the same project viewed from two angles.

Core Web Vitals, honestly

Interaction to Next Paint is the metric that catches most Saudi sites out, because it punishes heavy third-party scripts — chat widgets, tag managers, multiple pixels, review carousels — that accumulate over years. Largest Contentful Paint is usually an image or web-font problem: serve modern formats, set explicit dimensions, preload the hero, and subset Arabic fonts rather than shipping the full glyph set. Cumulative Layout Shift is almost always ads or late-loading banners. Fix in that order and the field data follows within a month.

Test the big thing, not the button colour

With modest traffic volumes you cannot detect small effects. Test changes large enough to move behaviour meaningfully: a different offer, a restructured page, a removed step, a changed payment option, a new proof element. Colour and copy micro-tests belong to sites with tens of thousands of weekly sessions; below that they generate noise that gets misread as insight.

Typical project shape

StageTypical windowWhat you should see
Discovery and content2–3 weeksUsually the critical path, not development
Design system and key templates3–4 weeksBilingual from the first artboard
Build and integrations4–8 weeksVaries most with third-party systems
QA, RTL testing and launch1–2 weeksReal devices, throttled connections

Windows assume consistent execution and a market of ordinary competitiveness. Treat them as planning ranges, not commitments.

Redirects, migrations and the cost of getting it wrong

Map every old URL to its closest new equivalent one-to-one; never bulk-redirect to the homepage. Use 301s, not 302s. Keep the old sitemap live for a few weeks so the redirects are discovered. Preserve internal links, then update them. Watch Search Console coverage daily for the first fortnight. Migrations that lose traffic almost never lose it to bad content — they lose it to missing redirect mappings nobody checked.

A checklist you can run this week

Duplicate content in a bilingual, multi-branch site

Faceted navigation, session parameters, printer views, and city pages that differ by two words all create near-duplicates. Set self-referencing canonicals, block parameter crawling deliberately, and give each city page genuinely distinct content — local pricing, local case work, local landmarks and directions. If two pages can be swapped without a reader noticing, Google will pick one and it may not be the one you want.

Social proof that reads as real

Named clients with logos used by permission, quantified outcomes, photographs of actual work, video testimonials in Arabic, and review counts pulled live rather than typed as static text. Vague claims — 'trusted by hundreds' — reduce credibility rather than build it. Specificity is the whole mechanism: the more precise the claim, the more it is believed.

Where to start this week

Test your site on a throttled mid-range Android. Time it. Then check the Arabic version for mirrored layouts, correct typography and a language switch that preserves the page. Add the trust elements Saudi buyers look for — registration number, national address, real photographs, a WhatsApp route. Most sites gain more from that afternoon than from a full redesign.

If you take one thing from this: measure the baseline before you change anything. Everything else on this page becomes arguable without it, and unarguable with it.

[ Key Takeaways ]
Duplicate content in a bilingual, multi-branch site
Core Web Vitals, honestly
Redirects, migrations and the cost of getting it wrong
Social proof that reads as real
Share

Frequently asked questions

Do we need separate designs for Arabic and English?+

One design system, two directional treatments. Layouts mirror, typography scales differently, and some components need genuinely different behaviour — but it should be a single system, not two projects.

How long does a website project take?+

A focused business site typically runs eight to twelve weeks; a bilingual site with integrations and a CMS runs twelve to twenty. Content readiness is usually the critical path, not development.

WordPress or custom?+

WordPress where content changes often and requirements are standard. Custom where business logic is distinctive or integrations are heavy. The wrong answer is a heavily customised WordPress build imitating custom software.

What actually improves conversion most on Saudi sites?+

In our experience: page speed, visible trust signals, a WhatsApp route to a human, and shorter forms — usually in that order.

Can you work in Arabic and English?+

Yes — both languages natively, across strategy, content, design and development, which is generally where translated-only providers run into trouble.

Keep Reading

All Articles →

Ready to put these ideas to work?

Start a Project →