Arabic and Urdu ad design: right-to-left layout, fonts and text length
How to design 4:5 image ads in Arabic and Urdu: mirrored layout, numerals, Nastaliq for Urdu, font choices, text length and mixed-direction text.
By the Adrizq team · · 9 min read
Short answer
Design Arabic and Urdu ads from right to left: start the reading order at the top right, mirror the layout and directional arrows, keep numbers running left to right, and set Urdu in a nasta'liq font with generous line height. Write each language natively instead of translating, and have a native reader check every ad.
An Arabic or Urdu ad needs more than translated words. The reading order, layout, fonts, numbers and line spacing all change, and a design that simply swaps English text for Arabic will look wrong to the people you want to reach.
The good news is that the rules are well documented. The W3C, the body that sets web standards, publishes detailed layout requirements for Arabic script, and its internationalisation lead keeps notes on Urdu. This guide turns them into practical steps for a static 4:5 ad.
Who reads these ads varies by market. In Canada, for example, Statistics Canada lists English (47.3%), Arabic (18.1%), French (15.3%) and Urdu (13.0%) as Muslims' most common home languages (Statistics Canada). Check your own audience before deciding which languages to run.
What changes when an ad reads right to left?
The whole layout flips, not just the text. W3C's Arabic layout requirements say that when Arabic is the main script, "the layout and structure of pages and documents are also set from right to left", and that lines of Arabic text are normally right aligned (W3C, Arabic and Persian Layout Requirements). The same applies to Urdu, which is also written in Arabic script.
In practice, the eye enters at the top right and moves left and down. Here is how a typical 4:5 product ad changes. The layout is an example, not a rule.
| Element | English (left to right) | Arabic or Urdu (right to left) |
|---|---|---|
| Logo | Top left | Top right |
| Headline | Left aligned | Right aligned |
| Product photo | Right half | Left half |
| Offer or price | Under the headline, left | Under the headline, right |
| Button arrow | Points right | Points left |
| Call to action | Bottom left | Bottom right |
What should you mirror, and what should stay the same?
Mirror anything that shows order or direction. Leave alone anything that is a real object or a fixed mark. This is common design practice rather than a W3C rule, so test it with native readers.
Mirror:
- Text alignment and the order of elements
- Arrows and chevrons that mean "next" or "go"
- Step numbers and sequences laid out across the ad
- Any before and after layout, so "before" sits on the right
Do not mirror:
- Product photos, because flipping reverses the writing on labels and packaging
- Logos and brand marks
- Numbers, prices and phone numbers
- Words in Latin script, such as a brand name
- Clocks, maps and other objects people know by sight
How should numbers and prices appear?
Numbers always run left to right, even inside right-to-left text. W3C puts it plainly: "Numbers, even Arabic numbers, are written from left to right" (W3C).
Which digits to use depends on the market. W3C describes three families of numerals in use with Arabic script:
| Numeral family | Where W3C says it is used |
|---|---|
| Arabic-Indic | Eastern Arabic-speaking countries, such as Egypt, Saudi Arabia and Iraq |
| Eastern Arabic-Indic | Iran and Afghanistan |
| European (0 to 9) | Western Arabic-speaking countries, such as Algeria and Morocco |
W3C adds that there is no clear line between the eastern and western Arab regions, so check what your customers and competitors use. Urdu differs again. Urdu text may use ASCII digits or a separate set of extended Arabic-Indic digits, and the shapes of 4, 5 and 7 differ from those used for Arabic (Richard Ishida, W3C). Do not copy Arabic digits into an Urdu ad.
Prices need care because numbers have, in W3C's words, "a weak directionality" in the bidirectional algorithm. A currency code, a number and a percentage sign can end up in an unexpected order. Pick one format per market, use it everywhere in the ad, and check it in the exported image, not just in your design tool.
Which fonts work for Arabic and Urdu ads?
Use a Naskh or clean sans font for Arabic body text, keep decorative styles for short headlines, and use a nasta'liq font for Urdu. All of the fonts named below are free on Google Fonts.
| Use | Style | Example fonts on Google Fonts |
|---|---|---|
| Arabic body and offer text | Naskh, traditional and readable | Noto Naskh Arabic, Amiri |
| Arabic headlines | Kufi or modern sans | Noto Kufi Arabic, Cairo, Tajawal, IBM Plex Sans Arabic |
| Urdu text | Nasta'liq | Noto Nastaliq Urdu, Gulzar |
Urdu needs nasta'liq. Urdu is normally written in the nasta'liq style, with a sloping baseline for joined letters. That cascading shape "can lead to a need for quite large line height settings" compared with many other scripts (Richard Ishida, W3C). A Naskh font will display Urdu, but nasta'liq is the style Urdu readers expect, so specify it by name. Check that your font covers every letter Urdu uses, not just the Arabic alphabet.
Give Arabic more height. W3C notes that "Arabic ascenders and descenders extend much further than those of the Latin script" (W3C). In a bilingual ad, do not force the Arabic to the same size and line spacing as the English.
Do not letter-space Arabic or Urdu. Arabic script is joined. W3C warns that moving two joined characters closer or further apart "creates undesirable results". Use weight, size and colour for emphasis instead.
Go easy on stretched letters. Arabic can be justified by extending the joins between letters, called kashida. W3C notes that excessive or very long kashida "results in uneven color". Urdu does not use kashida in the same way; it is justified by stretching certain letter shapes or moving letters, and interword spacing is a last resort (Richard Ishida, W3C). In a short ad, right-aligned ragged text is usually the safer choice.
How much longer or shorter will the text be?
Plan for each language to take a different amount of space, and write to fit instead of squeezing a translation in. Short strings change the most.
W3C's article on text size in translation cites IBM figures for English translated into European languages, which is useful if you also run French or Turkish versions (W3C, Text size in translation):
| English text length (characters) | Expected size after translation |
|---|---|
| Up to 10 | 200 to 300% |
| 11 to 20 | 180 to 200% |
| 21 to 30 | 160 to 180% |
| 31 to 50 | 140 to 160% |
| 51 to 70 | 151 to 170% |
| Over 70 | 130% |
Arabic behaves differently. The same article notes that Arabic words are built from compact, pattern-based roots, and that "It can be hard to abbreviate without losing meaning." It also says non-Latin scripts "often require more vertical space between lines than does Latin text." So an Arabic headline may be no wider than the English, but it will be taller, and Urdu in nasta'liq taller still.
What this means for a 4:5 ad:
- Leave generous space around headlines, above and below as well as to the sides
- Write each headline natively for the space, rather than translating word for word
- Cut words, not font size, when a line will not fit
- Keep the button text to one or two words in every language
How do you handle mixed-direction text?
Keep Latin-script words, URLs and phone numbers on their own lines where you can, and always check the exported image. Arabic letters are marked as right-to-left characters and Latin letters as left-to-right (W3C), so a line that mixes them is reordered by software, and punctuation can land on the wrong side.
Common trouble spots, with fixes:
| Problem | Fix |
|---|---|
| Brand name in English inside an Arabic sentence | Put it at the start or end of the line, or on a line of its own |
| Website address or social handle | Give it its own line, set left to right |
| Full stop or colon appears at the wrong end | Set the text box's paragraph direction to right to left |
| Discount such as 20% reads in the wrong order | Check the export and rewrite the line if needed |
| Bracketed text looks reversed | Retype it in a right-to-left text box rather than pasting |
W3C's guidance for web pages makes the same point: setting the correct base direction makes punctuation appear in the right place and helps with numbers (W3C). Most design tools have an equivalent paragraph direction setting.
What sizes and safe zones apply?
Right-to-left ads use the same sizes as any other. Meta recommends 1440 by 1800 pixels for 4:5 feed images; 1080 by 1350 is the same shape and is still accepted (Meta Ads Guide). For 9:16 Stories, Meta advises keeping text and logos out of roughly the top 14%, the bottom 35% and 6% on each side (Meta Ads Guide). See image ad sizes for Instagram, Facebook and TikTok for the full list.
If you run several languages, Meta's multi-language ads let you supply text and media for each language in one ad, and Meta shows each person the version that matches their language (Meta for Developers).
How do you check an Arabic or Urdu ad before it runs?
Have a native reader check it, every time. Software can join letters correctly and still produce a line that reads awkwardly or a word that means something you did not intend.
If you use an AI tool to draft ads, run the same checks on its output. Adrizq, for example, writes and lays out ads in Arabic and Urdu among its seven languages, and its ads still need a native reader's eye before you spend money. Our buyer's checklist for AI ad generators covers what to test, and Canva or an AI ad generator? compares designing by hand with generating.
Your right-to-left checklist
- The layout starts at the top right and the headline is right aligned.
- Arrows and sequences point and run right to left.
- Product photos, logos and numbers are not flipped.
- One numeral style is used throughout, chosen for the market.
- Urdu is set in a nasta'liq font with generous line height.
- No letter-spacing and no long stretched joins.
- Each language was written for the space, not squeezed in.
- Brand names, URLs and prices display in the right order in the export.
- Text stays inside Meta's safe zones.
- A native reader approved the final image.
Frequently asked questions
Should I flip my whole ad design for Arabic?
Flip the layout and anything that shows direction, such as alignment, the order of elements and arrows. Do not flip product photos, logos, numbers or Latin-script words, because flipping reverses printed text and makes products look wrong. W3C's Arabic layout requirements say that when Arabic is the main script, page layout is set from right to left, so start the reading order at the top right.
Which numbers should I use in an Arabic ad?
It depends on the market. W3C lists Arabic-Indic digits in eastern Arabic-speaking countries such as Egypt, Saudi Arabia and Iraq, and European digits in western ones such as Algeria and Morocco, and notes there is no clear dividing line. Whichever you choose, numbers run left to right inside Arabic text. Use one style throughout and check what local competitors use.
What font should I use for Urdu ads?
Use a nasta'liq font, the style Urdu is normally written in. Noto Nastaliq Urdu and Gulzar are free on Google Fonts. Nasta'liq has a sloping baseline and often needs much larger line height than other scripts, so leave extra vertical space. Check that the font covers every Urdu letter, and do not reuse Arabic digits, since Urdu's differ for 4, 5 and 7.
Can I just translate my English ad into Arabic?
You can start from a translation, but write the final headline natively for the space. Arabic words are built from compact roots and are hard to abbreviate, and the script needs more vertical space than Latin text. A word-for-word translation often sounds stiff. Ask a native copywriter or reader to adapt the line and approve the finished image before it runs.
Why does punctuation appear on the wrong side in my Arabic text?
Software reorders mixed right-to-left and left-to-right text using the Unicode bidirectional algorithm. If the paragraph direction is set to left to right, full stops, colons and brackets can land at the wrong end. Set the text box to right to left, keep Latin words and URLs on their own lines where possible, and always check the exported image.