「スーパーロボット大戦Wiki・トーク:ナビゲーションテンプレート」の版間の差分

提供: スーパーロボット大戦Wiki
ナビゲーションに移動 検索に移動
(色の変更)
 
 
(3人の利用者による、間の14版が非表示)
1行目: 1行目:
 
== 色の変更 ==
 
== 色の変更 ==
 +
先日「Wikipediaとの差別化のために、ナビゲーションテンプレートの色を変える」という案を[[利用者:Licorice|りこりす]]さんが出されましたので、いくつか色見本を作ってみました。お気に入りの色がございましたら、コメントをよろしくお願いいたします。--[[利用者:Ochaochaocha3|ocha]] 2012年7月14日 (土) 16:24 (JST)
  
先日、Wikipediaとの差別化のためにナビゲーションテンプレートの色を変えるという案をりこりすさんが出されましたので、いくつか色見本を作ってみました。お気に入りの色がございましたら、コメントをよろしくお願いいたします。--[[利用者:Ochaochaocha3|ocha]] 2012年7月14日 (土) 16:24 (JST)
+
=== コメント ===
 +
*私は、現在のModernテーマの青色と補色の関係にある[[#オレンジ|オレンジ]]を推したいと思います。--[[利用者:Ochaochaocha3|ocha]] 2012年7月14日 (土) 16:52 (JST)
 +
*ボクは同系色が好きなので、リストの中からでは緑推しですかね。赤も悪くないかな、と思いつつ、赤やオレンジを採用する場合、もっと薄い色にしないと目が痛い、と感じました。補色を入れておくことで幻惑は防げますが、その分刺激はどうしても強くなってしまいますね。イラスト系サイトではないので、幻惑よりも疲労に重点を置いても良いかと思います。--[[利用者:Licorice|りこりす]] 2012年7月20日 (金) 09:15 (JST)
 +
*私の場合には黄緑か、緑が好みですね。メインページの色彩もそれに合わせればいいのかなと思います。<br />話題から外れますが、ウェブページの場合には色彩も重要ですが、書式のバランスも考えないといけませんか。行間隔を離すことや、書式フォントを見やすいものに変更するとか。この辺り調整すれば見やすいページになると思います。--[[利用者:Cross|Cross]] 2012年7月20日 (金) 17:54 (JST)
 +
*掲載から2週間経ちました。緑を推す方が多いので、緑を適用してみます。--[[利用者:Ochaochaocha3|ocha]] 2012年7月29日 (日) 19:43 (JST)
  
なお、色の設定は、タイトルをWebセーフカラーに、以下見出しのレベルが下がるごとに明るさを5%上げた色にしています。
+
=== 色見本 ===
 +
色の設定は、タイトルをWebセーフカラーに、以下見出しのレベルが下がるごとに明るさを5%上げた色にしています。
  
 
以下に色見本と「[[MediaWiki:Common.css]]」での設定を示します。
 
以下に色見本と「[[MediaWiki:Common.css]]」での設定を示します。
  
=== 赤 ===
+
{| class="wikitable"
 +
|+ 早見表
 +
|-
 +
! [[#赤|赤]] || [[#オレンジ|橙]] || [[#黄緑|黄緑]] || [[#緑|緑]] || [[#青緑|青緑]] || [[#青|青]] || [[#紫|紫]] || [[#赤紫|赤紫]]
 +
|-
 +
| style="text-align: center;" | <span style="color: #f99;">■</span> || style="text-align: center;" | <span style="color: #fc3;">■</span> || style="text-align: center;" | <span style="color: #9c6;">■</span> || style="text-align: center;" | <span style="color: #9c9;">■</span> || style="text-align: center;" | <span style="color: #9cc;">■</span> || style="text-align: center;" | <span style="color: #ccf;">■</span> || style="text-align: center;" | <span style="color: #c9f;">■</span> || style="text-align: center;" | <span style="color: #f9c;">■</span>
 +
|}
 +
 
 +
==== 赤 ====
 
{{Navbox
 
{{Navbox
 
| name = シリーズ一覧
 
| name = シリーズ一覧
27行目: 41行目:
 
 }}
 
 }}
 
}}
 
}}
=== オレンジ ===
+
<pre>/*    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;
 +
}</pre>
 +
 
 +
==== オレンジ ====
 
{{Navbox
 
{{Navbox
 
| name = シリーズ一覧
 
| name = シリーズ一覧
 
| title = [[シリーズ一覧]]
 
| title = [[シリーズ一覧]]
 
| state = uncollapsed
 
| state = uncollapsed
| titlestyle = background-color: #f96;
+
| titlestyle = background-color: #fc3;
| abovestyle = background-color: #ffaa80;
+
| abovestyle = background-color: #ffd24d;
| belowstyle = background-color: #ffaa80;
+
| belowstyle = background-color: #ffd24d;
| groupstyle = background-color: #ffaa80;
+
| groupstyle = background-color: #ffd24d;
 
| group1  = 王道シリーズ
 
| group1  = 王道シリーズ
 
| list1  = {{Navbox subgroup
 
| list1  = {{Navbox subgroup
   | groupstyle = background-color: #fb9;
+
   | groupstyle = background-color: #ffd966;
 
   | group1  = [[旧シリーズ]]
 
   | group1  = [[旧シリーズ]]
 
   | list1  = [[第2次スーパーロボット大戦|第2次]]([[第2次スーパーロボット大戦G|G]]) - [[第3次スーパーロボット大戦|第3次]] - [[スーパーロボット大戦EX|EX]] - [[第4次スーパーロボット大戦|第4次]]([[第4次スーパーロボット大戦S|S]]) - [[スーパーロボット大戦F|F]]([[スーパーロボット大戦F完結編|完結編]]) - [[スーパーロボット大戦コンプリートボックス|CB]]
 
   | list1  = [[第2次スーパーロボット大戦|第2次]]([[第2次スーパーロボット大戦G|G]]) - [[第3次スーパーロボット大戦|第3次]] - [[スーパーロボット大戦EX|EX]] - [[第4次スーパーロボット大戦|第4次]]([[第4次スーパーロボット大戦S|S]]) - [[スーパーロボット大戦F|F]]([[スーパーロボット大戦F完結編|完結編]]) - [[スーパーロボット大戦コンプリートボックス|CB]]
47行目: 80行目:
 
 }}
 
 }}
 
}}
 
}}
=== 黄 ===
+
<pre>/*    Level 1 color */
{{Navbox
+
.navbox-title,
| name = シリーズ一覧
+
table.navbox th {
| title = [[シリーズ一覧]]
+
    background: #fc3;
| state = uncollapsed
+
}
| titlestyle = background-color: #fc6;
+
 
| abovestyle = background-color: #ffd480;
+
/*    Level 2 color */
| belowstyle = background-color: #ffd480;
+
.navbox-abovebelow,
| groupstyle = background-color: #ffd480;
+
.navbox-group,
| group1  = 王道シリーズ
+
.navbox-subgroup .navbox-title {
| list1  = {{Navbox subgroup
+
    background: #ffd24d;
  | groupstyle = background-color: #fd9;
+
}
  | group1  = [[旧シリーズ]]
+
 
  | list1  = [[第2次スーパーロボット大戦|第2次]]([[第2次スーパーロボット大戦G|G]]) - [[第3次スーパーロボット大戦|第3次]] - [[スーパーロボット大戦EX|EX]] - [[第4次スーパーロボット大戦|第4次]]([[第4次スーパーロボット大戦S|S]]) - [[スーパーロボット大戦F|F]]([[スーパーロボット大戦F完結編|完結編]]) - [[スーパーロボット大戦コンプリートボックス|CB]]
+
/*    Level 3 color */
  | group2 = [[αシリーズ]]
+
.navbox-subgroup .navbox-group,
  | list2  = [[スーパーロボット大戦α|α]]([[スーパーロボット大戦α for Dreamcast|DC]]) - [[スーパーロボット大戦α外伝|α外伝]] - [[第2次スーパーロボット大戦α|第2次α]] - [[第3次スーパーロボット大戦α|第3次α]]</td>
+
.navbox-subgroup .navbox-abovebelow {
  | group3 = [[Zシリーズ]]
+
    background: #ffd966;
  | list3  = [[スーパーロボット大戦Z|Z]]([[スーパーロボット大戦Z スペシャルディスク|SPD]]) - [[第2次スーパーロボット大戦Z|第2次Z]]([[第2次スーパーロボット大戦Z 破界篇|破界篇]] / [[第2次スーパーロボット大戦Z 再世篇|再世篇]])</p>
+
}</pre>
 }}
+
 
}}
+
==== 黄緑 ====
=== 黄緑 ===
 
 
{{Navbox
 
{{Navbox
 
| name = シリーズ一覧
 
| name = シリーズ一覧
87行目: 119行目:
 
 }}
 
 }}
 
}}
 
}}
=== 緑 ===
+
<pre>/*    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;
 +
}</pre>
 +
 
 +
==== 緑 ====
 
{{Navbox
 
{{Navbox
 
| name = シリーズ一覧
 
| name = シリーズ一覧
107行目: 158行目:
 
 }}
 
 }}
 
}}
 
}}
 +
<pre>/*    Level 1 color */
 +
.navbox-title,
 +
table.navbox th {
 +
    background: #9c9;
 +
}
 +
 +
/*    Level 2 color */
 +
.navbox-abovebelow,
 +
.navbox-group,
 +
.navbox-subgroup .navbox-title {
 +
    background: #aad5aa;
 +
}
  
<pre>
+
/*    Level 3 color */
=== 青緑 ===
+
.navbox-subgroup .navbox-group,
 +
.navbox-subgroup .navbox-abovebelow {
 +
    background: #bdb;
 +
}</pre>
 +
 
 +
==== 青緑 ====
 
{{Navbox
 
{{Navbox
 
| name = シリーズ一覧
 
| name = シリーズ一覧
129行目: 197行目:
 
 }}
 
 }}
 
}}
 
}}
=== 青 ===
+
<pre>/*    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;
 +
}</pre>
 +
 
 +
==== 青 ====
 
現在の色です。
 
現在の色です。
 
{{Navbox
 
{{Navbox
150行目: 237行目:
 
 }}
 
 }}
 
}}
 
}}
=== 紫 ===
+
==== 紫 ====
 
{{Navbox
 
{{Navbox
 
| name = シリーズ一覧
 
| name = シリーズ一覧
170行目: 257行目:
 
 }}
 
 }}
 
}}
 
}}
=== 赤紫 ===
+
<pre>/*    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;
 +
}</pre>
 +
 
 +
==== 赤紫 ====
 
{{Navbox
 
{{Navbox
 
| name = シリーズ一覧
 
| name = シリーズ一覧
190行目: 296行目:
 
 }}
 
 }}
 
}}
 
}}
 +
<pre>/*    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;
 +
}</pre>

2012年7月29日 (日) 19:43時点における最新版

色の変更[ソースを編集]

先日「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;
}