リクエスト広場

横並びプレビュー時フォントサイズがおかしい

3 コメント
views
4 フォロー

編集エディターの横並びプレビュー時、フォントサイズがおかしいです。
サイト設定では12pxを指定していますが、横並びプレビューでは13pxで表示されます。
しかしこの現象は横並びプレビュー時のみです。
更新して本文に反映すると正常になります。
他のプレビューモードでは正常に表示されます。
以下の画像の通りです。"と"の位置に着目してください。
画像1
画像2

確認はWindows10のFirefoxとEdgeで行いました。

サンプル

あいうえおかきくけこさしすせそたちつてと サイト設定12未指定時
#size(13){{
あいうえおかきくけこさしすせそたちつてと 13
}}
#size(12){{
あいうえおかきくけこさしすせそたちつてと 12
}}
01v
作成: 2022/08/07 (日) 19:30:49
通報 ...
1
ハムスター 2022/08/08 (月) 00:30:28 c73c0@e8607

これはデバイスに合わせて文字を見やすくするための仕様なのではないでしょうか。
昨年の5月頃にwikiwikiはレスポンシブデザインになりましたが、
それ以前の「PC向け」と「スマホ向け」でデザインが異なっていた頃から、このような仕様でした。
たとえば、wikiの基本文字サイズが12pxに設定されている場合、
「PC向けデザイン」ではそのまま12pxで表示され、「スマホ向けデザイン」では13pxで表示されていました。

「スマホ向けデザイン」が廃止され、レスポンシブデザインになった現在はどうなってるのかというと、
モニタの横幅が一定以下になると、wikiのメニューバーなどの配置が、スマホ・タブレット向けの表示に切り替わり、
wikiの基本文字サイズが12pxに設定されていても、以前の「スマホ向けデザイン」のように13pxで表示されます。

たとえば、FirefoxでもChromeでもどちらでもいいですが、ブラウザのウィンドウの横幅をマウスでドラッグして調整してみてください。
横幅が一定以下になると、左側にあるメニューバーが下側に配置され、スマホ・タブレット向けの表示になるはずです。
この表示に切り替わったとき、フォントの大きさに注目してください。13pxになってるはずです。
※wikiの基本文字サイズとは別に、フォントサイズを指定した場合は、表示が切り替わっても指定したサイズが維持されます。

つまり、質問の「横並びプレビューでは13pxで表示される」のは、
表示領域の横幅が足りないため、スマホ・タブレット向けの表示でプレビューされているということです。
このような仕様になってるようなので、表などを作った場合は「スマホやタブレットのユーザーにはどんな風に見えるのか」なども意識するといいと思います。
フォントが大きくなると意図しない改行などがある場合がありますから。

2
01v 2022/08/08 (月) 08:32:49

なるほど、その通りかもしれません。スマホで見るとサイズ未指定時は13pxと同じに見えます。後日PCでも幅を変更して確認します。
この現象のせいでプレビューの表の幅の辻褄が合わず、時間をくいました。

3
01v 2022/08/13 (土) 10:35:31

確認しました。横並びプレビューで、ブラウザーを横方向に拡大していくと、ある幅を境に表示が13px→12pxにかわりました。他にも画面全体の行の開始位置もかわりました。
また、プレビューではなく通常表示においてブラウザーの横幅を狭めていくと、ある幅を境に12px→13pxにかわりました。
ご指摘の通りこの動作は表示幅が狭いときはデバイス側の表示体が小さいとみなしてフォントを自動で拡大する機能のようです。よって不具合ではなく仕様であると解釈しました。