スーパーロボット大戦Wiki・トーク:ナビゲーションテンプレート

色の変更

先日「Wikipediaとの差別化のために、ナビゲーションテンプレートの色を変える」という案をりこりすさんが出されましたので、いくつか色見本を作ってみました。お気に入りの色がございましたら、コメントをよろしくお願いいたします。--ocha 2012年7月14日 (土) 16:24 (JST)

コメント

• 私は、現在のModernテーマの青色と補色の関係にあるオレンジを推したいと思います。--ocha 2012年7月14日 (土) 16:52 (JST)
• ボクは同系色が好きなので、リストの中からでは緑推しですかね。赤も悪くないかな、と思いつつ、赤やオレンジを採用する場合、もっと薄い色にしないと目が痛い、と感じました。補色を入れておくことで幻惑は防げますが、その分刺激はどうしても強くなってしまいますね。イラスト系サイトではないので、幻惑よりも疲労に重点を置いても良いかと思います。--りこりす 2012年7月20日 (金) 09:15 (JST)
• 私の場合には黄緑か、緑が好みですね。メインページの色彩もそれに合わせればいいのかなと思います。
  話題から外れますが、ウェブページの場合には色彩も重要ですが、書式のバランスも考えないといけませんか。行間隔を離すことや、書式フォントを見やすいものに変更するとか。この辺り調整すれば見やすいページになると思います。--Cross 2012年7月20日 (金) 17:54 (JST)
• 掲載から2週間経ちました。緑を推す方が多いので、緑を適用してみます。--ocha 2012年7月29日 (日) 19:43 (JST)

色見本

色の設定は、タイトルをWebセーフカラーに、以下見出しのレベルが下がるごとに明るさを5％上げた色にしています。

以下に色見本と「MediaWiki:Common.css」での設定を示します。

早見表

赤	橙	黄緑	緑	青緑	青	紫	赤紫
■	■	■	■	■	■	■	■

赤

/*     Level 1 color */
.navbox-title,
table.navbox th {
    background: #f99;
}

/*     Level 2 color */
.navbox-abovebelow,
.navbox-group,
.navbox-subgroup .navbox-title {
    background: #ffb3b3;
}

/*     Level 3 color */
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
    background: #fcc;
}

オレンジ

/*     Level 1 color */
.navbox-title,
table.navbox th {
    background: #fc3;
}

/*     Level 2 color */
.navbox-abovebelow,
.navbox-group,
.navbox-subgroup .navbox-title {
    background: #ffd24d;
}

/*     Level 3 color */
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
    background: #ffd966;
}

黄緑

/*     Level 1 color */
.navbox-title,
table.navbox th {
    background: #9c6;
}

/*     Level 2 color */
.navbox-abovebelow,
.navbox-group,
.navbox-subgroup .navbox-title {
    background: #a6d279;
}

/*     Level 3 color */
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
    background: #b2d98c;
}

緑

/*     Level 1 color */
.navbox-title,
table.navbox th {
    background: #9c9;
}

/*     Level 2 color */
.navbox-abovebelow,
.navbox-group,
.navbox-subgroup .navbox-title {
    background: #aad5aa;
}

/*     Level 3 color */
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
    background: #bdb;
}

青緑

/*     Level 1 color */
.navbox-title,
table.navbox th {
    background: #9cc;
}

/*     Level 2 color */
.navbox-abovebelow,
.navbox-group,
.navbox-subgroup .navbox-title {
    background: #aad5d5;
}

/*     Level 3 color */
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
    background: #bdd;
}

青

現在の色です。

紫

/*     Level 1 color */
.navbox-title,
table.navbox th {
    background: #c9f;
}

/*     Level 2 color */
.navbox-abovebelow,
.navbox-group,
.navbox-subgroup .navbox-title {
    background: #d9b3ff;
}

/*     Level 3 color */
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
    background: #e5ccff;
}

赤紫

/*     Level 1 color */
.navbox-title,
table.navbox th {
    background: #f9c;
}

/*     Level 2 color */
.navbox-abovebelow,
.navbox-group,
.navbox-subgroup .navbox-title {
    background: #ffb3d9;
}

/*     Level 3 color */
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
    background: #ffcce6;
}