フォーラム:見出しのデザインを変えてみよう
「エンペディアの見た目をもっと変えていこうキャンペーン」第2弾です。(ちなみに第1弾はテンプレート・トーク:Highlighter)
節名 [ 編集 ]
このセクションタイトル。そう、おそらくエンペディアンの皆さんが見飽きているこの表示。「内容に一区切りをつける」時に使う見出しですが、MediaWiki既定 即ち Wikipedia と同じものです。独自性を追求出来ないかと思い、見出しのデザインを変える提案をします。CSSで簡単に変えることが出来るので、手間はあまりかかりません。一番の問題は"しっくり来るデザインが見つかるかどうか"です。という訳でフォーラムを立て、コミュニティの皆さんのご意見を請おうと思います。--1108-Kiju/Talk 2023-03-12T00:29:55 (JST)
- 原案:Special:diff/710547 - 360度さん。ご多忙ということで、代わってフォーラムを立ち上げさせていただきます(Diff)。
- メモ:一応書いておきます。セレクタは
== $1 ==
が「h2」、その後両端の「=」を増やすごとに数字が上がります。
案やコメント[編集]
(除去)
- で見出し名が緑色、ボックスに囲まれるようになります。後は調整して標準名前空間のみに表示させる感じに。ただ、結構スタイルが汚いです。--1108-Kiju/Talk 2023-03-12T00:35:13 (JST)
- 大筋の方向性について:大賛成です。ウィキペディアとの差別化を図って、もっと見た目が華やかなサイトにしましょう。
- h2 以降だけでなく、h1(冒頭のタイトル表示)を変えるのも重要だと思っています。
- 今後の提案方法について:参加者全員がいちいち、CSSを利用者ページに転記するのは手間ですから、スクリーンショットも一緒に呈示するようにしましょう。ただ、エンペディアにアップロードするとサーバーを圧迫してしまう上に、記事のスクリーンショットはCCライセンス的にどうなんだ、という面倒くさい問題が生じるので、外部サイトのアップローダー(これなど)を使うことにしましょう。
- 細かな実装方法について(理解できなければ読み飛ばしてもOK)
- タグに直接CSSを指定するのは望ましくないので、「h1」に指定したいときは「h1.firstHeading」か、単に「.firstHeading」と指定するのが望ましいです。ただし、h2 以降については特にクラスが用意されていないので、単に「h2」「h3」と書くしかないのですが.....(「h2 .mw-headline」という指定方法もあるが.....そこまでやる必要あるのか?)
- 「目次」も h2 タグが付いているので、明示的に避けるには
「h2:not(#mw-toc-heading)」と記載するのが吉です。後述のとおり、h2:not([id]) でいいかも。 - (備忘録)真面目に・几帳面にやろうとするなら、サイト全体に反映する前に、PC/スマホ、各種ブラウザ、Vector/モノブックスキン での見え方の違いをチェックする必要があります(ダルすぎ………)。とりあえず「提案する段階」では、各々の環境でキレイに表示されていれば問題ないと思います。
- 私からの提案:このようなデザインはいかがでしょうか。ソースは私のユーザーページ見てください。
- 追記 グラデーションで徐々に消していくなんてデザインも可能。---謎の管理者もどき BadEditor 2023-03-12T01:59:14 (JST)
- その他の案について:こういったページやこういったページで紹介されているデザインは、ほぼ全て実現可能です。(一部、不可能なものもあります。)ただ、候補があまりに多すぎると、合意を形成するのが難しくなりそうですが………
- ---謎の管理者もどき BadEditor 2023-03-12T01:14:10 (JST)
- 追記 この程度の CSS に著作権などないので、転記するときには「履歴継承」をしなくて大丈夫です。(したい人はしてもよろし)---謎の管理者もどき BadEditor 2023-03-12T01:27:28 (JST)
┌───┘
なんかすぐに解決方法、思いつきました。id も class も style も指定されていない、生身の h2 限定で CSS を適用すればよさそうですね(ここ見て)。---謎の管理者もどき BadEditor 2023-03-12T01:37:42 (JST)
BadEditorさん提案のデザインをCSSにコピペしてやってみました。全体的にはとても良い感じだと思うんですが、個人的にはh3以下はちょっと主張が強すぎると感じました。何か装飾を付けるなら、h2と同じ系統の色を使って、もう少し大人しい感じにしたほうがいい気がします。--Written By 360度 (Talk) 2023-04-01T23:16:27 (JST)
- h3~h4 について、こんな感じでどげんでしょうか? MediaWikiデフォルトのh3~h4って、見出しなのか、単にちょっと太くて大きい文字なのか、よく分かんないですよね。---謎の管理者もどき BadEditor 2023-04-03T10:27:18 (JST)
- しばらくユーザーCSSで試していたんですが、ファイルページの見出しだけ適用されてないですね。ソース見たらfilelinksって個別のidが指定されていたので、これも個別に指定する必要があるんだと思います。--Written By 360度 (Talk) 2023-04-09T21:58:10 (JST)
- 追記 節単位での編集プレビュー画面における「脚注プレビュー」のh2も適用されていないことを確認しました。こちらは、mw-ext-cite-cite_section_preview_references_headerというidが指定されています。--Written By 360度 (Talk) 2023-04-25T20:18:36 (JST)
- ご確認ありがとうございます。こちらを追加した案で再提案します。.....「脚注プレビュー」に関しては、むしろ無いほうがいいんじゃないかなと思ったり。---謎の管理者もどき BadEditor 2023-04-26T09:08:18 (JST)
- 情報 BadEditorさんのCSSを1ヵ月間使いましたが、特に問題はありませんでした。--1108-Kiju/Talk 2023-05-02T00:14:05 (JST)
- 異論がなければ実行するぞーーーーーー!!! ---謎の管理者もどき BadEditor 2023-05-02T20:18:57 (JST)
変更しました[編集]
異論なかったので変更しました。感想はこちらまで。---謎の管理者もどき BadEditor 2023-05-14T13:56:15 (JST)
- 慣れという可能性もあるので一様には言えませんが、古い方に戻せるようにしてもいいのではないでしょうか?commomで変更可であるようには見えますが。--かちゅう (トーク) 2023-05-14T19:56:35 (JST)
スマホで「H3~H4」の見出しが崩れることが多かったので、オリジナルデザインはPC版でのみ適用されるように変更しました(差分)---謎の管理者もどき BadEditor 2023-07-30T15:26:12 (JST)
終了提案[編集]
確認 もう誰も興味なさそうなので、しばらく反対意見がなければ一旦このフォーラムを終了しようと思いますがいかがでしょうか。--Written By 360度 (Talk) 2023-09-05T15:35:50 (JST)