fontsize

Fontsize

15. August 2024

Fontsize

Der folgende Inhalt stammt von Rino de Boer aus seiner Homepage.
Er hat diese Empfehlung für Fontsize entwickelt und auf seinem Youtube Channel und seiner Webseite LivingwithPixels veröffentlicht.
Thank you very much for this work Rino.

Wenn Sie nicht wissen, welche Fontsize / Schriftgröße Sie auf Ihrer Website verwenden sollten, dann kann
diese Ressource wertvoll sein. Die Schriftgrößen für die Titel sind von Desktop zu Mobile
skalierbar. Das bedeutet, dass Sie keine Größen für den Tablet-Modus einstellen müssen.Alle
Werte sind in REM, weil das besser für die Zugänglichkeit ist. Sie sollten sie in der Sektion Global
Fonts in Elementor einrichten. Der Klammertext sollte in die Option für benutzerdefinierte
Einheiten innerhalb von Elementor gesetzt werden.
Setzen Sie diese Größen nicht in die H1 – H6 im Abschnitt Typografie in den WebsiteEinstellungen. Denn das ist nicht gut für die Suchmaschinenoptimierung und begrenzt die Überschriften auf maximal 6.

Passen Sie die Fontsize  mit dem Clemprechner an (Mindestwert: 360px, Höchstwert: 1140px)

Title 1 (64 on desktop to 48 on mobile)
clamp(3rem, 2.5385rem + 2.0513vw, 4rem)

Title 2 (48 to 38,4)
clamp(2.4rem, 2.1231rem + 1.2308vw, 3rem)

Title 3 (40 to 33,6)
clamp(2.1rem, 1.9154rem + 0.8205vw, 2.5rem)

Title 4 (32 to 28,8)
clamp(1.8rem, 1.7077rem + 0.4103vw, 2rem)

Title 5 (28 to 25,6)
clamp(1.6rem, 1.5308rem + 0.3077vw, 1.75rem)

Title 6 (24 to 22,4)
clamp(1.4rem, 1.3538rem + 0.2051vw, 1.5rem)

Title 7 (20 to 19.2)
clamp(1.2rem, 1.1769rem + 0.1026vw, 1.25rem)

Subheading (19,2)
1,2

Body (16)
1

Body bold (16)
1

Body big (18)
1,125

Body small (14)
0,875

 

Weitere Tipps und Resourcen für Webdesign findet Ihr zukünftig auf meine Homepage

Ältere berichte von dieser Reise: