FontSizes
Der folgende Inhalt stammt von Rino de Boer und seiner Homepage.
Er hat diese Empfehlung entwickelt und auf seinem YouTube channel und seiner Webseite LivingwithPixels veröffentlicht.
Thank you very much for your work Rino.
Wenn Sie nicht wissen, welche Schriftgrößen 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 Website-Einstellungen. Denn das ist nicht gut für die Suchmaschinenoptimierung und begrenzt die Überschriften auf maximal 6.
Passen Sie die Größen 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
