【HTML】rubyタグの使い方！漢字にルビ（ふりがな）を振る方法

テレビのクイズ番組で難読漢字をやってて、「餺飥」を自信満々で「うどん」って答えたら不正解でした。

餺飥ほうとうと饂飩うどんって字が似てるよね。

さて、この漢字の上にフリガナを表示させる方法、
みなさんはご存知でしょうか？

rubyタグの使い方（ルビの付け方）

漢字にルビを振るには、
<ruby>タグと<rt>タグを使います。

漢字ふりがな

これを表現するには以下のようなHTMLコードを書きます。

<ruby>
漢字<rt>ふりがな</rt>
</ruby>

<ruby>で漢字とふりがな全体を囲って、
<rt>でふりがなだけ囲う。

たった、これだけ。簡単でしょ？

難しい漢字や、発音が難しい海外ブランドなんかにルビを振ってあげると
読者にやさしいフレンドリーライティングになりますよ。
ぜひご活用ください。

<ruby>タグの名前は「漢字にルビを振る」のあのルビから来ています。
では、なぜ「ふりがな」のことを「ルビ」と呼ぶのでしょうか？

時は明治時代、活版印刷が普及し日本で初めての新聞が発行されます。
その頃の活字のサイズは5号（10.5ポイント）で、
ふりがなは7号（5.25ポイント）を使うのが一般的でした。

この5.25ポイントがイギリスの出版業界で使われているルビーサイズと近かったため
ふりがなを振ることを「ルビを振る」と呼ぶようになりました。

この「ルビ」は宝石の「ルビー」のことで、
イギリスの出版用語では各サイズごとに宝石の呼び名がつけられています。

イギリスの活字サイズ

ダイヤモンドやパールなんかもあったけど、日本ではルビーだけが定着したんですね。

このページは移転しました。