Google Fonts lokal einbinden
Veröffentlichungsdatum: 02. Juli 2018
Änderungsdatum: 08. August 2023
Projektgrundlage: BASE
Werden Google Fonts über die Google Font API eingebunden, muss der Besucher damit rechnen, dass er Daten an Google sendet, sofern er die Schriftart nicht bereits im Cache hat. Aus Datenschutzssicht ist es also empfehlenswert Schriften nicht über den Google Server zu beziehen, sondern diese lokal abzulegen.
Über Google Fonts direkt oder auf Github können Sie sich alle Google Fonts komplett herunterladen, um dann die benötigten Schriftarten in Ihr Projekt (/IhrGlobalesProjekt/wGlobal/layout/webfonts) zu spielen. Die benötigten Schriftdateien befinden sich nach Lizenztyp gruppiert in Unterordnern.
Eingebunden werden die benötigten Schriftdateien dann z.B. in der fonts.scss, wo sie auch gleich zugewiesen werden können.
Einbinden einer Schriftart in der fonts.scss
/* Schriftarten */ @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; src: local('Open-Sans'), local('Open-Sans'), url(#{$wGlobalProjectPath}/wGlobal/layout/webfonts/opensans/OpenSans-Regular.ttf) format('truetype'); } /* Zuweisen der Open Sans Schriftart als Standard-Schriftart: $fontFamilyDefault:Open Sans, Helvetica, Arial, Sans-serif; /* Standardschriftart */