RalfRoletschek: 1 Version: Hilfe:Farben

2013-09-11T06:50:17Z

1 Version: Hilfe:Farben

Neue Seite

{{Shortcut|WP:Color, H:FT}}
{{Hilfe}}

Um ein einheitliches Erscheinungsbild zu wahren, sollten '''Farben''' in der Wikipedia mit viel Bedacht eingesetzt werden. Nutze Farben in [[WP:Artikel|Artikeln]] nur in Ausnahmefällen, wenn sie inhaltlich sinnvoll sind. Auf deiner [[Hilfe:Benutzernamensraum|Benutzerseite]] sind deiner Farbgestaltung keine Grenzen gesetzt. Wenn du ein [[Wikipedia:Portale|Portal]] gestaltest, darf es durchaus etwas farbiger werden, orientiere dich jedoch an Bestehendem.

__TOC__

Zur Farbgebung dient in MediaWiki wie in [[Hypertext Markup Language|HTML]] das ''style-''Attribut. Bereiche, die man farbig gestalten will, werden in Tags eingeschlossen, zum Beispiel in span-Tags für Zeichenfolgen im Fließtext oder div-Tags für ganze Absätze und Gruppen von Elementen.

Im ''style-''Attribut färbt man mit den [[Cascading Style Sheets|CSS]]-Anweisungen <code>color:#RRGGBB</code> für Textfarbe und mit <code>background-color:#RRGGBB</code>, oder kurz <code>background:#RRGGBB</code> für Hintergrundfarbe einen Abschnitt ein. „<code>#RRGGBB</code>“ steht für eine [[Hexadezimale Farbdefinition]]: Der Rotwert (RR) kann zwischen 00 und FF (entspricht dezimal 255) liegen, ebenso der Grün- (GG) und der Blauwert (BB). Statt der Angabe <code>#RRGGBB</code> ist, außer mit <code>bgcolor</code>, immer auch die [[H:KF|Kurzangabe]] <code>#RGB</code> möglich.
Man kann statt der Codierung „<code>#RRGGBB</code>“ auch die unten aufgeführten Farbnamen verwenden (ohne „#“).

== Farben verwenden ==
{| class="wikitable"
|- class="hintergrundfarbe6"
! Aktion
! Wikitext
! Ergebnis
|-
| Farbiger Text
| <code><nowiki> Text </nowiki></code>
| Text
|-
| Farbige Absätze
| <code><nowiki> Absatz </nowiki></code>
| Absatz
|-
| Hintergrund für ein oder einige Wörter
| <code><nowiki> Beispiel </nowiki></code>
| Beispiel
|-
| Hintergrund eines Absatzes
| <code><nowiki> Absatz </nowiki></code>
| Absatz
|-
| Farbiger Text + Hintergrund eines Absatzes
| <code><nowiki> Absatz </nowiki></code>
| Absatz
|-
| Hintergrund einer Tabellenzelle 
| <code><nowiki>style="background:#fedcba" | Text</nowiki></code>
|style="background:#fedcba" title="background:#fedcba"| Text
|-
|rowspan="2"| Hintergrund- und/oder Textfarbe in Tabellenzelle, ''mit [[Tooltip]]''
| {{Vorlage|Coltit|ffa}}
|{{Coltit|ffa}}
|-
|colspan="2"|''zur vollständigen Beschreibung aller Parameter siehe die [[Vorlage:Coltit|Vorlagendokumentation]]''
|-
|colspan="3"|Die Kurzformen''kombination'' <code>bgcolor=#fa3</code> ''wird von einigen [[Internet Explorer|Browsern]] falsch aufgelöst'' – keinesfalls verwenden!
|}

Rot als Textfarbe sollte in Artikeln nicht verwendet werden; ''siehe auch [[Hilfe:Textgestaltung]]''.

Wikipedia Farbdefinitionen: für Rahmen und Hintergründe von [[Wikipedia:Textbausteine|Textbausteinen]], Tabellen und anderem. Hier: Standardvorgaben für „dunkle Schrift auf hellem Grund“. Die Farben sind unabhängig von den direkten Farbwerten zu verstehen und können prinzipiell für unterschiedliche [[Hilfe:Skin|Skins]] unterschiedlich sein.

=== Hintergrundfarben ===
; Anwendungsbeispiele:
* Innerhalb vom Fließtext oder einer Textzeile
** <code><nowiki></nowiki></code>innerhalb einer Textzeile<code><nowiki></nowiki></code>
* oder etwas schöner mit „padding“ links und rechts
** <code><nowiki></nowiki></code>innerhalb einer Textzeile<code><nowiki></nowiki></code>
* Blockweise
** <code><nowiki><div class="hintergrundfarbe5"></nowiki></code>Text, Bilder, Tabellen usw.<code><nowiki></div></nowiki></code>

{| class="wikitable"
|- class="hintergrundfarbe6"
! Klassen-Name
! Kurzbeschreibung
! Farbe in allen [[Hilfe:Skin|Skins]]
|-
| hintergrundfarbe1
| Wie <code>class="wikitable"</code>
| class="hintergrundfarbe1" style="text-align:center;" | #F9F9F9
|-
| hintergrundfarbe2
| „Weiß“, für Nicht-Artikel-Seiten, neutral
| class="hintergrundfarbe2" style="text-align:center;" | #FFFFFF
|-
| hintergrundfarbe3
| „Gelb“, auffällig
| class="hintergrundfarbe3" style="text-align:center;" | #FFFF40
|-
| hintergrundfarbe4
| Sehr auffällig
| class="hintergrundfarbe4" style="text-align:center;" | #FFAA00
|-
| hintergrundfarbe5
| Neutral, abgesetzt
| class="hintergrundfarbe5" style="text-align:center;" | #E0E0E0
|-
| hintergrundfarbe6
| rowspan="4" | <div style="margin:0 2em 0 2em">Allgemein „bunt“, für Hervorhebungen und Unterscheidungen</div>
| class="hintergrundfarbe6" style="text-align:center;" | #B3B7FF
|-
| hintergrundfarbe7
| class="hintergrundfarbe7" style="text-align:center;" | #FFCBCB
|-
| hintergrundfarbe8
| class="hintergrundfarbe8" style="text-align:center;" | #FFEBAD
|-
| hintergrundfarbe9
| class="hintergrundfarbe9" style="text-align:center;" | #B9FFC5
|}

{| class="wikitable" style="text-align:center"
|- class="hintergrundfarbe6"
! rowspan="2" | Anwendungsbereich
!colspan="4"| Farbe je nach [[Hilfe:Skin|Skin]]
|- class="hintergrundfarbe6"
! vector
! monobook
! modern
! cologneblue
|-
| align="left" | Inhaltsverzeichnis
|style="background-color:#F9F9F9"| #F9F9F9
|style="background-color:#F9F9F9"| #F9F9F9
|style="background-color:#F0F0F0"| #F0F0F0
|style="background-color:#F7F8FF"| #F7F8FF
|-
| align="left" | Artikelseiten
|style="background-color:#FFFFFF"| #FFFFFF
|style="background-color:#FFFFFF"| #FFFFFF
|style="background-color:#FFFFFF"| #FFFFFF
|style="background-color:#FFFFFF"| #FFFFFF
|-
| align="left" | Diskussions- und Projektseiten
|style="background-color:#FFFFFF"| #FFFFFF
|style="background-color:#F3F3FF"| #F3F3FF
|style="background-color:#FFFFFF"| #FFFFFF
|style="background-color:#FFFFEC"| #FFFFEC
|}

=== Rahmenfarben ===
Anwendung beispielsweise: <code><nowiki> </nowiki></code>Text<code><nowiki></nowiki></code>

{| class="wikitable"
|- class="hintergrundfarbe6"
! Klassenname
! Kurzbeschreibung
! Farbe
|-
| rahmenfarbe1
| Wie Inhaltsverzeichnis
| style="text-align:center;" | #AAAAAA
|-
| rahmenfarbe2
| Unauffällig, geringer Kontrast
| style="text-align:center;" | #E9E9E9
|-
| rahmenfarbe3
| „Rot“, auffällig
| style="text-align:center;" | #C00000
|-
| rahmenfarbe4
| Neutrale Farbe, deutlich
| style="text-align:center;" | #8888AA
|-
| rahmenfarbe5
| „Schwarz“, hoher Kontrast
| style="text-align:center;" | #000000
|}

== Farbcodes ==

Ausführliche Farbtabellen findest du im Artikel [[Webfarbe]] (die Abschnitte dort müssen mit der Maus aufgeklappt werden). Im Web lassen sich zahlreiche weitere Farbtabellen und [[Farbwähler]] finden. Verwende in der Wikipedia möglichst nicht die englischsprachigen Farbnamen sondern die hexadezimalen Farbcodes (zum Beispiel <code>#FF000</code> oder <code>#F00</code>) per [[Kopieren und Einfügen]]. Obwohl viele Farbnamen standardisiert sind, können sie unter Umständen verschieden angezeigt werden. So zeigt [[X11]] einige Farben heller als [[Cascading Style Sheets|CSS]].

{| class="wikitable"
! Farbname
! colspan="2" | [[Cascading Style Sheets|CSS]] 
! colspan="2" | [[X Window System|X11]]
|-
| <code>gray</code>/<code>grey</code>
| {{Coltit|808080}} || <code>#808080</code>
| {{Coltit|BEBEBE}} || <code>#BEBEBE</code>
|-
| <code>green</code>
| {{Coltit|008000}} || <code>#008000</code>
| {{Coltit|0F0}} || <code>#00FF00</code>
|-
| <code>maroon</code>
| {{Coltit|800000}} || <code>#800000</code>
| {{Coltit|B03060}} || <code>#B03060</code>
|-
| <code>purple</code>
| {{Coltit|800080}} || <code>#800080</code>
| {{Coltit|A020F0}} || <code>#A020F0</code>
|}

Farbnamen mit Nummern am Ende sind im Web nicht standardisiert. Diese sogenannten X11-Farben werden in der Regel nur von Webbrowsern unter [[Linux]]/[[Unix]] verstanden. Sie sollten in der Wikipedia nicht verwendet werden.

== Weblinks ==
* [http://de.selfhtml.org/helferlein/farben.htm SelfHTML-Farbhelfer]
* [http://www.farb-tabelle.de/de/farbtabelle.htm Eine Farbtabelle sortiert nach Schattierungen]
* [http://colorschemedesigner.com/ Zusammenpassende Farb-Schemata] – sehr nützlich zur Auswahl passender Schattierungen
* [http://farbfinder.smartbytes.de/ FarbFinder] Ein JavaScript-Programm zum direkten Einfärben einer HTML-Seite. Die Tabellen sind der natürlichen Wahrnehmung entsprechend dreidimensional sortiert.
* [http://web.archive.org/web/20080624023532/http://html.rahty.de/farbtabelle.html HTML Farbtabelle] Eine Auflistung von allen bekannten HTML Farbnamen mit Farb-Beispiel (RGB, Hex-Code, Farbname).

{{Farbdarstellung}}

[[Kategorie:Hilfe:Formatieren|Farben]]

Hilfe:Farbverwendung - Versionsgeschichte

RalfRoletschek: 1 Version: Hilfe:Farben