<rt>

Zuletzt aktualisiert am 6. Februar 2026

Das <rt> Element definiert den eigentlichen Annotationstext in einer Ruby-Annotation. Es enthält die kleine Schrift, die über oder neben den Basiszeichen angezeigt wird, beispielsweise Furigana in japanischen Texten oder Aussprachehinweise in anderen Sprachen.

Grundlagen

• Muss immer innerhalb eines <ruby> Elements stehen
• Enthält den Lesehinweis oder die Aussprache für die Basiszeichen
• Wird typischerweise in kleinerer Schrift über dem Basistext dargestellt
• Essentiell für Ruby-Annotationen in ostasiatischen Sprachen
• Kann mehrfach pro <ruby> Element verwendet werden
• Inline-Element ohne spezifische HTML-Attribute

Syntax

<ruby>漢<rt>かん</rt>字<rt>じ</rt></ruby>

Beispiele

Japanisches Furigana

<p>Ich lerne <ruby>日<rt>に</rt>本<rt>ほん</rt>語<rt>ご</rt></ruby> (Japanisch).</p>

Mehrere Zeichen mit separaten Annotationen

<p>Das Wort <ruby>東<rt>とう</rt>京<rt>きょう</rt></ruby> bedeutet "Tokio".</p>

Aussprachehinweise für chinesische Zeichen

<p>Das chinesische Zeichen <ruby>中<rt>zhōng</rt>国<rt>guó</rt></ruby> steht für China.</p>

Koreanische Hanja mit Hangul-Lesung

<p>Das koreanische Wort <ruby>大<rt>대</rt>韓<rt>한</rt>民<rt>민</rt>國<rt>국</rt></ruby> bedeutet Südkorea.</p>

Barrierefreiheit

Das <rt> Element bietet wichtige Unterstützung für Nutzer, die mit der Schrift nicht vertraut sind. Screenreader lesen sowohl das Basiszeichen als auch die Annotation vor, was die Verständlichkeit erhöht.

Beachte diese Punkte für bessere Barrierefreiheit:

• Verwende <rt> nur für tatsächliche Lesehinweise, nicht für dekorative Zwecke
• Stelle sicher, dass der Text auch ohne Ruby-Unterstützung verständlich bleibt
• Nutze <rp> für Browser, die Ruby-Annotationen nicht unterstützen
• Die Annotation sollte kurz und prägnant sein

Häufige Fehler

<rt> außerhalb von <ruby> verwenden

Das <rt> Element funktioniert nur innerhalb eines <ruby> Elements. Ohne diesen Container verliert die Annotation ihre semantische Bedeutung und wird als normaler Text dargestellt.

<!-- Falsch: rt ohne ruby -->
<p>漢字<rt>かんじ</rt></p>

<!-- Richtig: rt innerhalb ruby -->
<p><ruby>漢字<rt>かんじ</rt></ruby></p>

Zu lange Annotationen

Annotationen sollten kompakt sein. Lange Texte im <rt> Element können das Layout stören und die Lesbarkeit verschlechtern.

<!-- Nicht optimal: zu lange Annotation -->
<ruby>猫<rt>Eine kleine, domestizierte Katze</rt></ruby>

<!-- Besser: kurze Annotation -->
<ruby>猫<rt>ねこ</rt></ruby>

Fehlende Zuordnung zwischen Basis und Annotation

Jedes <rt> Element sollte eindeutig einem Basistext zugeordnet sein. Vermeide mehrdeutige Strukturen, die unklar machen, zu welchem Zeichen die Annotation gehört.

<!-- Unklar: welche Annotation gehört wohin? -->
<ruby>東京<rt>とうきょう</rt></ruby>

<!-- Klar: jedes Zeichen hat seine Annotation -->
<ruby>東<rt>とう</rt>京<rt>きょう</rt></ruby>

Browser-Kompatibilität

Das rt-Element wird von allen modernen Browsern unterstützt und ist seit HTML5 Standard.

Email-Kompatibilität

Ruby-Annotationen werden in E-Mail-Clients nur eingeschränkt unterstützt. Der Inhalt bleibt lesbar, die Formatierung kann aber verloren gehen.

Verwandte Elemente