MozillaZine.jp フォーラム https://forums.mozillazine.jp/ |
|
「Firefoxでの暗いバックグラウンド色利用」での改善策は? https://forums.mozillazine.jp/viewtopic.php?f=2&t=17607 |
ページ 1 / 2 |
作成者: | mNeji [ 2019年6月06日(木) 20:25 ] |
記事の件名: | 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
当方は「macOS Mojave 10.14.4」で、ApperranceをDarkに設定して使っています。 それに伴い、Firefox(67.0)でも拡張機能の「Dark Background and Light Text」を利用しています。大雑把には、暗いバックグラウンド色になってありがたいのですが、3つほど改善できればと考えています;
本来は、拡張機能・テーマでの質問になるかと思いますが、最近の質問ではこちらで論議されているようなので、本問もこちらに書かせていただきます。 以上。 |
作成者: | anzu [ 2019年6月08日(土) 13:39 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
1と3の改善提案です。 当方Windowsなためmacでの動作確認はできていませんがとりあえずこれらを試してみてください。 まず3の改善ですが。こちらのページを開き https://github.com/Izheil/Quantum-Nox-F ... ontent.css Rawのリンクを右クリックし「名前を付けてリンク先を保存」をします。 ダウンロードしたファイル名がuserContent.cssでcssの文字コードがUTF-8 BOMなしであることを確認。 プロファイルフォルダ内にフォルダ名chromeのフォルダを作成しその中にダウンロードしたuserContent.cssを入れます。 次に1の改善方法。 テキストエディタに以下のコードを貼り付け、ファイル名userChrome.css。文字コードUTF-8 BOMなしで保存します。 作成したuserChrome.cssを先に作ったchromeのフォルダの中に入れます。 (このコードはuserContent.css11行目から17行目と131行目から136行目を用いたもので、サイドバーなどのスクロールバーの色を変えるためのもの。Webページ内のスクロールバーはuserContent.cssにある同じコードで変化しています) コード: :root { /* These variable changes the scrollbars size and color. If you use the JS method instead, you don't need to change these. The scrollbars-width only has 3 acceptable values, auto, thin, and none: auto = default OS size | thin = half the width (will be hidden in about: pages) | none = hidden scrollbar */ --scrollbars-width: auto !important; --scrollbars-thumb-color: #05a !important; --scrollbars-track-color: #252525 !important; } :root{ scrollbar-color: var(--scrollbars-thumb-color) var(--scrollbars-track-color) !important; scrollbar-width: var(--scrollbars-width) !important;} *|* {scrollbar-width: var(--scrollbars-width) !important;} Firefoxを再起動しabout:ページとスクロールバーの色が変化していれば成功。 スクロールバーの色はuserContent.css16行目”#05a”と17行目”#252525”を変更すれば好みの色にできます。 userChrome.cssも同様に変更します。 |
作成者: | mNeji [ 2019年6月08日(土) 18:25 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
anzuさん、早速のご返答、ありがとうございます。 「3の改善」は成功いたしました!「目」が喜んでおります。 「1の改善」についてお尋ねします。一応「ファイル名userChrome.css」は下記コードのように用意いたしました。「BOMなし」は普通のテキストファイルでよろしいでしょうか? コード: :root { /* These variable changes the scrollbars size and color. If you use the JS method instead, you don't need to change these. The scrollbars-width only has 3 acceptable values, auto, thin, and none: auto = default OS size | thin = half the width (will be hidden in about: pages) | none = hidden scrollbar */ --scrollbars-width: auto !important; --scrollbars-thumb-color: #05a !important; --scrollbars-track-color: #252525 !important; } :root{ scrollbar-color: var(--scrollbars-thumb-color) var(--scrollbars-track-color) !important; scrollbar-width: var(--scrollbars-width) !important;} *|* {scrollbar-width: var(--scrollbars-width) !important;} お手数ですが、ご教授頂ければ幸いです。 |
作成者: | anzu [ 2019年6月08日(土) 18:56 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
Macのソフトは全く分からないのですが「mac テキストエディタ utf-8 bomなし」で検索してみると、 このようなエディタが紹介されていたりします。 https://www.1-firststep.com/archives/2258#link-scroll-6 https://digitalkoukisin.net/wordpress/2457/ 保存するときに文字コードを指定してやるわけですが、 お使いのテキストエディタがutf-8 bomなしで保存できるのならばそれでよいのです。 それができないのであればutf-8 bomなし保存可能なエディタを利用してください。 追記 Firefox 69からuserChrome.css, userContent.css がデフォルト無効となるようなので、 about:configでtoolkit.legacyUserProfileCustomizations.stylesheetsをtrueに変更することが必要となります。 https://www.ghacks.net/2019/05/24/firef ... y-default/ |
作成者: | mNeji [ 2019年6月08日(土) 19:29 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
anzuさん、 ご紹介いただいた2つ目のサイトをみて、確かに「UTF-8(BOB無し)」であることが確認できました。お手数おかけしました。 「Firefox 69」の件、承知いたしました。準備いたすようにします。 と、ふと気付いたのですが、「3の改善」だけ実施したのですが、「スクロール・バー」が既に灰色で、「バー・ハンドル」が暗めの青になっています。 少し様子をみて、ご報告いたします。 |
作成者: | anzu [ 2019年6月08日(土) 19:43 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
説明が不正確で申し訳ありません。 3の方のuserContent.cssによって内部ページ(about:ページ)とWebページのスクロールバーの色を変更できますが、 サイドバーやブラウジングライブラリーその他UI部分のスクロールバーの色は変更されません。 全てのスクロールバーの色を変更するために1で作成するuserChrome.cssが必要ということでした。 |
作成者: | mNeji [ 2019年6月08日(土) 20:21 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
anzuさん、 詳しいご説明ありがとうございます。 しばらくこのままで運行してから、「1で作成するuserChrome.css」を適用してみます。 その後に、最終報告いたします。 |
作成者: | mNeji [ 2019年6月19日(水) 01:02 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
anzuさん、 以前、ご教授戴いた「IzheilさんのCSS」は非常に強力で;
他方、アップルのフォーラムで、SafariのCSSについての論議がありまして;
上記トピックで、Safariの問題が片付いた後に、Safariでは「Dark Reader for Safari.app」が調子よく動作するのに,Firefoxの「Dark Readerは無料とはいえ動作しなくなってしまっているので...」とボヤいたところ、CSSに造詣の深いHiro.Sさんからご助言をいただき;
以下に、Firefoxをダーク色表示を改善する要点をご紹介します。手順は3つです。
「手順1 IzheilさんのCSSの設置」{Headline 3)「手順1 IzheilさんのCSSの設置」(Size 10pt )
「手順2 機能拡張の"Dark Reader"を設置」「手順2 機能拡張の"Dark Reader"を設置」
「手順3 白い画面のフラッシュを抑制する2つのCSS(Hiro.Sさん作)を設置」
コード: /* CSS: blackPage_during_transition2new-tab/window_Content.css • Suppress a white page during transition to new-tab/window: by Hiro.S • 新規のタブ/ウィンドウに切り替わるまでに出るページを抑制(黒味の色): Hiro.S作 • add to userContent.css • see also userChrome.css */ @-moz-document url("about:blank") { body { background-color: #202020; } }
コード: /* CSS: blackPage_during_startupFF_Chrome.css • Suppress a white page during startup of Firefox: by Hiro.S • Firefoxのスタートアップの間に出る白紙ページを抑制(黒味の色): Hiro.S作 • add to userChrome.css • see also userContent.css */ stack.browserStack { background-color: #202020; } 以上、ご連絡まで。 変更の履歴:
|
作成者: | pal [ 2019年6月19日(水) 08:17 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
余計なお世話を一つ。 2019年6月19日(水) 01:02 の投稿で、濃赤だの青だのと、項目を強調するために付けたのでしょうけど、ご自身には見やすいかもしれませんが、万人に見やすいわけではありません。 |
作成者: | mNeji [ 2019年6月19日(水) 13:13 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
pal さんが書きました: 余計なお世話を一つ。 2019年6月19日(水) 01:02 の投稿で、濃赤だの青だのと、項目を強調するために付けたのでしょうけど、ご自身には見やすいかもしれませんが、万人に見やすいわけではありません。 なるほど、そのような考え方もあるのですね、参考になりました。 でも、このトピックのテーマは「Firefoxでダークなバックグラウンド色を如何にして完全なものに近づけるか?」です。当然なことに、私もダークな色調で運行をしております。 問題の投稿は、正確を期す為に、エディタで作成し、タブでインデントして大まかに調整したものせでした。それをこちらのエディタにペーストして整形をしました。 その結果、CSSをコードに入れるとその幅が広くなり、文章の流れが見難くなるという問題でした。そこでコード部分を右にインデントしてバランスをとろうとしたのですが、上手くいきませんでした。 そこで、逆に、文章の部分をカラーで強調したのが今回の投稿でした;
......とここまで自分のエディタで書いてから、ふと返信の為にエディタを見ると昨日まで見慣れた「2行のアイコン」のアイコンの下にボタン型の[Font Size][Font Family][paragraph]が追加されているではありませんか。これを利用して文章フォーマットを見やすくせよ、というのが今回のご発言の趣旨でしょうか?
確かに、「Mozilla Firefox」で発言の多い方は、往々にして「ダークな色調に批判的である」ことが多いようです。でも「目の性能」のために「ダークな色調で安定的に運行したい」というユーザがいるのも理解していただきたいものです。 これから外出するので、当方の投稿の改良バージョンは明日になります。 ---- ちょっとテスト: テスト テスト テスト |
作成者: | pal [ 2019年6月19日(水) 17:02 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
引用: 「ダークな色調に批判的である」ことが多いようです。でも「目の性能」のために「ダークな色調で安定的に運行したい」というユーザがいるのも理解していただきたいものです。 別にダークな色調を批判しているわけではありませんし、批判するようなことを書いたつもりはありません。 先の投稿が批判的に感じてしまったのであれば、お詫びします。 人それぞれで見やすい色やくみあわせがあります。 そのため、変に色を付けるよりは、太字にするとか斜字にするとか、あるいは、一つ大きいフォントサイズにするとかのほうが、個人的には様々な環境に適していると考えます。 |
作成者: | mNeji [ 2019年6月19日(水) 21:01 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
もしもpalさんの「2019-06-19(水) 13:13」のご発言が、下記のようでしたらここまで強く反発はしなかったと思います。 pal さんが書きました: 引用: 2019-06-19(水) 13:13 (第一段落) の投稿で、濃赤だの青だのと、項目を強調するために付けたのでしょうけど、ご自身には見やすいかもしれませんが、万人に見やすいわけではありません。 引用: 2019-06-19(水) 17:02 (第二段落) 人それぞれで見やすい色やくみあわせがあります。 そのため、変に色を付けるよりは、太字にするとか斜字にするとか、あるいは、一つ大きいフォントサイズにするとかのほうが、個人的には様々な環境に適していると考えます。 さらに、当方はすでに具体的な対応策として; mNeji さんが書きました: 引用: 2019-06-19(水) 13:13 (第三段落) そこで、逆に、文章の部分をカラーで強調したのが今回の投稿でした;
引用: 2019-06-19(水) 13:13(第四段落) ......とここまで自分のエディタで書いてから、ふと返信の為にエディタを見ると昨日まで見慣れた「2行のアイコン」のアイコンの下にボタン型の[Font Size][Font Family][paragraph]が追加されているではありませんか。これを利用して文章フォーマットを見やすくせよ、というのが今回のご発言の趣旨でしょうか? 掲示板というのは、自分たちの問題を、参加者どうしのフランクな論議の上で成り立ちます。
問題の「2019-06-19(水) 13:13」記事は「すでにダークな環境を作ったが、さらなる改善案はないか?」と思われて訪問される方の為に、保持します。フォーラムのポリシーに適合しないというならば直裁にお教えください。 「ライトな環境」の方がご覧になっても違和感の無いフォーマットは、実際に試してから報告します。考えて見れば、「ライトな環境」と「ダークな環境」とは混然一体となって行くので、今こそ積極的にトライするべきだと考えるようになりました。 |
作成者: | EarlgreyTea [ 2019年6月19日(水) 22:22 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
mNeji さん pal さんはこのトピックの主題である「Firefoxでの暗いバックグラウンド色利用」や mNeji さんの趣向を批判しているわけではありませんよ。 「Webの掲示板ではいろんなブラウザからでも見やすいように配慮してください」ということを指摘してるだけだと思います。 現実問題として、Posted: 2019年6月19日(水) 01:02 の投稿は標準的な環境では、添付のように大変見づらい表示になっています。 添付ファイル: 私はマウスカーソルでなぞって反転させてようやく読めたくらいです。色覚特性の個人差もあるかもしれませんが、 mNeji さんが書きました: なるほど、そのような考え方もあるのですね、参考になりました。 というレベルではないと思います。Webページでは文字の色は必要最小限にして、背景色は使わない方がいいと思います。 そして、モノクロ印刷したり、特定の配色が見えづらい方でも意味が通じるように、色で分類したり意味を持たせない方が無難です。 参考までに、Wikipedia では色の使用に関するガイドラインがあったりします。 Wikipedia:色の使用 - Wikipedia |
作成者: | mNeji [ 2019年6月20日(木) 01:40 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
EarlgreyTeaさん、初めまして。 EarlgreyTea さんが書きました: pal さんはこのトピックの主題である「Firefoxでの暗いバックグラウンド色利用」や mNeji さんの趣向を批判しているわけではありませんよ。 これについては、palさんに当方の意見はお出ししています。そのお返事を見てから考えたいです。ただ、食い違いの根は深いと思います。「Webの掲示板ではいろんなブラウザからでも見やすいように配慮してください」ということを指摘してるだけだと思います。
引用: 「Webの掲示板ではいろんなブラウザからでも見やすいように配慮してください」 今回のトピックで判って来たのですが、「いろんなブラウザ」だけでなく「色々な背景色のユーザ」への配慮も重要だと認識始めました。この2番目の観点が、お二人に共通して欠落しているのではありませんか?引用: 現実問題として、Posted: 2019年6月19日(水) 01:02 の投稿は標準的な環境では、添付のように大変見づらい表示になっています。 なお、背景色の設定によって文字色が変わるのは、すでに当方の「2019-06-19(水) 13:13」で書きた通りです;(図は省略) 私はマウスカーソルでなぞって反転させてようやく読めたくらいです。 引用: 「Dark Reader」がON ---> 「濃い赤の背景色に白い文字色」に見えます。 「Dark Reader」がOFF --> 「濃い赤の背景色に黒い文字色」に見えます。 要は「背景色」と「文字色」とのコントラストを「色々な背景色のユーザ毎に如何にして最適化するのか?」というのが課題でしょう。このフォーラムでもアタックして欲しいでしね。 引用: 私はマウスカーソルでなぞって反転させてようやく読めたくらいです。 私も良くあります。最悪な場合、pdfに保存し、text挿入で「注釈」を入れています。引用: 色覚特性の個人差もあるかもしれませんが、 ここら辺の認識の相違が一番大きそうです。人は加齢と共に;mNeji さんが書きました: なるほど、そのような考え方もあるのですね、参考になりました。 というレベルではないと思います。
引用: Webページでは文字の色は必要最小限にして、背景色は使わない方がいいと思います。 上記が、現在の「Mozilla-Firefox」フォーラムの主要意見であろうことは理解します。これは敢えて言えば「PC世代の中堅の皆様の価値観」なのでしょう。しかし、其の正当性が揺らぎ出しているのが(パラダイム・シフト)、現在ではないでしょうか?そして、モノクロ印刷したり、特定の配色が見えづらい方でも意味が通じるように、色で分類したり意味を持たせない方が無難です。 参考までに、Wikipedia では色の使用に関するガイドラインがあったりします。 Wikipedia:色の使用 - Wikipedia 私見ですが、Wikipediaの記載が無誤謬とは限りませんね。 |
作成者: | EarlgreyTea [ 2019年6月21日(金) 08:13 ] |
記事の件名: | Re: 「Firefoxでの暗いバックグラウンド色利用」での改善策は? |
mNeji さんが書きました: 「1:1の論議」に対する割り込みは推奨されませんよね。 私には、あなたが勘違いで palさんに噛みついて、一方的に語っていただけにしか見えないのですが… palさんは、Posted: 2019年6月19日(水) 01:02 投稿で使用された文字の背景色指定は、 「ご自身には見やすいかもしれませんが、万人に見やすいわけではありません」 と指摘しているだけです。 これに対して mNeji さんが想定外のエキセントリックな反応を見せたので、 「別にダークな色調を批判しているわけではありませんし、批判するようなことを書いたつもりはありません」 と誤解であることを釈明されたわけです。 mNeji さんはこれに納得されず、一方的に自己正当化の演説を続けている、というのが今の状況です。 いったん投稿したものを後から編集で件の茶色と濃紺で塗って強調しているあたり、 よほどお気に入りの自信作でそれを自慢したかった、ということでしょうか。 しかし、mNeji さんには、以下 2点を認識してほしいと思います。
mNeji さんが書きました: 「いろんなブラウザ」だけでなく「色々な背景色のユーザ」への配慮 私が「いろんなブラウザ」と書いたのは、閲覧者のさまざまな環境や運用などを含めた意味です。 「色々な背景色のユーザ」とはあまりに視野狭窄な見方です。 今問題なのは、標準的なブラウザ環境で閲覧してる大多数の人と、 カスタマイズしてサイト制作者の意図していない表示で閲覧してる人がいる、ということかと思います。 mNeji さんが書きました: なお、背景色の設定によって文字色が変わるのは、すでに当方の「2019-06-19(水) 13:13」で書きた通りです; その認識は正しくありません。 Dark Reader や Dark Background and Light Text といった拡張機能は、Webページの背景色や文字の色を明示的に調整・改ざんしているのであって、 背景色を設定したら自然と文字の色が変わるわけではありません。 mNeji さんが書きました: 私も良くあります。最悪な場合、pdfに保存し、text挿入で「注釈」を入れています。 mNeji さんが書きました: ここら辺の認識の相違が一番大きそうです。人は加齢と共に;(以下略) mNejiさんが投稿に設定した背景色で視認性が極度に低下したという事実の話であって、 あなたの個人的な事情や社会問題にすり替えられても困ります。 mNeji さんが書きました: 上記が、現在の「Mozilla-Firefox」フォーラムの主要意見であろうことは理解します。これは敢えて言えば「PC世代の中堅の皆様の価値観」なのでしょう。しかし、其の正当性が揺らぎ出しているのが(パラダイム・シフト)、現在ではないでしょうか? 唐突に何を理解して、何を語りだしたのか、正直理解に苦しみます。 mNeji さんが書きました: 私見ですが、Wikipediaの記載が無誤謬とは限りませんね。 どうやら、権威主義的な思考で私がそれを持ち出してきたとお思いなのでしょう。 あくまで、実際に運用されているガイドラインとして参考になるので紹介したまでです。 実際に中身を読むことをおすすめします。 根拠も示されていますので、きちんとお読みになれば、私が説明するまでもありません。 |
ページ 1 / 2 | All times are UTC + 9 hours |
Powered by phpBB® Forum Software © phpBB Group http://www.phpbb.com/ |