タイトルはそんなに気にしてはいけない。

こんにちは。
まず、アクセス数200達成しました。ありがとうございます。

最近、俺が使っているWebブラウザ「Mozilla Firefox」がHTMLの <ruby> 要素に対応したらしい。
これは、読んで字のごとく「ルビ」を振るときに使うのだが……

この要素、一筋縄ではいかないのだ。

まずは、Mozillaの公式ブログをご覧いただこう。

え、めんどい? ならば引用だ。
<ruby> の使い方を、ソースを載せて説明している部分。

<ruby>
  <rb>とある<rb>科学<rb>の<rb>超電磁砲</rb>
  <rp>(</rp><rt>とある<rt>かがく<rt>の<rt>レールガン</rt><rp>)</rp>
</ruby>

引用元:https://hacks.mozilla.org/2015/03/ruby-support-in-firefox-developer-edition-38/

 

おわかりいただけただろうか。

 

何なんだよこのくっそめんどくさいタグは?!!!!!

そもそも意味わからん……

  • <ruby> - ルビを振る範囲を示す
  • <rb> - ルビベース(ルビを振られる言葉)を示す
  • <rp> - ルビに対応していないブラウザで、ルビの前後に表示する括弧などを示す
  • <rt> - ルビを示す

ということなんだけど。

閉じタグがいらないとか、同じタグが何度も出てくるとか、とにかく理解不能。

というか、こんなタグ手打ちできねーよ。

かといってコピペもめんどくせーよ。

 

……と思ったら。

Actually, if you don’t have those requirements, only <ruby> and <rt> are necessary. For simplest cases, e.g. a single ideographic character, you can use code like:

<ruby>咲<rt>Saki</rt></ruby>

引用元:https://hacks.mozilla.org/2015/03/ruby-support-in-firefox-developer-edition-38/

意訳:最悪、こっちでもいいよ。

……なんのこっちゃ。

俺、こっち使うわ。

と言いたいところだが。

まだ各種ブラウザの対応状況も芳しくないし、このサイト&ブログでは独自にカスタマイズした <span> タグを使ってるわ。

とある<span class="ruby">魔術<span class="rt">まじゅつ</span></span>の<span class="ruby">禁書目録<span class="rt">インデックス</span></span>

これにCSSと、見た目を整えるためのJavaScriptとを使って表示するとこんな感じ。

とある魔術まじゅつ禁書目録インデックス

 

一日も早く、すべてのブラウザでもっと使いやすいルビが実装されることを願っています。

 

P.S. タイトルは公式の中の人のせいだ。