ルビ(振り仮名)。

ルビ(振り仮名)・目次。

ルビ(振り仮名)について。

XHTML 1.1では、文書中の振り仮名に特別なマークアップを施す事で、ルビとして処理出来る機能が追加されております。

ルビ(振り仮名)の仕様。

ルビを振るための要素が策定されるまで。

HTML文書中のフレーズにルビ(振り仮名)を振るための要素は、HTML 4.0の頃から策定作業が行われておりました。

その後、XHTML 1.1が策定され、XHTMLに任意のモジュールを付ける事で要素の拡張が出来るようになりました。

このため、ルビ関連要素は、XHTMLに追加出来るモジュールとして勧告され、その後XHTML 1.1にて初めて搭載されました。

策定作業中は、勧告案などが逐次公開されていたため、マイクロソフトはまだ正式な仕様となっていないにも拘らず、インターネットエクスプローラ5.x以降に実装してしまいました。

ルビ関連要素の実装状況。

今のところ、他のブラウザでは実装していないようですが、XHTML 1.1では公式に利用出来る要素ですので、利用する事は全く問題はありません。

ルビ関連要素の実際。

それでは、実際にルビ(振り仮名)関連要素を見てみましょう。

<ruby>要素 - ルビの掛かるテキストとルビを明示する。

ルビの掛かるテキストは、以下のように<ruby>要素としてマークアップします。

<ruby><rb>ルビが掛かるテキスト</rb><rp>(</rp><rt>ルビに相当するテキスト</rt><rp>)</rp></ruby>

ちょっと複雑ですが、要は

  1. ルビに相当するテキストを括弧で囲んで
  2. ルビが掛かるテキストの後ろに付けたもの

を<ruby>要素にすれば良い訳です。

ルビ関連要素をサポートしない環境では、これらのタグは無効なものとされるため、オフラインでも新聞などルビの表示の困難な環境でしばしば見られる、ルビに当たるテキストがルビの掛かるテキストの後ろに括弧で囲んで記述されたように扱われるでしょう。

尚、<ruby>要素は、テキストの一部を指定する要素ですので、当然インライン要素となります。

以下、<ruby>要素の直下に置かれる要素を解説しておきます。

<rb>要素 - ルビが掛かるテキスト。

<rb>要素は、ルビが掛かるテキストです。

<rb>要素の内容としては<ruby>要素以外のインライン要素を含む事が出来ます。

<rt>要素 - ルビとなるテキスト。

<rt>要素は、ルビに相当するテキストです。

<rt>要素の内容としては<ruby>要素以外のインライン要素を含む事が出来ます。

<rp>要素 - ルビ非対応環境で表示させる記号。

一般にルビの表示が困難な環境では(新聞など)、ルビに相当するテキストを括弧などの記号で囲む事でそれとなく分かるようにします。

しかしながら、ルビの表示が出来る環境では、この記号は邪魔なだけです。

そこで、こう言った記号は<rp>要素とする事で対応出来るようにします。

ルビ対応環境では<rp>要素を非表示にしますし、非対応環境では<rp>要素のタグは無効なタグと見做されるため内容はそのまま表示される、すなわち適切な記号が表示されると言う事になります。

内容としては、文字記号のみが入れられます。

ルビ関連要素の注意事項。

<ruby>要素の内容には制限があります。

仕様としては、<ruby>要素の内容は以下の順序になります。

この順序に反した場合や、ここで挙げている要素以外を直下に含んだ場合は文法違反になります。

  1. <rb>要素
  2. <rp>要素…通常は"開き括弧"
  3. <rt>要素
  4. <rp>要素…通常は"閉じ括弧"

尚、仕様上は<rp>要素全く含めないものも認められております(二つある<rp>要素のうち、片方だけを外す事は出来ません)。

従って、以下のような内容も認められます。

  1. <rb>要素
  2. <rt>要素

また、実際にはもっと複雑なルビを記述するための要素も含む事が出来ますが、実装が追い着いていないようですので、当面は覚えなくても良いでしょう。

<ruby>要素の実際。

以下、具体的にマークアップした例を参考に挙げておきましょう。

埼玉県の比企郡滑川町は「なめがわ」と読みますが、富山県の滑川市は「なめりかわ」と読みます。

そこで、地域によっては読み間違える可能性があるという事から、ルビを振った例です。

埼玉県比企郡<ruby><rb>滑川町</rb><rp>(</rp><rt>なめがわまち</rt><rp>)</rp></ruby>は、県のほぼ中心にあります。

これを実際に表示させると、

ルビに対応していない環境でも、違和感無く読めたでしょう。

参考・ルビ要素を使わずにルビを書く方法。

<ruby>要素は、日本語文書で使いたいと思う方も多いかも知れませんが、現在のところXHTML 1.1以外では使えません。

また、<ruby>要素を実装しているウェブブラウザは、今のところインターネットエクスプローラくらいしかありません。

しかしながら、CSSを活用する事で、ルビ要素を使う事無くルビを表現する事が可能です。

具体的な方法はCSS小技集内のルビを振るにはをご覧下さい。

しらぎくのウェブサイト作成入門サイトマップ

ページ外へのご案内。

marguerite.site@gmail.com