Updated / Published

ruby要素はルビの全体を定義します。ルビは主に読みがな (発音ガイド) をつけるために使われ、ベーステキストとルビテキストから構成されます。 ルビを振る対象となる本文部分がベーステキストと呼ばれ、読みがなの部分がルビテキストと呼ばれます。ベーステキストは rb要素で、ルビテキストは rt要素で記述します。

ruby要素に内包される要素の基本形は rb要素, rt要素を1つずつ記述しますが、ルビマークアップのレンダリングに対応していない環境でもベーステキストとルビテキストの内容がわかるように、rb要素, rt要素を1つずつと rp要素を2つ含めて記述することもできます。さらにベーステキストの上下にルビを振る複雑ルビマークアップで複合ルビを作成する場合は rbc要素を1つと rtc要素を2つまで記述することができます。

最初のルビマークアップは1997年2月に IETF に Internet Draft(草稿)として提出されていた Ruby in the Hypertext Markup Language という span要素などに専用の属性を指定する方法が提案されていました。その後、1999年3月にリリースされた Internet Explorer 5.0 が独自機能として先取り実装し、2年遅れでXHTML1.1 で Ruby Annotation として W3C より正式に勧告されました。このため HTML4.01 や XHTML1.0 のバージョンではルビを使用することができません。HTML5の普及に伴い、ルビマークアップのレンダリングに対応している視覚環境の UA は順調に増え Internet Explorer 以外にも Safari, Chrome, Blink版Operaが対応しています(XHTML1.1のルビマークアップには単純ルビマークアップにのみ対応)。現在対応していないのはFirefoxのみです。

バージョン
XHTML1.1
要素型
インライン要素
開始タグ
必須
終了タグ
必須
非推奨
-
内容モデル

ruby要素の属性

共通属性
イベント属性

XHTML1.1 ルビマークアップのサンプル

XHTML1.1には単純ルビマークアップと複雑ルビマークアップがあります。単純ルビマークアップにはInternet Explorer, Safari, Chrome, Blink版Operaが対応していますが、複雑ルビマークアップに対応するUAはありません。また、HTML5ではruby要素の入れ子によって複雑ルビマークアップと同様の表現を実現できるため、今後もXHTML1.1の複雑ルビマークアップのサポートは期待できません。

<ruby><rb>仙人掌</rb><rp>(</rp><rt>さぼてん</rt><rp>)</rp></ruby>
<ruby><rbc><rb>英</rb><rb>語</rb></rbc>
<rtc><rt>えい</rt><rt>ご</rt></rtc>
<rtc><rt rbspan="2">English</rt></rtc></ruby>

単純ルビマークアップに対応していない場合は、「仙人掌(さぼてん)」と表示されます。複雑ルビマークアップに対応していない場合は、「英語 えいご English」と表示されます。