Techniques for WCAG 2.0

On this page:

-

# H34: Using a Unicode right-to-left mark (RLM) or left-to-right mark (LRM) to mix text direction inline

## Applicability

HTML and XHTML

This technique relates to:

- Success Criterion 1.3.2 (Meaningful Sequence)
  - How to Meet 1.3.2 (Meaningful Sequence)
  - Understanding Success Criterion 1.3.2 (Meaningful Sequence)

## Description

The objective of this technique is to use Unicode right-to-left marks and left-to-right marks to override the HTML bidirectional algorithm when it produces undesirable results. This may be necessary, for instance, when placing neutral characters such as spaces or punctuation between different directional text runs. The concepts used in this technique are described in What you need to know about the bidi algorithm and inline markup.

Unicode right-to-left marks and left-to-right marks can be entered directly or by means of character entities or numeric character references, as shown here.

- left-to-right mark: &lrm; or &#x200e; (U+200E)

- right-to-left mark: &rlm; or &#x200f; (U+200F)

Due to the bidi algorithm, a source code editor may not display character entities or numeric character references as expected.

## Examples

### Example 1

This example shows an Arabic phrase in the middle of an English sentence. The exclamation point is part of the Arabic phrase and should appear on its left. Because it is between an Arabic and Latin character and the overall paragraph direction is LTR, the bidirectional algorithm positions the exclamation mark to the right of the Arabic phrase.

The title is "مفتاح معايير الويب!" in Arabic.

Visually-ordered ASCII version (RTL text in uppercase, LTR in lower):

the title is "HCTIWS SDRADNATS BEW!" in arabic.

Inserting a Unicode right-to-left mark in the code immediately after the exclamation mark positions it correctly when you view the displayed text (see below). You can use a character escape or the (invisible) control character to insert the right-to-left mark.

The title is "مفتاح معايير الويب!‏" in Arabic.

Visually-ordered ASCII version:

the title is "!HCTIWS SDRADNATS BEW" in arabic.

## Resources

Resources are for information purposes only, no endorsement implied.

- Authoring Techniques for XHTML & HTML Internationalization: Handling Bidirectional Text 1.0

- Mixing text direction inline

- What you need to know about the bidi algorithm and inline markup

- Problems with bidirectional source text

## Related Techniques

- H56: Using the dir attribute on an inline element to resolve problems with nested directional runs

## Tests

### Procedure

1. Examine the source for places where text changes direction.

2. When text changes direction, check whether neutral characters such as spaces or punctuation occur adjacent to text that is rendered in the non-default direction.

3. When #2 is true and the HTML bidirectional algorithm would produce the wrong placement of the neutral characters, check whether the neutral characters are followed by Unicode right-to-left or left-to-right marks that cause neutral characters to be placed as part of the preceding characters.

### Expected Results

- Check #3 is true.

- Top
- Contents
- Intro
- Previous: Technique H33
- Next: Technique H35