On each web page, are changes of reading direction indicated?

A screen reader that encounters an Arabic excerpt on a French page without a dir attribute may announce the characters in the wrong order, making the text incomprehensible. The browser's bidi algorithm can also misplace punctuation or reverse word sequences. No dir attribute, no meaning.

This criterion applies whenever a page contains a passage in a language whose reading direction is opposite to the document's default reading direction. For a French page (left-to-right), this concerns Arabic, Hebrew, Persian, and Urdu. Each relevant passage must be wrapped in an HTML tag carrying a dir attribute.

The expected value is rtl (right-to-left) for right-to-left texts inserted in an ltr page, or ltr for left-to-right text in an rtl document. The value must be relevant: a dir="rtl" applied to Latin alphabet text fails test 8.10.2.

Do not confuse the HTML dir attribute with the CSS direction property. The latter affects visual display but is ignored by assistive technologies. Only the dir attribute in the markup is recognized by screen readers.

2 tests to verify the consistency of reading order

dir attribute on passages with reversed reading direction

  1. Identify on the page all text passages written in a language whose reading direction is opposite to that of the document (e.g., Arabic or Hebrew on a French page).
  2. For each identified passage, verify that the HTML tag containing it has a dir attribute.
  3. If all passages have a dir attribute on their container element, the test is validated. If even one passage lacks it, the test fails.

Validity and relevance of dir attribute value

  1. For each passage validated in test 8.10.1, verify that the value of dir is correct: rtl for text that reads right to left, ltr for text that reads left to right.
  2. Verify that this value is relevant to the language of the passage: dir="rtl" on Arabic text is relevant; dir="rtl" on French text is not.
  3. If both conditions are met for each passage, the test is validated.

Examples

❌ Non-compliant : Arabic text without reading direction indication

<p>This word means "hello" in Arabic: <span>مرحبا</span>.</p>

The absence of a dir attribute leaves the browser to manage bidi via the Unicode algorithm, with unpredictable results. Punctuation can end up on the wrong side and some screen readers traverse characters in Latin visual order, making the Arabic word unintelligible.

✅ Compliant : Arabic text with dir and lang attributes

<p>This word means "hello" in Arabic: <span dir="rtl" lang="ar">مرحبا</span>.</p>

The dir="rtl" attribute explicitly indicates that this passage reads right to left. Assistive technology knows the order in which to traverse the characters. The lang="ar" attribute is not required by this criterion but strongly recommended: it allows the screen reader to switch to an Arabic voice and pronounce the text correctly.

Tips and pitfalls

⚠️ CSS direction: rtl does not replace the dir attribute

This is the most frequent error in audits on this criterion. The CSS direction: rtl property modifies visual display but NVDA, JAWS, and VoiceOver ignore it completely. Only the HTML dir attribute is interpreted by assistive technologies. A site that drives bidi only via CSS fails test 8.10.1.

💡 Always associate dir and lang on the same element

The dir attribute signals reading direction; lang signals language. The two are technically independent, but combining them on the same tag produces the best result: the screen reader switches to the appropriate voice and reads in the correct direction. Example: <span dir="rtl" lang="ar">...</span>.

⚠️ Nested bidi passages: URLs and numbers in Arabic text

Arabic text may contain a URL or phone number that reads left to right. This sub-passage must itself be wrapped in a tag with dir="ltr". The criterion applies recursively. This is rare on French pages, but common on multilingual interfaces with frequent mixing of Latin and Semitic content.

⚠️ Criterion not applicable if no RTL text is present

If your page contains no passages in a right-to-left writing language, this criterion is not applicable (NA). It is not necessary to add dir="ltr" to all elements on a French page: it is the default direction. The <html lang="fr"> tag without a dir attribute already implies ltr.

Frequently asked questions

Why verify RGAA criterion 8.10 even without Arabic or Hebrew text?

You shouldn't. This criterion is not applicable as soon as the page contains no passages in a language with inverted reading direction. A page entirely in French, English, or any other ltr language is outside the scope of criterion 8.10.

On which HTML tags is the dir attribute valid according to RGAA?

dir is a global HTML attribute, usable on virtually any element: <span>, <p>, <div>, <blockquote>, <td>, etc. Prefer the tag closest to the text in question to prevent the attribute from applying to too broad a scope and disrupting the layout of adjacent elements.

How can you test RGAA criterion 8.10 without using a screen reader?

Inspect the source code: visually identify Arabic, Hebrew, or Persian characters, then verify in DevTools that their containing tag (or a direct ancestor) bears dir="rtl". With NVDA or VoiceOver, read the passage aloud: if the pronunciation is correct and in the right order, the reading direction is properly signaled.

What is RGAA's position on using dir="auto"?

RGAA requires explicit values: ltr or rtl. The auto value lets the browser automatically detect the direction, which can work visually but remains unreliable for assistive technologies depending on browser and screen reader combinations. Use rtl or ltr explicitly to guarantee compliance with test 8.10.2.

References