Help:リンク色
 | この文書は手引き書です。ウィキペディア日本語版での活動の参考にされていますが、方針やガイドラインではありません。 |
 | リンクは、読者にとって明確にリンクだとわかるようにするべきです。 読者が文章からリンクを判別するのを妨げることになるので、リンク色を変更するのは控えてください。単に美観上の理由で標準の設定色から色を変更するのはやめましょう。 |
ウィキペディア内のリンク色は、リンク先の状態によって変わります。初期設定では個人設定で外装にベクターが適用されており、それぞれ色の意味は下表のようになっています。
| リンク例 | 解説 | 色表記（HTMLカラーコード、RGB方式） | 実際の色 |
|---|---|---|---|
| 青色のリンク | リンク先の記事が存在しています。 | #0645AD = rgb(6,69,173) | |
| 暗青色のリンク | リンク先の記事は訪問済みです。 | #0B0080 = rgb(11,0,128) | |
| 赤色のリンク | リンク先の記事は存在しません（未作成です）。 | #CC2200 = rgb(204,34,0) | |
| 薄赤色のリンク | リンク先の記事は存在せず（未作成です）、かつ訪問済みです。 | #A55858 = rgb(165,88,88) | |
| 濃茶色のリンク | スタブと呼ばれる未成長の記事へのリンクです。 | #772233 = rgb(119,34,51) | |
| 薄青色のリンク | 薄青色のリンクはウィキ間リンクと呼ばれ、ウィキペディアの他言語版や姉妹プロジェクトへのリンクです。 なお、このリンクの場合には、リンク先が実際に存在しているかどうかに関わらずこの色で表示されます。 |
#3366BB = rgb(51,102,187) | |
| 薄青色のリンク | 外部リンクと呼ばれ、ウィキペディア外の任意のウェブページに直接リンクしています。色は上のウィキ間リンクと同じですが、末尾に記号が付いています。 | #3366BB = rgb(51,102,187) | |
| 紫色のリンク | 訪問済みのページへのリンクです。 | #663366 = rgb(102,51,102) |
上表の四角内の見本色は、実際の文字色よりもいくらか濃く見えます。同様に、大文字や太字は濃く見えます。
また、実際の表示色は、各利用者の利用環境（OS、ブラウザ、モニター）などの設定によっても違って見えますし、液晶画面の場合には見る角度によっても異なって見えるでしょう。アカウントを取得すると、個人設定を利用して表示色などをカスタマイズすることもできます。
リンク色のカスタマイズ
編集ログインユーザーの場合、CSSの知識があれば、個人設定を修正してリンク色をカスタマイズすることができます。この変更は、あなたがウィキペディアのどのページを閲覧するときも適用になりますが、他の利用者には影響はありません。
CSSでのリンク色は次のようになっています。
- a:link — 通常リンク（未訪問）
- a:visited — 通常リンク（訪問済）
- a:active — アクティブリンク
- a:hover — ホバー中のリンク
- ※「アクティブ」や「ホバー」は、そのリンク上にマウスを重ねたりクリックした際の挙動を示します。タッチスクリーンの場合などには指定しても意味がありません。
- ※色の指定は16進数で行います。ウェブカラーを参照してください。
実際のCSSは以下のようになっています。
/* standard link colors */
.mw-body a:link { color: #0000FF; } /* normal unvisited links */
.mw-body a:link:visited { color: #0B0080; } /* visited links */
.mw-body a:link:active { color: #FF0000; } /* active links */
.mw-body a:link.new { color: #FF0000; } /* new links */
.mw-body a:link.interwiki { color: #3366BB; } /* interwiki links */
.mw-body a:link.external { color: #3366BB; } /* external links */
.mw-body a:link.stub { color: #772233; } /* hovered links */
.mw-body a:link {color: #FF0000}
.mw-body a:visited {color: #00FF00}
.mw-body a:hover {color: #FF00FF}
.mw-body a:active {color: #0000FF}
注意点:
- 「a:hover」より先に「a:link」と「a:visited」を定義する必要があります。
- 「a:active」より先に「a:hover」を定義する必要があります。
- 冒頭に「.mw-body」が必要です。
- リダイレクト
リダイレクトは緑色のリンクで表示されています。
.mw-body a.mw-redirect {color:#308050}
.mw-body a.mw-redirect:visited {color:#3070A0}
- 外部リンク
.mw-body a.external {color: #008000}
.mw-body a.external:visited {color: #008000}