Bidirectional text

Hebrew and Arabic are read from the right. Numbers are read from the left, in every script on earth, and so are Latin words, so a sentence in Hebrew that mentions a product name and a year contains three runs going one way and two going the other. Bidirectional text is the name for that mixture, and for the algorithm that resolves it: Unicode Annex 9 assigns every character a direction, groups adjacent characters of the same direction into runs, and then orders the runs according to the paragraph’s base direction while each run keeps its own internal order. The result is that the memory order of the characters (what someone typed) and the visual order on screen (what they read) are simply different sequences, and neither is wrong.

Everything hangs on the base direction, and the base direction is a declaration rather than a guess. dir="rtl" on the element, or dir="auto" to let the browser take it from the first strongly directional character, tells the algorithm which way the paragraph runs. Leave it off and the paragraph inherits whatever the page said, usually left to right, and the runs come out in the order they were typed instead of the order they should be read. The visible symptom is punctuation and numbers landing on the wrong end of a sentence: a trailing question mark drifting to the left edge, a year jumping to the front. That failure is why user-generated content needs dir="auto" per item rather than one direction for the whole page, and it is why the CSS logical properties (margin-inline-start, text-align: start) exist, so a stylesheet can stop naming physical sides.

Neutral characters are where the sharp edges live. Spaces, hyphens, brackets and punctuation have no direction of their own and take one from their neighbours, so (1974) beside a Hebrew word can end up with its parentheses swapped, and a hyphen between a Hebrew word and a Latin one can attach to either side. The Unicode isolate controls are the fix, and CSS spells them unicode-bidi: isolate and plaintext: an isolated run cannot influence the ordering of anything outside it, which stops an interpolated username or filename from rearranging the sentence around it.

Do not confuse this with RTL mirroring. Mirroring is a layout decision: the navigation moves to the right, the back arrow points the other way, progress fills leftward. Bidirectional text is what happens inside a text run, and it happens whether or not the layout was ever mirrored. An English page listing Arabic book titles needs bidi handling and no mirroring at all, and a fully mirrored Arabic interface still gets its phone numbers wrong if the text runs are not resolved. The directionality declaration is what both of them read from, and it is the one thing neither can be done without.