Versionen dieses Beitrags

Wiki: SELF-Farben und Wiki-Layout

Avatar 1 Matthias Scharwies
  • Wiki: SELF-Farben und Wiki-Layout
  • Servus!
  • So, ich habe die Vorlage:Info und die Vorlage:Autorbox jetzt mit dunklem blaugrau und höherem Kontrast angepasst:
  • * [Hilfe:SELFHTML-Boxen](https://wiki.selfhtml.org/wiki/Hilfe:SELFHTML-Boxen#Info-Boxen)
  • #Jetzt kommt die nächste Baustelle:
  • * [unterschiedliche Linkfarben](https://wiki-test.selfhtml.org/wiki/Hilfe:SELFHTML-Farbtabelle#unterschiedliche Linkfarben)
  • Für reinen Text hat das SELF-blau (`#3983ab`) einen zu geringen Kontrast: [4.19:1](https://webaim.org/resources/contrastchecker/?fcolor=3983AB&bcolor=FFFFFF). Wohl deshalb werden überall andere Blautöne als Linktext verwendet:
  • * Das im Wiki verwendete #2673bf hat [4.90:1](https://webaim.org/resources/contrastchecker/?fcolor=2673BF&bcolor=FFFFFF)
  • * im Forum und im Blog wird #3481cd mit [4.06:1](https://webaim.org/resources/contrastchecker/?fcolor=3481CD&bcolor=FFFFFF) verwendet.
  • * Das im Wiki verwendete `#2673bf` hat [4.90:1](https://webaim.org/resources/contrastchecker/?fcolor=2673BF&bcolor=FFFFFF)
  • * im Forum und im Blog wird `#3481cd` mit [4.06:1](https://webaim.org/resources/contrastchecker/?fcolor=3481CD&bcolor=FFFFFF) verwendet.
  • Der normale Text im Forum ist mit #039 noch etwas dunkler und sehr gut lesbar [10.86:1](https://webaim.org/resources/contrastchecker/?fcolor=003399&bcolor=FFFFFF).
  • Der normale Text im Forum ist mit `#039` noch etwas dunkler und sehr gut lesbar [10.86:1](https://webaim.org/resources/contrastchecker/?fcolor=003399&bcolor=FFFFFF).
  • Deshalb würde ich gerne oberhalb vom SELF-blau mit #3983ab (hsl(201, 50%, 45%)) ein dunkelblau mit evtl. `hsl(201, 50%, 35%)` [6.18:1](https://webaim.org/resources/contrastchecker/?fcolor=2D6786&bcolor=FFFFFF) einführen wollen.
  • Deshalb würde ich gerne oberhalb vom SELF-blau mit `#3983ab` (hsl(201, 50%, 45%)) ein dunkelblau mit evtl. `hsl(201, 50%, 35%)` [6.18:1](https://webaim.org/resources/contrastchecker/?fcolor=2D6786&bcolor=FFFFFF) einführen wollen.
  • `a:hover` ist orange ([#df6c20 mit 3.33:1](https://webaim.org/resources/contrastchecker/?fcolor=DF6C20&bcolor=FFFFFF)) - wo kommt denn das her?
  • Erinnert Ihr Euch noch an die Wiki-Anfänge?
  • [![](/images/b807afda-932d-4c05-8bc7-3e68c0582199.png?size=medium)](/images/b807afda-932d-4c05-8bc7-3e68c0582199.png)
  • *"We've come a long way!"*
  • Herzliche Grüße
  • Matthias Scharwies
  • --
  • *"Survive or die trying!"*