Mitglieder

Benutzer:Clara Landler/Baustelle: Unterschied zwischen den Versionen

Benutzerseite Diskussion

Benutzer:Clara Landler/Baustelle (Quelltext anzeigen)

Version vom 18. August 2022, 19:44 Uhr

19.859 Bytes hinzugefügt ,  vor 1 Jahr
→‎Verwendung von Farben
(Die Seite wurde neu angelegt: „test“)
 
 
(32 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
test
 
 
= Schriftarten =
Wikimedia verwendet zwei Haupt-Schriftarten: Montserrat and Source Serif Pro. Beide Schriften sind frei und als Open Source verfügbar ("Open Font License").
* Die Standard-Schriftart für Fließtexte ist [https://fonts.google.com/specimen/Source+Serif+Pro Source Serif Pro (Download)].
* Die Schriftart für Wikimedia-Wortmarken, Überschriften und Dokument-Titel ist [https://fonts.google.com/specimen/Montserrat Montserrat (Download)].
 
 
 
= Logos =
(siehe [[:de:commons:Category:Wikimedia Österreich logos|Wikimedia Österreich Logos auf Commons]], dort auch als PNGs verfügbar)<br>
 
 
<gallery class="center" caption="Wikimedia Österreich Logos im .svg Format">
Wikimedia Österreich logo 4c.svg|'''Wikimedia Österreich normal''' (Standard)
Wikimedia Österreich logo b 4c.svg|'''Wikimedia Österreich vertikal'''
Wikimedia Österreich logo white.svg|'''Wikimedia Österreich weiß''' (für besondere Hintergründe)
Wikimedia Österreich logo black.svg|'''Wikimedia Österreich schwarz''' (für besondere Hintergründe)
Wikimedia Österreich logo b black.svg|'''Wikimedia Österreich schwarz vertikal''' (für besondere Hintergründe)
</gallery>
 
 
= Farben =
Die Wikimedia-Farben bestehen aus drei verschiedenen Farbpaletten: Die Kernpalette ("Core-Palette"), die Ursprungspalette ("Legacy-Palette") und die Kreativpalette ("Creative-Palette"). Die jewiligen Farbcodes finden sich unterhalb. 
 
== Verwendung von Farben ==
<br>
<b>Farbkombinationen</b>
<br>
Um einen ausreichend guten Kontrast zu erzielen empfiehlt sich die "Legacy-Palette" und die "Creative-Palette" mit schwarzem oder weißem Text zu kombinieren. Alle Farben mit Ausnahme von Violett, Blau, Grün und Dunkelgrün sind mit schwarzem Text kompatibel. Die übrigen Farben sollten mit Weiß kombiniert werden, um kontrastreich genug zu sein.
<br><br>
<b>Farbkombination-"Don'ts"</b>
<br>
Im Sinne der Barrierefreiheit wird empfohlen, auf eine <i>gemeinsame Verwendung der kräftigen und hellen Farbtöne der Kreativpalette</i> für Hintergrund und Text zu vermeiden, da der Kontrast nicht ausreichend ist.
 
== Kernpalette ("Core-Palette") ==
Die Kernpalette besteht aus Weiß und Schwarz sowie drei Schwarzschattierungen: Schwarz 75, Schwarz 50 und Schwarz 25. Schwarz und Weiß sind unsere Hauptfarben, die gut mit den Farben der Ursprungspalette und der Kreativpalette harmonieren.
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#FFFFFF; width:170px; height:150px;">
</div>
<div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;FFFFFF<br>
R255, G255, B255<br>
C0, M0, Y0, K0<br>
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#000000; width:170px; height:150px;">
</div>
<div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;000000<br>
R0, G0, B0<br>
C0, M0, Y0, K100<br>
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#404040; width:170px; height:150px;">
</div>
<div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;404040<br>
R64, G64, B64<br>
C0, M0, Y0, K75<br>
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#7F7F7F; width:170px; height:150px;">
</div>
<div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;7F7F7F<br>
R127, G127, B127<br>
C0, M0, Y0, K50<br>
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#BFBFBF; width:170px; height:150px;">
</div>
<div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;BFBFBF<br>
R191, G191, B191<br>
C0, M0, Y0, K25<br>
</div></div>
<br clear="all" /> 
 
 
 
== Ursprungspalette ("Legacy-Palette") ==
Die Ursprungspalette besteht aus den drei bereits ursprünglich eng mit der Wikimedia-Bewegung verbundenen Farben: Grün, Blau und Rot. Sie können z.B. als Hintergrundfarben, Titel- oder Überschriftenfarben oder Branding-Farbtöne verwendet werden. In Kombimation mit Weiß gibt es auch eine für Barrierefreiheit optimierte Version der Farben mit Konformitätsstufe AAA-geprüftem Kontrast (s. zweite Farb-Zeile).
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#396; width:170px; height:150px;">
</div>
<div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;396<br>
R51, G153, B102<br>
C67, M0, Y33, K40<br>
PMS 347U<br><br>
 
<b>AAA-geprüft:</b>
</div>
<div style="background:#246342; width:170px; height:75px;">
</div>
<div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;246342<br>
R36, G99, B66<br>
C64, M0, Y33, K61
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#0063bf; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;0063BF<br>
R0, G99, B191<br>
C89, M63, Y0, K0<br>
PMS 2388U<br><br>
 
<b>AAA-geprüft:</b>
</div>
<div style="background:#0C57A8; width:170px; height:75px;">
</div>
<div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;0C57A8<br>
R12, G87, B168<br>
C93, M48, Y0, K0
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#900; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;900<br>
R153, G0, B0<br>
C24, M100, Y100, K25<br>
PMS 2350U<br><br>
 
<b>AAA-geprüft:</b>
</div>
<div style="background:#970302; width:170px; height:75px;">
</div>
<div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;970302<br>
R151, G03, B02<br>
C0, M98, Y99, K41
</div></div>
<br clear="all" /> 
 
<small>Hinweis: Der grüne CMYK-Farbwert ist inkonsistent bei Adobe-Anwendungen. Verwende den grünen Hex-Wert und setze dein Dokument im CMYK-Farbmodus auf.</small>
 
== Kreativpalette ("Creative-Palette") ==
Die 11 Farben der Kreativpalette leiten sich aus Farbgebungen ab, die von Wiki-Communities auf der ganzen Welt häufig verwendet werden und wurden mit den [https://meta.wikimedia.org/wiki/Wikipedia_20/Resources Wikipedia20]-Geburtstagsfarben ergänzt. Diese Farbpalette ergänzt die Ursprungs- und Kernpalette um bei Bedarf mehr Flexibilität in Gestaltungsmöglichkeiten zu bieten. Die Farben Rot, Blau und Grün der Kreativpalette unterscheiden sich leicht von jenen der Ursprungspalette, da sie für die Barrierefreiheit Konformitätsstufe AA angepasst sind.
 
=== Dunkle Farben ===
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#970302; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;970302<br>
R151, G03, B02<br>
C0, M98, Y99, K41
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#E679A6; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;E679A6<br>
R230, G121, B166<br>
C0, M47, Y28, K10
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#EE8019; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;EE8019<br>
R238, G128, B25<br>
C0, M46, Y89, K07
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#F0BC00; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;F0BC00<br>
R240, G188, B0<br>
C0, M22, Y100, K06
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#5748B5; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;5748B5<br>
R87, G72, B181<br>
C52, M60, Y0, K29
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#305D70; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;305D70<br>
R48, G93, B112<br>
C57, M17, Y0, K56
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#0E65C0; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;0E65C0<br>
R14, G101, B192<br>
C93, M47, Y0, K25
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#049DFF; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;049DFF<br>
R04, G157, B255<br>
C98, M38, Y0, K0
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#E9E7C4; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;E9E7C4<br>
R233, G231, B196<br>
C0, M01, Y16, K09
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#308557; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;308557<br>
R48, G133, B87<br>
C64, M0, Y35, K48
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#71D1B3; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;71D1B3<br>
R113, G209, B179<br>
C46, M0, Y14, K18
</div></div>
<br clear="all" />
 
 
=== Helle Farben ===
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#E5C0C0; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;E5C0C0<br>
R229, G192, B192<br>
C0, M16, Y16, K10
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#F9DDE9; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;F9DDE9<br>
R249, G221, B233<br>
C0, M11, Y06, K02
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#FBDFC5; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;FBDFC5<br>
R251, G223, B197<br>
C0, M11, Y22, K02
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#FBEEBF; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;FBEEBF<br>
R251, G238, B191<br>
C0, M05, Y24, K02
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#D5D1EC; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;D5D1EC<br>
R213, G209, B07<br>
C10, M11, Y0, K07
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#CBD6DB; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;CBD6DB<br>
R203, G214, B219<br>
C07, M02, Y0, K14
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#C3D8EF; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;C3D8EF<br>
R251, G223, B197<br>
C0, M11, Y22, K02
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#C0E6FF; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;C0E6FF<br>
R192, G230, B255<br>
C25, M10, Y0, K0
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#F9F9F0; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;F9F9F0<br>
R249, G249, B240<br>
C0, M0, Y04, K02
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#CBE0D5; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;CBE0D5<br>
R203, G224, B213<br>
C09, M0, Y05, K12
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#DBF3EC; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;DBF3EC<br>
R219, G243, B236<br>
C10, M0, Y03, K05
</div></div>
<br clear="all" />
 
 
= Grafiken und Illustrationen =
 
<gallery mode="nolines" caption="Wikimedia Brand Guidelines Update 2022" showfilename>
Wikimedia Brand Guidelines Update 2022 - Activism.svg|Activism.svg
Wikimedia Brand Guidelines Update 2022 - Chemistry.svg|Chemistry.svg
Wikimedia Brand Guidelines Update 2022 - Coatlicue.svg|Coatlicue.svg
Wikimedia Brand Guidelines Update 2022 - Commons.svg|Commons.svg
Wikimedia Brand Guidelines Update 2022 - DataAnalytics.svg|DataAnalytics.svg
Wikimedia Brand Guidelines Update 2022 - Environment.svg|Environment.svg
Wikimedia Brand Guidelines Update 2022 - Fireworks.svg|Fireworks.svg
Wikimedia Brand Guidelines Update 2022 - Flamenco.svg|Flamenco.svg
Wikimedia Brand Guidelines Update 2022 - Futbol.svg|Futbol.svg
Wikimedia Brand Guidelines Update 2022 - Hamsa.svg|Hamsa.svg
Wikimedia Brand Guidelines Update 2022 - Human.svg|Human.svg
Wikimedia Brand Guidelines Update 2022 - Human2.svg|Human2.svg
Wikimedia Brand Guidelines Update 2022 - Human3.svg|Human3.svg
Wikimedia Brand Guidelines Update 2022 - KnowledgeTransfer.svg|KnowledgeTransfer.svg
Wikimedia Brand Guidelines Update 2022 - MediaWiki.svg|MediaWiki.svg
Wikimedia Brand Guidelines Update 2022 - Mobile.svg|Mobile.svg
Wikimedia Brand Guidelines Update 2022 - Mosque.svg|Mosque.svg
Wikimedia Brand Guidelines Update 2022 - Pachamama.svg|Pachamama.svg
Wikimedia Brand Guidelines Update 2022 - Painting.svg|Painting.svg
Wikimedia Brand Guidelines Update 2022 - PenAndPaper.svg|PenAndPaper.svg
Wikimedia Brand Guidelines Update 2022 - Photography.svg|Photography.svg
Wikimedia Brand Guidelines Update 2022 - PuzzleGlobe.svg|PuzzleGlobe.svg
Wikimedia Brand Guidelines Update 2022 - Smile.svg|Smile.svg
Wikimedia Brand Guidelines Update 2022 - Speak.svg|Speak.svg
Wikimedia Brand Guidelines Update 2022 - Traveler.svg|Traveler.svg
Wikimedia Brand Guidelines Update 2022 - Wikidata.svg|Wikidata.svg
Wikimedia Brand Guidelines Update 2022 - WikiIncubator.svg|WikiIncubator.svg
Wikimedia Brand Guidelines Update 2022 - WikiNews.svg|WikiNews.svg
Wikimedia Brand Guidelines Update 2022 - WikiSource.svg|WikiSource.svg
Wikimedia Brand Guidelines Update 2022 - WikiSpecies.svg|WikiSpecies.svg
Wikimedia Brand Guidelines Update 2022 - WikiVoyage.svg|WikiVoyage.svg
Wikimedia Brand Guidelines Update 2022 - Wiktionary.svg|Wiktionary.svg
Wikimedia Brand Guidelines Update 2022 -Brain.svg|Brain.svg
Wikimedia Brand Guidelines Update 2022 -Community.svg|Community.svg
Wikimedia Brand Guidelines Update 2022 -CommunityFood.svg|CommunityFood.svg
</gallery>
 
 
 
 
=Reste / Anmerkungen / Fragen=
 
==Umsortiert==
 
(Nachdem der Punkt Farben jetzt so lang ist würde ich die Punkte Schriften und Logos zwecks Übersichtlichkeit davor setzen)
 
==Logos in Galerie-Ansicht?==
 
Ich fände auch da eine Galerie Ansicht schöner – spricht da irgendetwas dagegegen?
 
 
Backup div Test:<div style="margin: 20px; width:auto; height:auto; float: left">
<div style="width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
'''Wikimedia Österreich normal''' (Standard)<br>
: [[Datei:Wikimedia Österreich logo 4c.svg|rahmenlos|hochkant=0.5|links]]
</div></div>
 
 
<div style="margin: 20px; width:auto; height:auto; float: left">
<div style="width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
'''Wikimedia Österreich vertikal'''<br>
: [[Datei:Wikimedia Österreich logo b 4c.svg|rahmenlos|hochkant=1.1|links]]
</div></div>
 
 
<div style="margin: 20px; width:auto; height:auto; float: left">
<div style="width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
'''Wikimedia Österreich weiß''' (für besondere Hintergründe)<br>
: [[Datei:Wikimedia Österreich logo white.svg|rahmenlos|hochkant=0.5|links]]
</div></div>
 
 
<div style="margin: 20px; width:auto; height:auto; float: left">
<div style="width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
'''Wikimedia Österreich schwarz''' (für besondere Hintergründe)<br>
: [[Datei:Wikimedia Österreich logo black.svg|rahmenlos|hochkant=0.5|links]]
</div></div>
 
 
<div style="margin: 20px; width:auto; height:auto; float: left">
<div style="width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
'''Wikimedia Österreich schwarz vertikal''' (für besondere Hintergründe)<br>
: [[Datei:Wikimedia Österreich logo b black.svg|rahmenlos|hochkant=1.1|links]]
</div></div>
<br clear="all" />
 
 
 
==PMS wirklich nötig?==
Ich lasse es oben bei den neuen Farben erst mal weg – ist etwas aufwändig herauszufinden..?
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#FFFFFF; width:170px; height:150px;">
</div>
<div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;FFFFFF<br>
R255, G255, B255<br>
C0, M0, Y0, K0<br>
PMS 7436C
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#000000; width:170px; height:150px;">
</div>
<div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;000000<br>
R0, G0, B0<br>
C0, M0, Y0, K100<br>
PMS 303CP
</div></div>
 
<div style="margin: 20px; border: 1px solid black; width: 170px; height:auto; float: left">
<div style="background:#404040; width:170px; height:150px;">
</div><div style="padding:10px; width: auto; margin-left: auto; margin-right: auto; line-height:1.5em">
&#35;404040<br>
R64, G64, B64<br>
C0, M0, Y0, K75<br>
PMS 433F3F
</div></div>
<br clear="all" />
Clara Landler
58

Bearbeitungen

Abgerufen von „https://mitglieder.wikimedia.at/Spezial:Mobiler_Unterschied/19780...19875“