detfaellesdesignsystem / dkfds-components

Styling og komponenter
Other
44 stars 13 forks source link

font-family: system-ui bør være default uden at loade IBMPlexSans font #250

Open jesperronn opened 1 month ago

jesperronn commented 1 month ago

PR #230 er blevet lukket med argumentet at der i v10 nu er et fornuftigt fallback til en custom defineret System font-family.

men, men: I dag er browser support for font-family: system-ui

jeg foreslår 2 ændringer:

1. Skift default font til at benytte system-ui i stedet for IBMPlexSans font

https://github.com/detfaellesdesignsystem/dkfds-components/blob/master/src/stylesheets/variables/_typography.scss#L19C1-L19C54

ændres således:

-$typography-font-family: 'IBM Plex Sans', 'system', sans-serif !default;
+$typography-font-family: system-ui !default;

2. ikke load eot/woff/ttf fonte som default

der er ikke behov for at have egne fonte, og offentlige løsninger kan ligeså godt spare den ekstra load tid og båndbredde (hvor man typisk loader 3-4 fonte inden siden ser "pæn" ud (pæn er vist en tilsnigelse da Designsystem jo netop er brandet ved at se kedelig og grå ud).

Den mindste rettelse rent kodemæssigt vil være at sætte variablene der laver font-reglerne til false i https://github.com/detfaellesdesignsystem/dkfds-components/blob/master/src/stylesheets/values/font/_font-weight.scss#L1C1-L9C3

$fds-font-weights: (
    "thin":         false,
    "extralight":   false,
    "light":        false,
-    "normal":       400,
+    "normal":       false,
-    "medium":       500,
+    "medium":       false,
-    "semibold":     600,
+    "semibold":     false,
-    "bold":         700
+    "bold":         false
);

baggrund og diskussion:

jeg synes browser support nu er moden til at understøtte font-family: system-ui. Derudover giver det ikke mening at loade regler for kompleks fallback load af eot/woff/ttf fonte længere. Det var fint da Designsystem startede, men nu er "brandet" at designsystem pr default er gråt og kedeligt.

Derudover ser vi mange løsninger generelt som selv vælger deres egen custom font. Derfor synes jeg det giver mening at fjerne font fra Designsystem helt. Dette kan være en fin step 1, nemlig at disable loadingen af Designsystems custom font

mere info

Læs mere om browser support og implementering:

detfaellesdesignsystem commented 1 month ago

Hej @jesperronn

Tak for din henvendelse. Et af Det Fælles Designsystems bærende præmisser er, at brugerne skal møde genkendelige selvbetjeningsløsninger på tværs af Borger og Virk. Designet er bevidst valgt ”fra” for at rette fokus mod den information eller de input vi beder brugerne om at foretage. Så det, der er gråt og kedeligt, er designmæssigt fokuseret på opgaven foran brugeren. Vi har to brandingelementer i Det Fælles Designsystem. Den ene er farven, der enten repræsenterer Borger eller Virk, den anden er typografien, som går på tværs af portaler og platforme. Den konsistens ønsker vi at bibeholde, så derfor vil vi ikke i skrivende stund skifte til system-ui, selvom det vil give en performanceforbedring.

Mvh Martin Det Fælles Designsystem