What is 유니코드 양방향 알고리즘 (UBA)?

문자 양방향 범주와 명시적 방향 재정의를 사용하여 혼합 방향 텍스트(예: 영어 + 아랍어)의 표시 순서를 결정하는 알고리즘.

What is 양방향 범주?

양방향 텍스트(왼쪽에서 오른쪽, 오른쪽에서 왼쪽, 약, 중립)에서 문자의 동작 방식을 결정하는 속성. 표시 순서를 결정하기 위해 유니코드 양방향 알고리즘이 사용합니다.

타이포그래피

RTL (오른쪽에서 왼쪽)

문자가 오른쪽에서 왼쪽으로 흐르는 텍스트 방향. 아랍어, 히브리어, 타아나 문자 등에서 사용되며, 올바른 표시를 위해 양방향 알고리즘이 필요합니다.

2023-06-12 · Updated 2024-08-21

What is RTL (Right-to-Left)?

RTL stands for Right-to-Left, describing text that is written and read from right to left. Arabic, Hebrew, Persian (Farsi), Urdu, and several other scripts are inherently RTL. This is not a stylistic choice — it is the fundamental direction of these writing systems, as fixed by their orthographic traditions dating back thousands of years. Proper RTL support requires changes at every layer of text technology: from Unicode's bidirectional algorithm to CSS properties to HTML markup.

Unicode Bidirectional Algorithm (Bidi)

The Unicode Bidirectional Algorithm (UAX #9) is the specification for how to display text that mixes LTR and RTL content — called bidirectional or bidi text. Because a single paragraph might contain English, Arabic, and numbers all together, a strict mechanical rule set is needed to determine the display order of each run.

The algorithm assigns every character a bidi category: - L (Left-to-Right): A–Z, Latin digits, most punctuation - R (Right-to-Left): Hebrew characters - AL (Arabic Letter): Arabic, Thaana, Syriac characters - AN (Arabic Number): Arabic-Indic digits - EN (European Number): 0–9 ASCII digits

The algorithm then resolves the visual ordering based on the paragraph's base direction and these per-character categories.

Bidi Control Characters

Unicode provides invisible characters to explicitly override the automatic bidi behavior:

Character	Unicode	Name	Effect
RLM	U+200F	Right-to-Left Mark	Forces bidi context rightward
LRM	U+200E	Left-to-Right Mark	Forces bidi context leftward
RLE	U+202B	Right-to-Left Embedding	Start RTL embedding
LRE	U+202A	Left-to-Right Embedding	Start LTR embedding
RLO	U+202E	Right-to-Left Override	Force all text RTL
LRO	U+202D	Left-to-Right Override	Force all text LTR
PDF	U+202C	Pop Directional Formatting	End an embedding/override
RLI	U+2067	Right-to-Left Isolate	RTL bidi isolate (modern)
LRI	U+2066	Left-to-Right Isolate	LTR bidi isolate (modern)
PDI	U+2069	Pop Directional Isolate	End isolate

The RLO character (U+202E) was notoriously abused in filenames to disguise file extensions: Vacation‮gpj.exe would display as Vacationgpj.exe visually.

RTL in HTML and CSS

<!-- Set paragraph direction -->
<p dir="rtl">مرحبا بالعالم</p>

<!-- HTML attribute on document root -->
<html lang="ar" dir="rtl">

<!-- Use the <bdi> element for user-generated content of unknown direction -->
<p>Posted by <bdi>محمد</bdi> yesterday</p>

/* CSS direction property */
.arabic-text {
  direction: rtl;
  text-align: right; /* or use text-align: start (logical) */
}

/* CSS logical properties (preferred for bidi) */
.box {
  margin-inline-start: 1em;  /* left in LTR, right in RTL */
  padding-inline-end: 0.5em; /* right in LTR, left in RTL */
  border-inline-start: 2px solid; /* left border in LTR */
}

Mirroring in RTL

When a UI is mirrored for RTL, directional icons must also be mirrored: a "forward" arrow in LTR points right (→), but in RTL it should point left (←). Layout elements like sidebars, toolbars, and scrollbars typically mirror position.

Quick Facts

Property	Value
RTL scripts	Arabic, Hebrew, Persian, Urdu, Thaana, Syriac, N'Ko, Tifinagh
Unicode bidi spec	UAX #9 (Unicode Standard Annex 9)
HTML direction attribute	`dir="rtl"` or `dir="ltr"`
CSS property	`direction: rtl`
Right-to-Left Mark	U+200F (RLM)
Right-to-Left Override	U+202E (RLO) — security risk
Modern isolate characters	RLI (U+2067), LRI (U+2066), PDI (U+2069)
CSS logical properties	`margin-inline-start`, `padding-inline-end` for bidi-aware layout