Übersichtseite

Schriftgrössen

Wichtig: Alle Angaben beziehen sich immer auf die Versalhöhe, nicht die Kegelhöhe.

Desktop:

H1 gross (bei kurzen Schriftnamen): 274 px
H1 klein (bei langen Schriftnamen): 145 px

Der Schriftname darf bei Bedarf auch zweizeilig sein, falls er aus mehreren Worten besteht,

Zwischentitel:
H2: 44 px

Lauftext:
H3: 20 px

Mobile Portrait:

H1: 61px
H2: 24px
H3: 13px

Mindestabstand Schrift zum oberen Rand bei Mobile Portrait:
125px

Auf Mobile wird Landscape analog zum Desktop übernommen, hierzu definieren wir also keine neuen Grössen.

Schriftschnitte

Schriftschnitte dürfen frei kombiniert werden.

---

Font schwarz oder weiss
SVGs ohne Hintergrund > HG Farbe & Hover im font.css definieren
Hoverfarbe frei wählbar
Fontsize überprüfen > nach Angaben oben

---

einzelne Personen:
@Natscha: Hintergrund aus SVG löschen > im CSS definieren, Hover im CSS definieren, Font nur schwarz oder weiss
@matthias Koch: Hintergrund aus SVG löschen > im CSS definieren, Hover im CSS definieren, Landscape Abstand zu Name (oben) vergrössern
@nils.maeder: Font (Name) schwarz oder weiss
@Tioe: Font (Name) schwarz wegen Kontrast
@Steffi: PX anpassen
@larsmaeder: Sonderzeichen entfernen, Hover verstärken
@marc.hatt: Name nicht mehr lesbar auf Verlauf > Schwarz oder weiss
@marius.becker: Hintergrund aus SVG löschen > im CSS definieren, Hover im CSS definieren
Nachrichteneingabe

[niciwatri]

Hallo Gruppe von der Übersichtsseite. Ich habe die Pixelhöhe meines Textes angepasst. Beim Mobile Porträt habt ihr aber kein H1 für die Langen Schriftnamen definiert. Könnt ihr das bitte noch machen? 61px ist zu gross für mich...

Anspassung H1 Mobile in klein

Mobile Portrait:

H1 gross: 61px (wie gehabt)
H1 klein: 43px

[matthiasmeierkoch]

Ab wie vielen Buchstaben ist ein Name der Schrift «Lang»?
btw: Achtet doch darauf dass ihr die richtigen Personen mit dem richtigen Benutzernamen markiert, ansonsten bekommen wir keine Benachrichtigung.

[pascaleva]

@matthiasmeierkoch «lang» wäre ca. mehr als 8 Buchstaben. Getestet haben wir es mit der längsten Schrift, der Cooper Hewitt und der Rambla für den Schriftnamen in «kurz». Theoretisch lassen wir offen, welche H1 du wählst, schränken dies aber auf zwei Grössen ein. Wenn du es aber im Layout testest siehst du schnell welche Grösse auf dem Format mehr Sinn macht. Ich denke mit der Roboto kannst du gut die grosse H1 verwenden. Ist das so für dich okay?