フォーラム:見出しのデザインを変えてみよう

フォーラム:メインページ > 見出しのデザインを変えてみよう 進行中

「エンペディアの見た目をもっと変えていこうキャンペーン」第２弾です。（ちなみに第１弾はテンプレート・トーク:Highlighter）

節名　[ 編集 ]

このセクションタイトル。そうおそらくエンペディアンの皆さんが見飽きているこの表示。「内容に一区切りをつける」時に使う見出しですが、MediaWiki既定即ち Wikipedia と同じものです。独自性を追求出来ないかと思い、見出しのデザインを変える提案をします。CSSで簡単に変えることが出来るので、手間はあまりかかりません。一番の問題は"しっくり来るデザインが見つかるかどうか"です。という訳でフォーラムを立て、コミュニティの皆さんのご意見を請おうと思います。--1108-Kiju/Talk 2023-03-12T00:29:55 (JST)

原案：Special:diff/710544 - user:360度さん。ご多忙ということで、代わってフォーラムを立ち上げさせていただきます（Diff）。
メモ：一応書いておきます。セレクタは== $1 ==が「h2」、その後両端の「=」を増やすごとに数字が上がります。

案やコメント

h2 {
padding: 0.2em 0.5em;
    margin: 1em 0;
    font-weight: bold;
    color: #4db56a;
    background: #FFF;
    border: solid 1.5px #6091d3;
    border-radius: 5px;
}
h2  {
    margin: 0; 
    padding: 0;
}
h2{
display:inline;
}

で見出し名が緑色、ボックスに囲まれるようになります。後は調整して標準名前空間のみに表示させる感じに。ただ、結構スタイルが汚いです。--1108-Kiju/Talk 2023-03-12T00:35:13 (JST)

大筋の方向性について：大賛成です。ウィキペディアとの差別化を図って、もっと見た目が華やかなサイトにしましょう。
- h2 以降だけでなく、h1（冒頭のタイトル表示）を変えるのも重要だと思っています。
今後の提案方法について：参加者全員がいちいち、CSSを利用者ページに転記するのは手間ですから、スクリーンショットも一緒に呈示するようにしましょう。ただ、エンペディアにアップロードするとサーバーを圧迫してしまう上に、記事のスクリーンショットはCCライセンス的にどうなんだ、という面倒くさい問題が生じるので、外部サイトのアップローダー（これなど）を使うことにしましょう。
細かな実装方法について（理解できなければ読み飛ばしてもOK）
- タグに直接CSSを指定するのは望ましくないので、「h1」に指定したいときは「h1.firstHeading」か、単に「.firstHeading」と指定するのが望ましいです。ただし、h2 以降については特にクラスが用意されていないので、単に「h2」「h3」と書くしかないのですが.....
- 「目次」も h2 タグが付いているので、明示的に避けるには「h2:not(#mw-toc-heading)」と記載するのが吉です。
- （備忘録）真面目に・几帳面にやろうとするなら、サイト全体に反映する前に、PC/スマホ、各種ブラウザ、Vector/モノブックスキンでの見え方の違いをチェックする必要があります（ダルすぎ………）。とりあえず「提案する段階」では、各々の環境でキレイに表示されていれば問題ないと思います。
私からの提案：このようなデザインはいかがでしょうか。ソースは私のユーザーページ見てください。
その他の案について：こういったページやこういったページで紹介されているデザインは、ほぼ全て実現可能です。（一部、不可能なものもあります。）ただ、候補があまりに多すぎると、合意を形成するのが難しくなりそうですが………

---謎の管理者もどき BadEditor 2023-03-12T01:14:10 (JST)

フォーラム:見出しのデザインを変えてみよう

案やコメント

案内メニュー

検索