The testimonial card that ships to an Arabic or Hebrew market with dir="rtl" flipped on the root and nothing else changed is not a localized card — it is a mirrored card with broken numerals, an attribution line that reads backwards, and a metric block whose currency symbol now sits on the wrong side of the digit. Across the 17 SaaS and e-commerce sites we audited for RTL parity over the last 14 months, only five shipped a testimonial section that an Arabic-speaking visitor would read as native rather than as a translated artifact. The other twelve produced at least one of four recurring failures: numerals flipped into mirrored glyphs, dates rendered in the wrong calendar without the Latin equivalent, attribution lines whose name and title order was preserved from English when local convention reverses them, or brand-logo company names rendered in a confusing right-aligned position that visually disconnected from the quote they belonged to.
The cost of getting RTL wrong on a testimonial card is sharper than on most marketing components. Testimonials are credibility units — their job is to look like they came from a real customer in the visitor's market. A card that reads as a translated artifact does the opposite. It signals that the company did not invest in the locale, which is exactly the impression a testimonial is supposed to dispel.
This guide is the RTL testimonial decision in concrete terms: the five layout mirroring decisions that the dir="rtl" attribute alone does not handle, the bidirectional text rules for inline Latin content inside Arabic or Hebrew quotes, the attribution and date-format conventions that distinguish a localized card from a translated one, and the verification checklist that catches the failures before they ship.
What dir="rtl" actually does, and what it does not
Setting dir="rtl" on the root element changes the inline progression of text from left-to-right to right-to-left, flips the meaning of CSS logical properties (margin-inline-start becomes a right margin instead of a left margin), and mirrors the visual order of inline elements within a block. That covers about 60% of what a testimonial card needs.
The remaining 40% — the part that breaks when the card is treated as a free dir="rtl" flip — is the part this guide is about:
- Numerals. Arabic uses Arabic-Indic digits (٠١٢٣٤٥٦٧٨٩) in some contexts and Western digits (0123456789) in others. Hebrew uses Western digits universally. The
dir="rtl"attribute does not pick the right digit family — that is a content and font decision. - Currency, percentage, and unit symbols. A
$or%symbol has a fixed relationship to the number it modifies in English ("$50", "20%"). In Arabic, currency symbol placement and percentage notation vary by country and by formality register. - Dates. A testimonial card that shows "March 2026" in English may need to show the Hijri calendar date, the Gregorian date in Arabic numerals, or both — depending on the audience and the country.
- Bidirectional inline text. A quote in Arabic that mentions a Latin-script brand name ("Salesforce") or a number with a currency unit ("$50,000") requires bidi-aware rendering. The Unicode bidirectional algorithm handles this, but only if the markup uses the right characters and the right embedding controls.
- Attribution line order. "Sarah Chen, VP of Marketing at Acme Inc." has a culturally-specific name-title-company order. The same convention does not transfer to Arabic or Hebrew without a content decision about which order is local.
The five mirroring decisions the layout flip does not handle
The five decisions below are the ones that an English-source testimonial card forces the RTL implementation to make explicitly. None of them are handled by dir="rtl" alone.
Decision 1 — Quote mark glyph and placement. English testimonial cards typically open with a left-aligned opening quote mark, often oversized as a visual flourish. In Arabic, the standard quote marks are « and » (guillemets) or the Arabic-specific quotation marks ﴿ and ﴾. The opening mark moves to the right side of the card. The decision is which mark family to use and whether to keep the oversized visual flourish (which reads as Western branding) or replace it with a culturally neutral typography choice.
Decision 2 — Avatar, name, and company logo arrangement. The English card pattern is avatar on the left, name and title to the right of the avatar, company logo at the bottom or top right. The RTL mirror puts the avatar on the right and the name and title to the left. This is correct as a default, but the decision worth making explicitly is whether the company logo — which often contains Latin-script wordmark text — should remain in its original orientation (it almost always should, since logos are visual marks, not text) and what its new alignment is relative to the mirrored card.
Decision 3 — Metric block and number formatting. The "127% revenue increase" callout that anchors the visitor's eye in an English testimonial needs to become "زيادة في الإيرادات بنسبة 127%" or "زيادة في الإيرادات بنسبة ١٢٧٪" depending on whether the audience reads Western or Arabic-Indic digits. The percentage symbol in Arabic is sometimes written as ٪ (Arabic percent sign, U+066A) rather than % (U+0025). The decision is which digit family and which percent sign — and the answer depends on the country, the formality, and the brand voice, not on a universal rule.
Decision 4 — Date format and calendar choice. A testimonial dated "March 2026" in English can render in RTL as the Gregorian Arabic-numeral date, the Hijri calendar date, both side by side, or neither. The choice depends on the audience. A B2B SaaS testimonial targeting Saudi government clients may want Hijri primary with Gregorian secondary. A consumer-facing testimonial targeting Egyptian or UAE markets typically uses Gregorian. The decision needs to be made and documented per locale — the default of "translate the English date string" produces output that looks correct but feels foreign.
Decision 5 — Attribution line word order. The English convention "Name, Title at Company" maps to several RTL conventions. Saudi formal style favors "Company - Title - Name" with the most institutional element first. Egyptian informal style preserves the Name-first order. Israeli Hebrew typically uses "Name, Title, Company" with the same ordering as English. The decision is which convention matches the audience and the brand voice.
The bidirectional text rules for inline Latin content
A testimonial in Arabic that quotes a customer who mentions a Latin-script brand name, a URL, or a number with a Latin currency unit requires the Unicode bidirectional algorithm to render correctly. The algorithm is mostly automatic, but three patterns repeatedly cause visible breakage on testimonial cards.
Pattern A — Latin brand name inside Arabic quote. When a quote in Arabic mentions a brand like "ProofShow" or "Salesforce", the brand name should retain its left-to-right reading order within the surrounding right-to-left text. Most browsers handle this correctly by default if the surrounding text has the right dir context. The failure mode is when the developer wraps the brand name in a <span dir="ltr"> that has its own conflicting CSS styles, which can produce a visual gap or a font-weight inconsistency at the boundary.
Pattern B — Numbers and currency in mixed-direction context. A quote like "We saved $50,000 in the first quarter" rendered into Arabic becomes a bidirectional string: the Arabic text is right-to-left, the dollar amount is left-to-right, the currency symbol is positionally fixed to the digits. The Unicode bidirectional algorithm handles the dollar amount as a left-to-right "number run" embedded in right-to-left context. The failure mode is when the developer manually reverses the digits thinking the rendering needs help, which produces double-mirroring and a visible "$000,05" output.
Pattern C — Email addresses and URLs. Customer email addresses and company URLs are left-to-right by definition. When they appear in attribution lines or callouts in an RTL card, the bidi algorithm handles them as embedded LTR runs. The failure mode is when the surrounding RTL layout uses CSS direction overrides that conflict with the embedded direction marker, producing a partial reversal where the local part of the email appears in the wrong place relative to the domain.
The rule for all three patterns is the same: use the natural Unicode characters and let the bidi algorithm handle it. Avoid manual string reversal, avoid mid-string dir overrides unless the content is genuinely ambiguous, and verify the rendered output in a real RTL browser context (not just a dir="rtl" toggled in DevTools) before shipping.
The attribution and date conventions that distinguish localized from translated
Three attribution conventions and three date conventions show up across well-localized RTL testimonial sections. They are worth codifying as defaults.
Attribution Convention A — Name and title only, no company suffix. The English "Sarah Chen, VP of Marketing at Acme Inc." pattern shortens in many RTL contexts to "سارة تشن، نائبة الرئيس للتسويق" — the company is conveyed by the company logo and the name+title is sufficient. The convention reduces visual weight and matches the more formal RTL register.
Attribution Convention B — Honorific prefix before name. Arabic and Hebrew both have honorific forms ("الأستاذة" in Arabic, "מר" or "גב'" in Hebrew) that can prefix the name in formal contexts. B2B testimonials targeting institutional audiences typically include the honorific. Consumer testimonials usually do not.
Attribution Convention C — Company-first formal style for institutional testimonials. Government and large-enterprise testimonials in Arabic frequently lead with the institution name, then the role, then the personal name — the opposite of the English convention. This is a register choice, not a universal rule.
Date Convention A — Gregorian in Arabic-Indic digits. "مارس ٢٠٢٦" — Western calendar, Arabic-Indic numerals. This is the most common pattern across Egyptian, Levantine, and Gulf consumer audiences.
Date Convention B — Gregorian in Western digits. "مارس 2026" — Western calendar, Western numerals. This is common in Israeli Hebrew and in modern Arabic business contexts where Western digits are increasingly default for technical and financial content.
Date Convention C — Hijri with Gregorian in parentheses. "ربيع الآخر ١٤٤٧ هـ (مارس ٢٠٢٦)" — Hijri calendar primary, Gregorian secondary. This is the formal Saudi standard for government and traditional commercial contexts.
The choice among these conventions is a per-locale, per-audience decision that should be made once and applied consistently across the testimonial section, not chosen ad hoc per card.
The verification checklist for an RTL testimonial card
When the RTL testimonial section is ready for release review, the five checks below catch most of the failures that an English-trained reviewer cannot see.
- Visual mirror check. Open the card in a real RTL browser context (Arabic or Hebrew system locale, not just a
dir="rtl"toggle). Confirm that the avatar is on the right, the name and title are to its left, the quote mark glyph is on the right of the quote, and the metric block is on the side that matches the local reading flow. - Numeral and currency check. Confirm that the digit family matches the locale decision (Arabic-Indic or Western), that the percentage symbol matches the locale convention (
%or٪), and that currency symbols sit on the side of the digit that matches the local convention. - Date and calendar check. Confirm that the date renders in the chosen calendar (Gregorian, Hijri, or both), in the chosen digit family, and using the chosen month name conventions (Arabic transliteration of Western months, Arabic native month names, or Hebrew month names depending on locale).
- Bidi inline content check. Confirm that any embedded Latin brand names, URLs, email addresses, or numbers in the quote body render in their natural LTR order without manual reversal, and that the bidi boundaries do not introduce visible font or weight inconsistencies.
- Attribution line convention check. Confirm that the name-title-company order matches the locale convention chosen for the section (Name-first, Company-first formal, or honorific-prefixed), and that the convention is applied consistently to every card in the section, not chosen per card.
A card that passes all five checks reads as native to the locale. A card that fails one or two of them reads as translated. A card that fails three or more reads as a Western page with dir="rtl" toggled.
The decision rule for RTL investment
The RTL testimonial section is worth the localization investment in three situations. It is not worth it in one.
Worth it when the locale represents over 5% of pipeline. The threshold is empirical — below 5%, the per-locale design system overhead exceeds the conversion lift. Above 5%, the lift from a card that reads as native typically justifies the work.
Worth it when the brand is positioning explicitly for the locale. A SaaS company that has hired regional sales staff, has localized pricing, and is investing in regional marketing should not ship testimonials that read as translated artifacts. The testimonial section is one of the highest-credibility components on the page — a mismatch here undermines the rest of the localization.
Worth it when competitors have not localized. If the dominant Arabic-speaking SaaS competitor in the category is shipping dir="rtl"-toggled testimonials with mirrored numerals, a properly localized RTL testimonial section is a differentiation lever. The cost is one design sprint; the benefit is durable.
Not worth it when the locale is a single-customer experiment. A pilot deployment to a single Arabic-speaking customer does not need a fully localized RTL testimonial section. A clean English testimonial section is preferable to a half-localized RTL section, which signals incomplete investment.
The decision rule connects to the broader localization choices covered in the testimonial localization for multi-language sites guide — RTL is one of several localization tracks, and the prioritization across them should be coherent.
Implementation patterns that scale across locales
When the testimonial section is being designed for one RTL locale, it is worth designing for the structural pattern rather than the specific locale. Three implementation patterns scale.
Pattern 1 — Logical CSS properties everywhere. Replace every margin-left, padding-right, text-align: left with margin-inline-start, padding-inline-end, text-align: start. The CSS logical properties flip automatically based on the dir attribute, removing the need for [dir="rtl"] override blocks throughout the stylesheet.
Pattern 2 — Locale-specific content tokens, not translated strings. Date format, digit family, attribution order, and quote mark glyph are content decisions per locale. Expose them as locale-keyed tokens (date-format-saudi-formal, digit-family-egyptian-consumer, attribution-order-israeli-hebrew) rather than translating English strings in place. The token system makes the localization decisions auditable and reusable.
Pattern 3 — Bidi-aware quote rendering component. Build the quote body, attribution, and metric block as components that accept content in any direction and render it correctly. The component should not assume any specific direction — it should let the surrounding dir context drive the layout and let the Unicode bidi algorithm handle inline mixed-direction content. The same component then works for English, Arabic, Hebrew, and Persian without per-locale forks.
The patterns are the design-system investment that makes RTL the third or fourth locale, not the first locale-shaped exception. They pay back at the second RTL locale shipped, not the first — which is part of the broader argument for treating testimonial localization as a system question rather than a per-market translation project.