差分

テンプレート:RB (編集)

2022年1月27日 (木) 14:36時点における版

859 バイト追加、 2022年1月27日 (木) 14:36

編集の要約なし

3行目: 3行目:

==== 表示形式 ====

−

<code><nowiki>{{RB|漢字|カタカナ}}</nowiki></code> と書くと、'''{{RB|漢字|カタカナ}}'''のようにルビを振ることができます。

+

<code><nowiki>{{RB|漢字|カタカナ}}</nowiki></code>と書くと、'''{{RB|漢字|カタカナ}}'''のようにルビを振ることができます。

記事のプレビュー・目次などルビが振れられない所には'''漢字（カタカナ）'''とルビは後付きの括弧の中に入れて表示されます。

−

IE8とその以前のIEによる閲覧の場合に'''漢字<rt style="font-size: 50%~~; height: 0~~; vertical-align: super;">（カタカナ）</rt>'''とルビは上付き文字にして表示されます。

+

IE8とその以前のIEによる閲覧の場合に'''漢字<rt style="font-size: 50%; vertical-align: super;">（カタカナ）</rt>'''とルビは上付き文字にして表示されます。

−

~~==== ルビを隠す ====~~

−

<code><nowiki>{{RB|漢字|カタカナ|hidden=1}}</nowiki></code> と書くと、'''{{RB|漢字|カタカナ|hidden=1}}'''のようにルビは表示されませんが、ルビが振られているかのようにコピーアンドペーストや読み上げソフトに反映されます。同一ページにてルビを振るのを統一するのを推奨しますが、ルビが多過ぎて閲覧に影響を与えた場合に一部を隠すことができます。

==== コピーアンドペーストについて ====

17行目: 14行目:

==== 読み上げについて ====

閲覧環境にもよるが、「漢字とそのルビがその間に一拍が入るようにそれぞれ読み上げられる」と、「ルビのみが読み上げられる」という二種類のパターンが確認されています。こちらも同じく、ルビの表示形式にはかかわっていません。

+

==== iOS上のSafariの「デスクトップ閲覧」について ====

+

iOS上のSafariの「デスクトップ閲覧」では、ルビが振れた文字はルビごと全体的に縮小しているように見える。本サイトだけではなく、どのサイトを閲覧してもこういう問題が起こる。これはSafariの「デスクトップ閲覧」だけに存在するバグだと見なされ、現時点では副作用のない解決策はまた見つかっていない。

+

将来解決策または代用の検討を想定し、この問題に付いての研究を記載する。

+

その原因として、正文が閲覧に支障が出る程文字サイズが小さくとスマホ上のブラウザに見なされていれば、ブラウザはそれを拡大する。特にパソコンを想定したデスクトップ版ウェブページでは、正文がスマホによって拡大されることが起こしやすい。しかし、Safariの該当機能は<code><nowiki><code></nowiki></code>や{{RB|<nowiki><ruby></nowiki>|ルビ}}など、一部のHTMLタグを対象外とし、拡大せず、周りの正文と比べれば縮小したように見える。

+

{| class="wikitable"

+

! !! !!

+

|-

+

| 複数列の表の内容はスマホによって拡大されない為、 || <code><nowiki><code></nowiki></code>や{{RB|<nowiki><ruby></nowiki>|ルビ}}が || 縮小するような問題は起こさない。

+

|}

+

iOS上のSafariの「デスクトップ閲覧」を想定した上、正文の中での使用を控え、複数列の表に限りルビを使用する。

[[Category:記事テンプレート]]

−

</noinclude><includeonly><ruby ~~style="text-indent: unset; font-size: unset;"~~>{{{1}}}~~{{#switch:{{{hidden}}}|1=<rt style="font-size: 0; height: 0; vertical-align: super;">（{{{2}}}）</rt>|#default=~~<rt style="font-size: 50%~~; height: 0~~; vertical-align: super;">（{{{2}}}）</rt>}}</ruby></includeonly>

+

</noinclude><includeonly><ruby>{{{1}}}<rt style="font-size: 50%; vertical-align: super;">（{{{2}}}）</rt></ruby></includeonly>

あれを使おう

649

回編集