[HOME]  [リストへもどる]
一括表示

  掲示板のメンテナンス 2022 - konno 22/07/30-23:32 No.10195
 ┣ Re: 掲示板のメンテナンス 2022 - めざら 22/07/31-08:37 No.10196
 ┃┣ Re^2: 掲示板のメンテナンス 2022 - konno 22/07/31-22:03 No.10197
 ┃┗ Re^2: 掲示板のメンテナンス 2022 - としき 22/08/01-01:06 No.10198
 ┃ ┣ Re^3: 掲示板のメンテナンス 2022 - konno 22/08/03-00:58 No.10199
 ┃ ┃┗ Re^4: 掲示板のメンテナンス 2022 - めざら 22/08/03-10:36 No.10200
 ┃ ┃ ┣ Re^5: 掲示板のメンテナンス 2022 - めざら 22/08/03-21:44 No.10203
 ┃ ┃ ┗ CSSで pre,tt の指定 - konno 22/08/03-22:41 No.10204
 ┃ ┃  ┗ Chrome の monospace フォントに関する指定(確定版) - めざら 22/08/05-13:25 No.10207
 ┃ ┃   ┗ Re: Chrome の monospace フォントに関する指定(確定版) - konno 22/08/06-02:14 No.10208
 ┃ ┃    ┣ Re^2: Chrome の monospace フォントに関する指定(確定版) - めざら 22/08/06-08:38 No.10209
 ┃ ┃    ┃┗ Re^3: Chrome の monospace フォントに関する指定(確定版) - konno 22/08/07-00:58 No.10210
 ┃ ┃    ┗ Re^2: 各ブラウザでの見栄え - としき 22/08/13-17:37 No.10211
 ┃ ┃     ┣ Re^3: 各ブラウザでの見栄え - めざら 22/08/13-22:23 No.10212
 ┃ ┃     ┃┗ Re^4: 各ブラウザでの見栄え - としき 22/08/14-00:51 No.10213
 ┃ ┃     ┃ ┗ Re^5: <q>タグと<blockquote> - konno 22/08/14-19:09 No.10218
 ┃ ┃     ┃  ┗ Re^6: <q>タグと<blockquote> - めざら 22/08/14-21:37 No.10220
 ┃ ┃     ┃   ┗ Re^7: <q>タグ出来ました! - konno 22/08/15-14:41 No.10221
 ┃ ┃     ┣ Re^3: 各ブラウザでの見栄え - としき 22/08/14-13:08 No.10214
 ┃ ┃     ┃┗ Re^4: 各ブラウザでの見栄え - めざら 22/08/14-16:44 No.10215
 ┃ ┃     ┃ ┗ Re^5: 各ブラウザでの見栄え - としき 22/08/14-18:03 No.10216
 ┃ ┃     ┃  ┗ Re^6: 各ブラウザでの見栄え - めざら 22/08/14-18:13 No.10217
 ┃ ┃     ┃   ┣ Re^7: 各ブラウザでの見栄え - konno 22/08/14-19:25 No.10219
 ┃ ┃     ┃   ┗ Re^7: 各ブラウザでの見栄え - としき 22/08/17-02:05 No.10226
 ┃ ┃     ┃    ┗ Re^8: 各ブラウザでの見栄え - めざら 22/08/17-13:02 No.10227
 ┃ ┃     ┗ Re^3: 各ブラウザでの見栄え - としき 22/08/26-22:19 No.10278
 ┃ ┃      ┗ Re^4: 各ブラウザでの見栄え - konno 22/08/27-21:27 No.10282
 ┃ ┗ Re^3: 掲示板のメンテナンス 2022 - めざら 22/08/03-17:48 No.10202
 ┃  ┗ Re^4: 掲示板のメンテナンス 2022 - konno 22/08/03-22:49 No.10205
 ┗ BBS新着情報のページを更新 Ver0.82 - konno 22/08/03-23:10 No.10206
  ┣ Re: BBS新着情報のページを更新 Ver0.82 - めざら 22/08/16-22:05 No.10224
  ┃┗ BBS新着情報のページ更新 Ver0.83 - konno 22/08/17-02:01 No.10225
  ┗ BBS新着情報の更新 Ver0.84 - konno 22/08/17-21:38 No.10228

(10195) 10195掲示板のメンテナンス 2022  投稿者:konno   2022/07/30(土) 23:32
   コメント数 2

スパム掃除のついでに掲示板のメンテナンスをしました。

クロム系のブラウザで、記事本文が小さく表示されるのを改善しました。

ヘッダーで、
# 本文の文字サイズ
#$b_size = '17px'; オリジナル
#$b_size = '100%'; 今までこれだった。
$b_size = '120%';  少し大きくした。

こうしたら記事本文の文字が大きくなりました。
今後も気づいたところから直していきます。

      - No.10195 -    このTreeへ           [リストへもどる] soft

(10195) 10196Re: 掲示板のメンテナンス 2022  投稿者:めざら   2022/07/31(日) 08:37
参照先:http://mezala.la.coocan.jp/
    10195 番 konno さんへのコメント    コメント数 2

個人の感想(一般的なウェブアクセシビリティの観点から大きく外れていないと思いますが)を述べさせていただきますと,
特定のWWWブラウザの見え方に依存する変更は「改善」とは言わないと思います。

クロム以外のブラウザでは,とんでもなく(…という程でもないですが)大きな文字で表示されるようになりますよね。
つまり,クロム以外のユーザは排除する方向(…という程でもないですが)と言うか,少なくとも従来の感覚に変更を強いるものですね。

取り敢えず試していただきたいのが,クロムの設定→デザイン→フォントサイズを確認してみることです。
フォントサイズが「中(推奨)」となっているのが普通かと思いますが,ここを調整して手元の環境に合わせるとよいと思います。

もう十年以上経つかと思いますが,その頃から小さなフォントで表示するのが「クール」とされる時代が始まり,
年配者の反感を大いに買ったと思われるわけですが,近年,ディスプレイの解像度が高く(細かく)なり,
逆に文字が小さすぎて若者ですら読みにくいという現象も一部の環境で見られるようです。

      - No.10196 -    このTreeへ    コメント元:10195 へ [リストへもどる] soft

(10195) 10197Re^2: 掲示板のメンテナンス 2022  投稿者:konno   2022/07/31(日) 22:03
    10196 番 めざら さんへのコメント

> クロム以外のブラウザでは,とんでもなく(…という程でもないですが)大きな文字で表示されるようになりますよね。つまり,クロム以外のユーザは排除する方向(…という程でもないですが)と言うか,少なくとも従来の感覚に変更を強いるものですね。

えっ、そんなに違って見えますか・・・
クロム系とファイヤーフォックスで確認してますが、他にチェックすべきブラウザはありますか。

> 取り敢えず試していただきたいのが,クロムの設定→デザイン→フォントサイズを確認してみることです。フォントサイズが「中(推奨)」となっているのが普通かと思いますが,ここを調整して手元の環境に合わせるとよいと思います。

なるほど、「中(推奨)」だと小さく見えるんですね。
「特大」だと大きすぎるので、「大」にしました。
$b_size = '125%'; にしていたので、110% に変えてみました。

> もう十年以上経つかと思いますが,その頃から小さなフォントで表示するのが「クール」とされる時代が始まり,年配者の反感を大いに買ったと思われるわけですが,近年,ディスプレイの解像度が高く(細かく)なり,逆に文字が小さすぎて若者ですら読みにくいという現象も一部の環境で見られるようです。

最近文字が見えにくくなって、拡大表示することが増えました。
テレビもパソコンもLEDバックライトで眩しくなったのも一因かと(いや観すぎだろ)。

      - No.10197 -    このTreeへ    コメント元:10196 へ [リストへもどる] soft

(10195) 10198Re^2: 掲示板のメンテナンス 2022  投稿者:としき   2022/08/01(月) 01:06
参照先:http://toshiki.la.coocan.jp/
    10196 番 めざら さんへのコメント    コメント数 2

会社のいつも使っている端末の、いつものFirefoxのいつもの常用環境でここを
開いたら、なんかいきなり文字が大きくてちょっとびっくり。
[CTRL]を押しながらマウスのぐりぐりを前後させて縮尺を80%にしたらちょうど
いい感じ。それから#10195を読んで、あぁなるほど、そういうことか、と。
それなら、Chromeならどうなるんだろうと、普段はあまり使っていないChromeで
ここの掲示板を見たら、確かにいい感じの大きさ。なるほど。
だけど、同じく職場にあって、普段は別の人が使っている、解像度は同じだけど
インチが小さいディスプレイに私の端末をつないで表示させてみたら、Chrome
でもやっぱりちょっと小さい。むしろ、Firefoxだと、元の設定に戻してちょうど
いいくらいの大きさ。

自宅に戻って、Firefoxからここを開いたら、職場ほど極端に大きくない。
むしろ、一回り大きくなっただけで、目の弱ってきた私にはいい感じ。
あれっ、と思ったら、#10197なのね。
ということで、

> 特定のWWWブラウザの見え方に依存する変更は「改善」とは言わないと思います。

めざらさんのこのご意見には、私もおおむね同意です。
ま、あれだ、フォントサイズを絶対指定にしてブラウザ側で表示サイズを変えられ
ないような極悪なシステムも散見される世の中にあって、サーバ側で指定する値を
どうするか、というのはある意味悩ましいものもあります。
そういう意味では、めざらさんのところの掲示板のフォント指定というかCSSでの
指定方法は、なかなかいいのではないか、と思う今日この頃。

さておき、クライアント側の設定は無限にあるわけでして、サーバ側はそんなもの
にいちいち関与することはできない、と割り切るのも一案。
この場合、本文に対するフォントサイズ設定は一切やめる。
そして、その他の文字サイズ指定は基本的に相対指定。つまり、-1とか-2を使う。
こうすれば、おおよそ万人というか閲覧者側に全ての責任を押し付けられる上に、
HTML側でfontタグを大幅に削減できるため掲示板スクリプトのメンテナンスが楽
になるし、副作用というか、HTMLの転送時間ならびにブラウザでのレンダリング
時間の縮減も図れるという副作用もあって、サーバ側もブラウザ側もみんな幸せ、
というのがちょっと前の世の中のトレンドでした。
今はどうなのかわかりませんが。

ところで、掲示板正面玄関というか、タイトル文字右側にある[-]とか[+]で文字
サイズが変えられるようになっているわけですが、それを倍率を換えるように変更
していただけないでしょうか。現状では、なかなか浮かばれないというか、扱いが
かわいそうな気がする。
もちろん、ガッツリ削除、というのが私のお勧め。
めざらさんはまた違ったご意見があるかもしれないけど。
      - No.10198 -    このTreeへ    コメント元:10196 へ [リストへもどる] soft

(10195) 10199Re^3: 掲示板のメンテナンス 2022  投稿者:konno   2022/08/03(水) 00:58
    10198 番 としき さんへのコメント    コメント数 1

> > 特定のWWWブラウザの見え方に依存する変更は「改善」とは言わないと思います。
> めざらさんのこのご意見には、私もおおむね同意です。

どうやらとしきさんにも不評のようですね。(^^;

> この場合、本文に対するフォントサイズ設定は一切やめる。
> そして、その他の文字サイズ指定は基本的に相対指定。つまり、-1とか-2を使う。
> こうすれば、おおよそ万人というか閲覧者側に全ての責任を押し付けられる上に、
> HTML側でfontタグを大幅に削減できるため掲示板スクリプトのメンテナンスが楽

そうしたかったんですが、ソースを表示するための等幅フォントがネックだったのです。
<pre>や<tt>を指定すると、既定のフォントとは違うフォントに切り替わるのです。
うちの掲示板は記事本文に<pre>や<tt>を使用しているので、記事本文だけ文字が小さく見えます。
そのフォントが小さいうえに読みづらいフォントだなと感じていたのでした。
それで、バランスを取るために記事本文のフォントサイズを変えたのです。
CSS を使えば全部解決できるかもですが、私は勉強不足なもので。

> ところで、掲示板正面玄関というか、タイトル文字右側にある[-]とか[+]で文字
> サイズが変えられるようになっているわけですが、それを倍率を換えるように変更
> していただけないでしょうか。現状では、なかなか浮かばれないというか、扱いが
> かわいそうな気がする。

現状ではリストのツリー表示だけ拡大縮小になってますね。
これはこれで面白そうですが。(^^;
色々バグもあるので、時間が取れたら直してみたいと思います。

      - No.10199 -    このTreeへ    コメント元:10198 へ [リストへもどる] soft

(10195) 10200Re^4: 掲示板のメンテナンス 2022  投稿者:めざら   2022/08/03(水) 10:36
参照先:http://mezala.la.coocan.jp/
    10199 番 konno さんへのコメント    コメント数 2

「不評」と言いますか,突然変わると先ず手元の環境を疑うところから始めるので,
その確認が正直めんどくさいというだけの話なので,管理者の自由ではあるのですが,
「改善」という意識にちょっとだけ引っかかっただけです。(^-^)

> <pre>や<tt>を指定すると、既定のフォントとは違うフォントに切り替わるのです。

あくまでもソースなどの「みやすさ」のために,ブラウザが monospace フォントに変えますね。
一般的な印刷物でも明示的に consolas とか courier にしていると思います。
インデントの位置がずれると格好悪いですからね。ウェブでも同じです。サイズも本文より少し小さく。

> それで、バランスを取るために記事本文のフォントサイズを変えたのです。

全体のフォントサイズを変えても,preも連動するように本文に対して相対的に小さいままです。
なので,たぶんお望みのようにはなっていない可能性が高いですね。

> CSS を使えば全部解決できるかもですが、私は勉強不足なもので。

全部とはいかないかもしれませんが,取り敢えず試していただきたいのが wf_init.cgi の出力指定です。

掲示板を表示している状態で,Ctrl+U などでHTMLのソースを表示してみてください。
現状のソースの9行目に STYLE 指定がありますよね。閉じるまでが CSS の指定です。
この部分に,例えば【pre,tt { font-size:100%; }】のように出力できればよいわけです。

CGIのバージョンが違いますが,「HTMLヘッダ」という見出しを探してみてください。
「<style type="text/css">」という行を探してもよいです。ここに
pre,tt { font-size: 100%; } とか,
pre,tt { font-size: medium; } とか,
pre,tt { font-size: 1em; } とか指定すれば,pre指定時も本文とほぼ同じサイズになります。

なぜ「ほぼ」かというと,preに対して使われるフォントが異なるからです。
(本文は MS UI Gothic が優先表示で,pre に使われると思われる MS ゴシックと字形も違う。)

いずれにしても,掲示板の管理者たる konnno さんの指定次第です。

ただ,#10197 で 110% にしたと仰るが,HTMLソースでは 100% と表示されているので,
どこか別のところで何か変な指定をしている可能性も疑われます。
こういうのは,ご自身で解決していただくしかないと思われます。

      - No.10200 -    このTreeへ    コメント元:10199 へ [リストへもどる] soft

(10195) 10203Re^5: 掲示板のメンテナンス 2022  投稿者:めざら   2022/08/03(水) 21:44
参照先:http://mezala.la.coocan.jp/
    10200 番 めざら さんへのコメント

どうやら,Chrome の font-family 指定におけるバグっぽいものらしく,
対症療法を示す,それっぽい記載が見つかりました。
monospaceの指定だけだとフォントサイズが小さくなるらしいです。
#10202の予測は外しました。

2015-07-02
font-family: monospace;だと文字が小さくなる
https://silight.hatenablog.jp/entry/2015/07/02/214601

まだ実験中ですが,Chrome には依然として適用できていません。
そのかわり,Edge では想定に近い表示になりました。
なんでかな?
      - No.10203 -    このTreeへ    コメント元:10200 へ [リストへもどる] soft

(10195) 10204CSSで pre,tt の指定  投稿者:konno   2022/08/03(水) 22:41
    10200 番 めざら さんへのコメント    コメント数 1

> あくまでもソースなどの「みやすさ」のために,ブラウザが monospace フォントに変えますね。
> 一般的な印刷物でも明示的に consolas とか courier にしていると思います。
> インデントの位置がずれると格好悪いですからね。ウェブでも同じです。サイズも本文より少し小さく。

なるほどそうなんですか、等倍にすると横幅が伸びる分フォントが少し小さくなるのだと思っていました。

> 現状のソースの9行目に STYLE 指定がありますよね。閉じるまでが CSS の指定です。
> この部分に,例えば【pre,tt { font-size:100%; }】のように出力できればよいわけです。
>
> CGIのバージョンが違いますが,「HTMLヘッダ」という見出しを探してみてください。
> 「<style type="text/css">」という行を探してもよいです。ここに
> pre,tt { font-size: 100%; } とか,
> pre,tt { font-size: medium; } とか,
> pre,tt { font-size: 1em; } とか指定すれば,pre指定時も本文とほぼ同じサイズになります。

これは勉強になります、試してみます。

      - No.10204 -    このTreeへ    コメント元:10200 へ [リストへもどる] soft

(10195) 10207Chrome の monospace フォントに関する指定(確定版)  投稿者:めざら   2022/08/05(金) 13:25
参照先:http://mezala.la.coocan.jp/
    10204 番 konno さんへのコメント    コメント数 1

Chrome の monospace フォントに関するバグを回避する方法を,下記のサイト様で学びまして,
https://silight.hatenablog.jp/entry/2015/07/02/214601
うちの掲示板で試してみていたのですが,ようやく反映を確認できました。

monospaceフォントが使われることの多い要素に以下のような指定をすると,反映されます。

tt, code, kbd, samp, pre, xmp, plaintext, listing {
    font-family: monospace, serif;
}

うちの掲示板では,念のため以下のように明示的なサイズ指定も加えました。
tt, code, kbd, samp, pre, xmp, plaintext, listing {
	font-family: monospace, serif;
	font-size: medium; 
} /* Chromeはmonospaceのみの指定だとサイズが小さくなる */

うちの掲示板では,preを指定したアーティクルの背景色(薄墨)をつけているので,
Chromeで見比べてみてください。

これにより,個々の掲示板のソースでいちいちサイズ指定する必要はなくなります。
としきさんの仰るように,固定サイズ指定をバッサリ削ると自然な表示になると思います。

副作用のない指定方法を公開している,しらいと様に感謝。


なお,過去のブラウザの初期設定では,pre 要素などで小さなフォントが使われるのがふつうで,
これまでは特に疑問を感じていなかったのですが,konno さんのおかげで〈きっかけ〉ができ,
ブラウザ間の違いを改善することができました。

以前から,code や kbd などを指定した要素の表示がよろしくなくて気にはなってましたが,
おいおい解決していきたいと思います。

ありがとうございました。

      - No.10207 -    このTreeへ    コメント元:10204 へ [リストへもどる] pre

(10195) 10208Re: Chrome の monospace フォントに関する指定(確定版)  投稿者:konno   2022/08/06(土) 02:14
    10207 番 めざら さんへのコメント    コメント数 2

> Chrome の monospace フォントに関するバグを回避する方法を,下記のサイト様で学びまして,
> https://silight.hatenablog.jp/entry/2015/07/02/214601
> うちの掲示板で試してみていたのですが,ようやく反映を確認できました。

このサイトを覗いてみたら理屈が判りました。

-------------------------------------------------
等幅フォントも可変幅フォントと同じサイズで表示したい時は次のように指定します。

font-family: monospace, serif;
これはmonospaceフォントで表示できない文字はserifフォントで表示するという意味ですが、そうなることは稀です。そして、このように等幅フォントと可変幅フォントを混在させた場合、可変幅フォントのデフォルトサイズが優先されます。(つまり可変幅フォントならserif以外でも良いです。単純に一番短いserifを選んだだけなので。)
-------------------------------------------------

なるほど納得です。

> うちの掲示板では,念のため以下のように明示的なサイズ指定も加えました。
> tt, code, kbd, samp, pre, xmp, plaintext, listing {
> 	font-family: monospace, serif;
> 	font-size: medium; 
> } /* Chromeはmonospaceのみの指定だとサイズが小さくなる */

これを入れてみたら丁度良い見栄えになりました。

> これにより,個々の掲示板のソースでいちいちサイズ指定する必要はなくなります。
> としきさんの仰るように,固定サイズ指定をバッサリ削ると自然な表示になると思います。
> 
> 副作用のない指定方法を公開している,しらいと様に感謝。

掲示板の全面改修は直ぐにはできませんが、本当に感謝ですね。

> なお,過去のブラウザの初期設定では,pre 要素などで小さなフォントが使われるのがふつうで,
> これまでは特に疑問を感じていなかったのですが,konno さんのおかげで〈きっかけ〉ができ,
> ブラウザ間の違いを改善することができました。

ブラウザ間の違いをほぼ無くせるとはまるで魔法のようですね。
私が気になっていたのは、等幅フォントのMSゴシックが線が細くて見えにくい
文字が読みにくいと感じたからです。そうとう目が悪くなったようです。
なので、等幅フォントはメイリオに変えました。

      - No.10208 -    このTreeへ    コメント元:10207 へ [リストへもどる] pre

(10195) 10209Re^2: Chrome の monospace フォントに関する指定(確定版)  投稿者:めざら   2022/08/06(土) 08:38
参照先:http://mezala.la.coocan.jp/
    10208 番 konno さんへのコメント    コメント数 1

もう黙っていようかと思ったのですが,自分の精神衛生上よろしくないので……

メイリオを指定しても所期の表示にはならないと思います。
なぜなら,メイリオはプロポーショナルフォントだから。

むりやり等幅にした Meiryo_KE とか有るようですが,
表示する人の環境になければ意味がないですし。

monospace 用に具体的なフォント名を指定するのはナンセンスかもです。

もしかすると MSゴシックも使われていないかもしれません。
調べてないからわかんないけど。(^^;
      - No.10209 -    このTreeへ    コメント元:10208 へ [リストへもどる] soft

(10195) 10210Re^3: Chrome の monospace フォントに関する指定(確定版)  投稿者:konno   2022/08/07(日) 00:58
    10209 番 めざら さんへのコメント

> もう黙っていようかと思ったのですが,自分の精神衛生上よろしくないので……
> メイリオを指定しても所期の表示にはならないと思います。
> なぜなら,メイリオはプロポーショナルフォントだから。

言葉足らずでした。
メイリオを指定したのはブラウザのフォント設定です。

答倍フォントの設定で、一覧にゴシック系のフォントが並んでいるので色々試してみました。
見栄えが変わるので一応効いているのかと思いました。

その中で MSゴシックよりも見やすく思えたのがメイリオだったのです。
私が良く使う顔文字の記号 (^^; の「^」だけは違和感がありますが。(^^;

> 表示する人の環境になければ意味がないですし。

ブラウザの設定なので、自己満足でいいのではないかと思っています。
実際に変わっているかはわかりません。(^^;

      - No.10210 -    このTreeへ    コメント元:10209 へ [リストへもどる] soft

(10195) 10211Re^2: 各ブラウザでの見栄え  投稿者:としき   2022/08/13(土) 17:37
参照先:http://toshiki.la.coocan.jp/
    10208 番 konno さんへのコメント    コメント数 3

> > ブラウザ間の違いを改善することができました。
> ブラウザ間の違いをほぼ無くせるとはまるで魔法のようですね。

あ〜、そういえば私、最近はブラウザ間の違いをチェックしていないなぁ。
うちのサイトや掲示板、昔はネットスケープとIE、Firefoxできちんとチェック
していたんですけどね。
当時の環境で、ほぼブラウザ間の差異がないことを確認してそれっきり。
その後、ネットスケープとIEはなくなり、Operaはメジャーではないとしても、
新たにChromeだのEdgeだの出てきたわけだし。あいにく、Safariにいたっては
触ったことすらないし環境もない。
Edgeだけは出てきた当初に、うちのサイトをちょっとだけチェックしたような。
そのうちきちんと、せめてChromeでの見栄えチェックをやっておかねば。


ところで、掲示板メンテナンスという関連で、いくつかリクエスト。
一つは、前にも話を出したところですが、「返信フォーム」の上に表示されている
「関連一覧ツリー」のツリー表示が乱れる件。
もうひとつは、同じところですが、「関連一覧ツリー」のトップというかルートと
いうか、下三角が表示されている隣の発言。
他の発言と違い、ここだけなぜか発言番号が表示されていない。
mode=allreadのほうではツリー表示はきちんとしている一方、発言番号は各発言の
行末に表示されるようになっているので、#10116にあるように、それぞれのツリー
表示ルーチンを比較すれば、いずれも容易に解決できるような気がします。
ただ、konnoさん、ときどきバージョン管理を失敗して、古い版を参照していたり
することがあるので、そこは注意していただきたい気がする。
あるいは、マジでソースをさらしていただきたい。心からのお願い。
最後、これも5ヶ所ほど書き換えるところがあるかな。一括置換でいけるかなぁ。
なにかというと、引用部分の表示について。
これは、#10174を見てもらうのがいいかな。引用部分にリンクがあると、その後ろ
のフォント指定がキャンセルされてしまっています。
野ざらし言や板塀では、この事象は起きていません。
例えば、野ざらし言#4717とか板塀#3467とか。
ざっくり見たところ、野ざらし言や板塀では、引用部分では引用であることを意味
する q タグが使われています。でも、この掲示板では、明示的に引用を意味する
タグを使わず、fontタグで見栄えだけそれっぽくしているだけ。
まさにこれはあれだ、アクセシビリティなんかに興味・関心のないkonnoさんらしい
といえばらしいかもしれないけど、現実的に美しくないわけですから、何とかして
いただきたいというのが偽らざる本心。

ということで、なにとぞよしなに。
      - No.10211 -    このTreeへ    コメント元:10208 へ [リストへもどる] soft

(10195) 10212Re^3: 各ブラウザでの見栄え  投稿者:めざら   2022/08/13(土) 22:23
参照先:http://mezala.la.coocan.jp/
    10211 番 としき さんへのコメント    コメント数 1

勝手に補足させていただきます。

> 引用部分にリンクがあると、その後ろのフォント指定がキャンセルされ

としき兄がここで仰る「フォント指定」とは「フォントの属性指定=文字色」のことと思われます。

> 引用部分では引用であることを意味する q タグが使われています。

まぁ,普通そうだと思うわけなのですが,そもそも WebForum の原作者がまるで気にしていないので,
面倒っちゃ面倒ですよね。
ただ,Q 要素で括ると,属性を変えるなんて CSS で手間なしですから,
ちょっとだけ手を加えるのをおすすめします。ホント,すごい楽になりますよ。
フォント要素なんかの属性をいちいち加えるのって凄く面倒なわけですが,

<font color=\"#993300\">なんたらかんたら</font>
  ↓
<q>なんたらかんたら</q>

ほらね,これだけログも軽くなります。
CSS で q { font-color: #993300; } これだけ。
      - No.10212 -    このTreeへ    コメント元:10211 へ [リストへもどる] soft

(10195) 10213Re^4: 各ブラウザでの見栄え  投稿者:としき   2022/08/14(日) 00:51
参照先:http://toshiki.la.coocan.jp/
    10212 番 めざら さんへのコメント    コメント数 1

> 勝手に補足させていただきます。

補足ありがとうございます。

余談ですが、先の私のコメントの後、一体いくつぐらい引用部分があるのかと板塀
のスクリプトのフォルダを検索したのですがね。
そこで発覚したのが、板塀でも q タグに変更するのをもらしている部分がある、と
いうこと。具体的にいうとwf_regi.cgiの中です。
発言を受け付けた表示の部分です。
こんなところまでチェックするのはある意味変質狂かもしれませんが、私の場合、
とりあえず統一性ということで、fontタグを q タグに変更しました。
ちなみに、めざらさんのところがどうなっているか、いささか不安もあります。
だって、私が手を加えているから。
ただ、めざらさんのことだから、既に修正済みかも。
もし未修正なようなら、ご自身での修正、よろしくお願いいたします。

> CSS で q { font-color: #993300; } これだけ。

色だけならこうなんですけど。
そのほかに、デフォルトのwforumに合わせるという意味で

q:before { content: no-open-quote; }
q:after { content: no-close-quote; }

この2行もあったほうがいいかも。


ちなみに私、

> ただ,Q 要素で括ると,属性を変えるなんて CSS で手間なしですから,
> ちょっとだけ手を加えるのをおすすめします。ホント,すごい楽になりますよ。
> フォント要素なんかの属性をいちいち加えるのって凄く面倒なわけですが,

この考え方には大いに賛同した上で、ではどうやっているかというと

<font color=\"#993300\">なんたらかんたら</font>
  ↓
<q style=\"color: $refcol;\">なんたらかんたら</q>

なんてことをやっている。
いや、だって、wf_init.cgiのデフォルトで$refcolという変数を設定しているわけ
で、なるべくこの設定を生かしたかったから。
でも、めざらさんのおっしゃることには強く同意するものですから、もし次の機会
というかwf_init.cgi *にも* 手を入れるようなときには、この辺も直すかも。
      - No.10213 -    このTreeへ    コメント元:10212 へ [リストへもどる] soft

(10195) 10218Re^5: <q>タグと<blockquote>  投稿者:konno   2022/08/14(日) 19:09
    10213 番 としき さんへのコメント    コメント数 1

としきさん、めざらさん、色々ご教授いただきありがとうございます。
q タグは知りませんでした。ネットで調べると

> 「Q」とは、「quotation」の略で、<q>〜</q>で囲まれたテキストが引用・転載文であることを示すタグです。
> 改行がない、比較的短いテキストを引用する際に使用されます。
> 長いテキストを段落ごと引用・転載する場合は<blockquote>タグを使用します。

とありますが、実際には

> これは、#10174を見てもらうのがいいかな。引用部分にリンクがあると、その後ろ
> のフォント指定がキャンセルされてしまっています。

<blockquote>タグではこんな問題があったんですね。
出来るところから直していきたいと思います。

      - No.10218 -    このTreeへ    コメント元:10213 へ [リストへもどる] soft

(10195) 10220Re^6: <q>タグと<blockquote>  投稿者:めざら   2022/08/14(日) 21:37
参照先:http://mezala.la.coocan.jp/
    10218 番 konno さんへのコメント    コメント数 1

> <blockquote>タグではこんな問題があったんですね。

いや,blockquote は使ってないですよね。関係はないです。


余談です。
昔の話ですが,多くのWebブラウザで blockquote 領域の表現として,
字下げを用いていたんですね。そのような経緯から,blockquote が
「字下げのためのタグ」なんて勝手な解釈が長く行われてきました。
流石に近ごろはそんな解説は見かけなくなりましたけど。
      - No.10220 -    このTreeへ    コメント元:10218 へ [リストへもどる] soft

(10195) 10221Re^7: <q>タグ出来ました!  投稿者:konno   2022/08/15(月) 14:41
    10220 番 めざら さんへのコメント

> いや,blockquote は使ってないですよね。関係はないです。

そうでした、掲示板では「>」を使う慣習があるせいですかね。
おかげでニフティの会議室的な雰囲気が出せるのですが。

ところで、やっと修正が出来ました。\(^^)/ ヤッタ-

q        { font-color:$refcol; } 

うちの環境ではこれだとうまくいかず、色々試行錯誤した結果

q        { color:$refcol; } 
q:before { content: no-open-quote; }
q:after  { content: no-close-quote; }

これでうまくいきました。
下の2行が無いと、「」で囲われてしまいますね。(^^;
ありがとうございました。

      - No.10221 -    このTreeへ    コメント元:10220 へ [リストへもどる] pre

(10195) 10214Re^3: 各ブラウザでの見栄え  投稿者:としき   2022/08/14(日) 13:08
参照先:http://toshiki.la.coocan.jp/
    10211 番 としき さんへのコメント    コメント数 1

> ざっくり見たところ、

ざっくりしすぎていました。
しっかり見たところ、どうやらそんな簡単な話ではなさそうな感じ。
板塀や野ざらし言でどうなっているかというと

単純な引用部
<q>&gt; ほげほげ </q>

リンクを包含する引用部
<q>&gt; ほげほげ <a href="xxx">#xxx</a>ふがふが</q>

という感じ。
でも、ここの掲示板では

単純な引用部
<font color="#804000">&gt; ほげほげ</font><br>

リンクを包含する引用部
<font color="#804000">&gt; ほげほげ</font><a href='xxx'>#xxx</a>ふがふが<br>

となっている。
これは一体なんだろう。
一瞬、リンクを作るルーチンのほうで余計なfontの閉じタグをつけてしまっている
のかとも思いましたが、もしそうなら<br>直前のfontの閉じタグが消えてしまって
いることの説明がつかない。
あ、わかった。
そしてこのバグ、板塀や野ざらし言にも一部残っている。
何が悪いかというと、引用処理と自動リンク処理の順番。
おそらく、ここの掲示板では以下のような処理が行われているのでしょう。

if ($autolink) { (略) } #自動リンク処理
if ($refcol) { #引用処理
    (略)
}

でも、板塀では、引用処理と自動リンク処理の順番が逆になっています。
つまり、引用処理が先、自動リンク処理があと。
で、まぁ、人のフリ見て、ではありませんが、板塀でそうなっているところは
ないよね、ということで確認したところ、残っているではありませんか、見事に。
どこかというと、検索処理のところと、ログ内全記事表示のところ。
特に検索処理のところは、野ざらしも板塀と同じでしょう。
ここはめざらさんにもチェックしていただいたほうがよろしいかと。

ということで、fontタグを q タグに変える、というのはやっていただいたほうが
ベターではありますが、konnoさん的にはもしかしたらアレかも。
でも、引用処理と自動リンク処理の順番を変えるのは、そんなに手間がかからない
上に絶大な効果をもたらしますから、ぜひともよろしく、ということで。

      - No.10214 -    このTreeへ    コメント元:10211 へ [リストへもどる] pre

(10195) 10215Re^4: 各ブラウザでの見栄え  投稿者:めざら   2022/08/14(日) 16:44
参照先:http://mezala.la.coocan.jp/
    10214 番 としき さんへのコメント    コメント数 1

単純に,自動リンク処理と引用処理の前後を入れ替えるだけだと効かなかった。
当然のことながら全然覚えていないわけですが,$msg と #v_msg の違いとかあり,
大元の版が見当たらないので,何の違いかわからなくなってて,面倒。忘れよう。(^^;
そもそも検索結果のページって,CSSの効きも他と違うし,変だなぁ……

……cgiソースをつらつら眺めること数十分……

あ,もう一箇所あったのか。おー,でけたでけた。
この処理って,3箇所あったのですね。見落としてた。
      - No.10215 -    このTreeへ    コメント元:10214 へ [リストへもどる] soft

(10195) 10216Re^5: 各ブラウザでの見栄え  投稿者:としき   2022/08/14(日) 18:03
参照先:http://toshiki.la.coocan.jp/
    10215 番 めざら さんへのコメント    コメント数 1

> 単純に,自動リンク処理と引用処理の前後を入れ替えるだけだと効かなかったです。

おや、まぁ。
うちの板塀は、単純に入れ替えただけで効果があったんですけどねぇ。
ということは逆に、板塀のほうで、未知のバグを仕込んでしまっていたりして。

> そもそも検索結果のページって,CSSの効きも他と違うし,変だなぁ……

例によって、ざっくり見させていただいただけですが。
検索結果のページって、lrmrgnのdivisionが、作者の意図とは異なるところで閉じて
しまっているような気がします。もしくは、閉じたあとに再び開かなくてはいけない
のに開き忘れている、とか。
もちろん、例によって私のざっくりなので正しくないかもしれませんが、めざらさん
なら、これだけの手がかりがあれば、私の推測が正しいか誤っているかの判別は可能
だと思います。
      - No.10216 -    このTreeへ    コメント元:10215 へ [リストへもどる] soft

(10195) 10217Re^6: 各ブラウザでの見栄え  投稿者:めざら   2022/08/14(日) 18:13
参照先:http://mezala.la.coocan.jp/
    10216 番 としき さんへのコメント    コメント数 2

あー,ごめんなさい。

眺めているうちに,該当箇所の見落としに気づいて,出来ましたが,
#10215の方はとしきさんのコメント前後で結論を修正してしまっています。(^^;

あ,CSS の話。lrmrgn ってよくわかりましたね。
え?すぐ閉じてましたか……こちらも見落としですね。
中心性網脈絡膜症に加え,老眼の進みすぎ,霞目,眼鏡が古すぎ等等…
視力が崩壊してしまっているので,ソース読むなんての限界かも。

…ということで再度確認すると……

検索結果の方には,各アーティクルの id を埋め込んだ div(開始)がないことに気づきました。
それで,その前にあった lrmrgn を指定する div が閉じているんです。
こりゃーダメだ!(長介風)

      - No.10217 -    このTreeへ    コメント元:10216 へ [リストへもどる] soft

(10195) 10219Re^7: 各ブラウザでの見栄え  投稿者:konno   2022/08/14(日) 19:25
    10217 番 めざら さんへのコメント

うう、書き込んでいる間にどんどん修正箇所が増えていくぅ、(>_<);
まるで芋づる式ですね。(^^;
私のサツマイモは葉っぱが虫食いだらけなのが性格を表わしているような。(^^;;
果たして無事に収穫もとい修正できるのか・・・

      - No.10219 -    このTreeへ    コメント元:10217 へ [リストへもどる] soft

(10195) 10226Re^7: 各ブラウザでの見栄え  投稿者:としき   2022/08/17(水) 02:05
参照先:http://toshiki.la.coocan.jp/
    10217 番 めざら さんへのコメント    コメント数 1

> あ,CSS の話。lrmrgn ってよくわかりましたね。

最近のブラウザには、開発者ツールというのがデフォルトで搭載されていまして。
ChromeにもEdgeにもありますが、私は長いこと触ってきたFirefoxに慣れてしまって
いるので、他のブラウザにはどうしてもなじめない。
で、これを使うと、CSSのいろいろな分析ができるのですが、当然ながら、私に
そんな深い分析ができるわけもなく。ざっくりですよ、ざっくり。

ところで、他のブラウザはどうか知りませんが、Firefoxはサイトで複数のスタイル
シートを設定してあると、それを切り替えるという機能があります。
実験的に、うちの板塀の検索ページに、この機能を仕込んで見ました。
具体的にどうするかというと、Firefoxからうちの板塀の検索ページを開き、そこで
Firefoxのメニューから、表示→スタイルシートと選択します。すると、そのメニュー
のなかで、スタイルシートを使用しない、標準のスタイルシート、というのと並んで
testというのが選択できるようになっています。
これを選択すると、わざと違いがわかりやすくなるような、すなわち見栄えを全く
考えていないようなスタイルが適用されます。
これ、期間限定。
数日後にはこの機能は撤去されます。予定です。

こういうのを使えば、誰も使わないナイトモードをこっそり仕込む、などという
お遊びができたりするわけですよ。
もちろん、まじめに考えればユーザビリティの向上になるんでしょうけどねぇ。
      - No.10226 -    このTreeへ    コメント元:10217 へ [リストへもどる] soft

(10195) 10227Re^8: 各ブラウザでの見栄え  投稿者:めざら   2022/08/17(水) 13:02
参照先:http://mezala.la.coocan.jp/
    10226 番 としき さんへのコメント

作成者はクラス名を見れば何を制御するのか分かるので,適用範囲も分かりますが……
……まぁ大体想像はつくのかな。hrまでに閉じるのは想像にかたくないですしね。
そもそも,3個くらいのdivが閉じてなかった(笑)ので,酷い話です。お恥ずかしい。


開発者ツールって,ページのスクリーンショット(カメラ)くらいしか使ってないです。
だって,開発者じゃないもん。


      - No.10227 -    このTreeへ    コメント元:10226 へ [リストへもどる] soft

(10195) 10278Re^3: 各ブラウザでの見栄え  投稿者:としき   2022/08/26(金) 22:19
参照先:http://toshiki.la.coocan.jp/
    10211 番 としき さんへのコメント    コメント数 1

しばらくぶりにこちらの掲示板を見てみたところ。

> 一つは、前にも話を出したところですが、「返信フォーム」の上に表示されている
> 「関連一覧ツリー」のツリー表示が乱れる件。

こちらはあまり改善されていないようですね。
もしかしたら悪化していたりして。

> もうひとつは、同じところですが、「関連一覧ツリー」のトップというかルートと
> いうか、下三角が表示されている隣の発言。
> 他の発言と違い、ここだけなぜか発言番号が表示されていない。

こちらはきちっと直っていますね。
めでたい。というか、ありがたい。
      - No.10278 -    このTreeへ    コメント元:10211 へ [リストへもどる] soft

(10195) 10282Re^4: 各ブラウザでの見栄え  投稿者:konno   2022/08/27(土) 21:27
    10278 番 としき さんへのコメント

> > 一つは、前にも話を出したところですが、「返信フォーム」の上に表示されている
> > 「関連一覧ツリー」のツリー表示が乱れる件。
> こちらはあまり改善されていないようですね。

これは積年の課題になっていますね。
また解決に向けてチャレンジしてみます。

> > もうひとつは、同じところですが、「関連一覧ツリー」のトップというかルートと
> > いうか、下三角が表示されている隣の発言。
> > 他の発言と違い、ここだけなぜか発言番号が表示されていない。
> こちらはきちっと直っていますね。

これは気が付かなかったので指摘をいただいてありがたかったです。
もう一つのご指摘もとしきさんとめざらさんのご教示で解決できましたし
勉強になりました。

      - No.10282 -    このTreeへ    コメント元:10278 へ [リストへもどる] soft

(10195) 10202Re^3: 掲示板のメンテナンス 2022  投稿者:めざら   2022/08/03(水) 17:48
参照先:http://mezala.la.coocan.jp/
    10198 番 としき さんへのコメント    コメント数 1

> この場合、本文に対するフォントサイズ設定は一切やめる。

自分のところでは,フォントサイズの絶対指定は一切排除しているわけなのです。ところが……

自分のサイトの他のページは,ブラウザごとに大きく表示が異なるということはないのに,
何故か掲示板だけ明らかに Chrome と Firefox とでフォントサイズが異なっているわけです。
一応,Edge なんかで表示しても少し違う。サイズは Chrome に近いけれど違うところもある。

ここが謎なんですね。

なので,Konno さんのお悩みの点は,本来自分(たち)の問題でもあったわけなのですよ。

…と言っても,フォントサイズの絶対指定はしていないし,本来変わらないはず。
Chrome と言えば,あるバージョンでデフォルトのフォントをメイリオにした関係で,
色々表示上のメンテナンスを各サイト管理者に強いたということはあったけれど,
ごく普通のサイトは特段の影響はなかったのではないかと思われるわけなので,
それが関係するとは思えない。

唯一思いつくのは,MS系のレガシーなフォントを優先表示フォントとして設定している場合。
Chrome でフォントごとにサイズの指定を無視するというのは考えにくいですが,
多少の調整をするという可能性はもしかするとあるのかもしれない。

CSS も万能じゃなくて,ブラウザごとに対応状況が異なっていますからね。

少しずつ実験してみたいと思います。
これが konnno さんのお悩み解決につながればよいのですけど。


ところで,BBS新着情報のページなのですが,かなり小さなフォントで行間もないので,
だいぶぎゅぎゅっと表示されているのですけど,少し大きくしていただけないでしょうか。
フォントサイズ 80% になっていて,Chromeだといよいよ縮小表示されて見えます。
あー,そうするとまた Fx でデカく表示されてしまうのか……悩ましいなぁ……

動的ページだけなのか……何だろう(?_?)

      - No.10202 -    このTreeへ    コメント元:10198 へ [リストへもどる] soft

(10195) 10205Re^4: 掲示板のメンテナンス 2022  投稿者:konno   2022/08/03(水) 22:49
    10202 番 めざら さんへのコメント

> ところで,BBS新着情報のページなのですが,かなり小さなフォントで行間もないので,
> だいぶぎゅぎゅっと表示されているのですけど,少し大きくしていただけないでしょうか。
> フォントサイズ 80% になっていて,Chromeだといよいよ縮小表示されて見えます。

ちょっと見栄えを変えてみたんですが、フォントが小さすぎましたか。(^^;
Fx で確認していませんでした。(^^;;
調整します。m(__)m

> あー,そうするとまた Fx でデカく表示されてしまうのか……悩ましいなぁ……

あれ? うちでは、クロムの方が大きくなる・・・ 設定変えたせいか。
とりあえず大きくしてみました。

      - No.10205 -    このTreeへ    コメント元:10202 へ [リストへもどる] soft

(10195) 10206BBS新着情報のページを更新 Ver0.82  投稿者:konno   2022/08/03(水) 23:10
    10195 番 konno さんへのコメント    コメント数 2

BBS新着情報のページを見栄えなど更新しました。

今回は、クロムのフォントサイズを大きくしたらBBS新着情報が大きすぎる気がしたもので
フォントを小さめにして行間も詰めてみましたが、小さすぎるとのご指摘で再調整しました。


備忘録として

・全体を <tt> </tt> で囲うとテーブル枠内の文字も一緒に少し小さくなります。

・テーブル枠内の文字サイズなどを調整するには

 <table border=1 ><tbody style='font-size:$tbsize'><tr><th>

 このような指定で出来ました。

      - No.10206 -    このTreeへ    コメント元:10195 へ [リストへもどる] soft

(10195) 10224Re: BBS新着情報のページを更新 Ver0.82  投稿者:めざら   2022/08/16(火) 22:05
参照先:http://mezala.la.coocan.jp/
    10206 番 konno さんへのコメント    コメント数 1

おやおや?
新着情報はまた更に小さな字にされたのですか?

konnoさんのブラウザって,フォントサイズ特大ですか?
70%でちょうどよく見えるってことは 1.4em がデフォルトかなぁ……

      - No.10224 -    このTreeへ    コメント元:10206 へ [リストへもどる] soft

(10195) 10225BBS新着情報のページ更新 Ver0.83  投稿者:konno   2022/08/17(水) 02:01
    10224 番 めざら さんへのコメント

> おやおや?
> 新着情報はまた更に小さな字にされたのですか?

ああ、すみません、また並びなど弄ったもので。
また調整してみました。

> konnoさんのブラウザって,フォントサイズ特大ですか?
> 70%でちょうどよく見えるってことは 1.4em がデフォルトかなぁ……

Fx、クロムは18PT、エッジは大20PTにしました。
それでも新着情報はFxでは大きくてはみ出てしまいます。

70% というのは
body,tr,td,th,div { font-size:70%; font-family:MS Gothic ; margin:0; }
ここの指定ですよね。
この指定は試したブラウザでは効いていないようです。
<FONT SIZE='3'> 
<FONT SIZE='-1'> 
などが効いているようです。

      - No.10225 -    このTreeへ    コメント元:10224 へ [リストへもどる] soft

(10195) 10228BBS新着情報の更新 Ver0.84  投稿者:konno   2022/08/17(水) 21:38
    10206 番 konno さんへのコメント

BBS新着情報の更新です。Ver0.84

今回は、各ブラウザの見た目のフォントサイズをほぼ同じに出来ました。
私の環境ではファイヤーフォックス、クロム、エッジでほぼ同じに見えます。

今回は
「ブラウザ別に適用させるCSSハック」
https://w.better-future.co.jp/%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6%E5%88%A5%E3%81%AB%E9%81%A9%E7%94%A8%E3%81%95%E3%81%9B%E3%82%8Bcss%E3%83%8F%E3%83%83%E3%82%AF/
のサイト(UTF8なのか読めないですが、タイトルと同じ文字か)
の例をCSSヘッダに貼り付けてみました。

_:lang(x)::-moz-placeholder, .selector {font-size:-2;}

使い方が合っているかはわからないですが、結果的には出来たようです。

#たぶん間違っているんだろうな

実際には、余計な<tt><font-size〇〇>を削除したら直ったみたいな。(^^;
      - No.10228 -    このTreeへ    コメント元:10206 へ [リストへもどる] soft