Websichere Fonts versus Google-Web-Fonts

[maginon]

Hallo Zusammen,
kann mir bitte mal jemand erklären, was der Unterschied zwischen websicheren Fonts und Google-Web-Fonts ist?
Ich bin hier jetzt schon 2 h am Suchen im Netz und es wird immer widersprüchlicher.

Ich weiß, dass es websichere Fonts gibt. Da die i.d.R. sehr eingeschränkt sind, habe ich gesehen, dass es auch noch Google-Web-Fonts gibt. Ich habe gelesen, dass bei denen der Font von Google geladen wird und nicht direkt in der Website eingebunden sein muss usw. usf.
ABER: Sind diese Google-Fonts automatisch auch websicher, also auf allen Endgeräten problemlos darstellbar?? Dazu habe ich nichts gefunden und wollte das nicht gleichsetzen ohne es wirklich zu wissen. Oder versteht sich das von selbst?
Da Font-Profis immer davon reden, dass es an wirklich websicheren Fonts vielleicht 7 - 9 Schriften gibt, Google wohl aber über 800 selbst entwickelt hat, kann doch da was nicht stimmen.
Und um die Verwirrung komplett zu machen: Ähnliches gilt natürlich für Microsoft. Da gibt es doch auch deren eigene Schriften, oder? Wie verhalten die sich?

Weiß jemand Rat und kann dazu kurz was sagen?
Das wäre super und würde mir sehr helfen!! Ganz lieben Dank im Voraus!!
maginon

 

[Gelöschtes Mitglied 633957]

kurz was sagen?

In aller Kürze: Als websicher gilt ein Font der mit jedem verbreitet genutzem Betriebssystem auf dem Endgerät des Benutzers installiert wird, bzw. dessen aufgerufener Name mit einem installierten Font assoziiert wird. Und das sind tatsächlich nur ein paar. Ein Font der nicht auf dem Gerät des Besuchers installiert ist, kann auch auf einer Website nicht dargestellt werden.
Es gibt mehrere Möglichkeiten Fonts auf einer Website zu verwenden, die auch "sicher" sind, nur lediglich nicht mit dem Schlagwort "websicher" umschrieben werden.

Die Sicherheit kann z.B. durch die Nutzung von Fallbacks in einer CSS Anweisung hergestellt werden.

html {
    font-family: 'Mein Verrueckter Font', 'Den kennt auch keiner', Verdana, Helvetica, Arial, sans-serif;
}

Kann Font 1 nicht gefunden werden, wird Font 2 genutzt. Kann dieser nicht gefunden werden, Font 3, usw.

Bei der Nutzung von Google-Fonts, werden diese direkt über das Internet eingebunden. Z.B. via import:

@import url('https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,700,700i');
html {
    font-family: 'Roboto', Arial, sans-serif;
}

Diese Schriften müssen dann nicht auf dem Gerät des Besuchers installiert sein. Eine Auswahl an Schiftstärken und -stilen kann direkt mit eingebunden werden, sofern von der gewählten Schrift unterstützt. (i steht für kursiv und die Stärke geht von 100 bis 900; wobei i.d.R. 400 die Standardstärke ist und ansonsten die ungeraden Hunderterzahlen genutzt werden. Falls es einmal keine Verbindung zu dem Google-Server geben sollte, ist auch hier ein Fallback sinnvoll.

Man kann auch Fonts auf den eigenen Webspace laden und diese einbinden. Die Formate otf, ttf, woff und woff2 sollten von allen gängigen Browsern verstanden werden; bei den Formaten eot und svg ist die Auswahl sehr eingeschränkt.
Beispiel:

@font-face {
    font-family: 'Meine Schrift';
       src: url('pfad/zu/meine-schrift.woff2')  format('woff2'),
            url('pfad/zu/meine-schrift.woff')  format('woff'),
            url('pfad/zu/meine-schrift.ttf')  format('truetype');
}
html {
    font-family: 'Meine Schrift', Verdana, Helvetica, Arial, sans-serif;
}

Innerhalb von font-face ließe sich auch noch font-weight und font-style definieren, liegt die Schriftart in den entsprechenden Varianten vor. Auch hier können Fallbacks genutzt werden, sowohl bei den Formaten als auch bei den Schriften für die definierten HTML Elemente.

Hoffentlich konnte das etwas Klarheit schaffen, auch wenn ich im Grunde nur das bestätige, was Du bereits selber herausgefunden hast.

 

[maginon]

WOW!
DANKE!
Das nenne ich mal eine umfassende, geduldige und weitführende Antwort! Keineswegs "kurz". (Die Intention war nur, niemandem die Zeit rauben zu wollen.)
Du hast mir sehr geholfen und diese Zusammenhänge bringen echt Klarheit.

Nun, mit den Google-Fonts ist das ja wegen der DSGVO so eine Sache. Da habe ich herausgefunden, dass, wenn die Schriften dann von Google bereitgestellt werden, der Zugriff auf die Seite und dadurch auch auf die Daten damit verbunden ist. D. h. doch, man könnte Probleme bekommen, wenn man z. B. einen Web-Shop hat oder auch schon ein einfaches Kontaktformular. Da wäre jetzt die Frage, ob durch die Einbindung der Fonts der Zugriff von Google automatisch verhindert werden kann?

... Und die Codes finde ich äußerst interessant. Danke auch dafür. Nur bin ich leider kein Webdesigner und meine erste dumme Frage wäre, wo, an welcher Stelle diese Codes im HTML überhaupt stehen müssen? Immer, bevor der Text beginnt? Und wo müssen die Schriften liegen, damit die Programmierung darauf zurückgreifen kann beim Export der Seite?
Also sorry. Diese Fragen brauchst Du nicht unbedingt zu beantworten. Da ich wirklich nur ganz rudimentäres Anfängerwissen habe, sind Deine Erklärungen wahrscheinlich eh für die Katz. Und ich will Dich damit nicht kirre machen, dass Du noch ausrastest ;-)))). Das würde zu weit führen, da ich so gut wie nix darüber weiß. Obwohl ich es sehr interessant finde und mich noch weiter damit beschäftigen werde.

Danke für Deine Antwort und viele Grüße!
maginon

 

[Gelöschtes Mitglied 633957]

Nun, mit den Google-Fonts ist das ja wegen der DSGVO so eine Sache.

Da kann ich leider nicht weiterhelfen; zu wenig Ahnung.

wo, an welcher Stelle diese Codes im HTML überhaupt stehen müssen?

Am einfachsten in einer externen CSS Datei, die dann im HTML oder PHP Dokument verlinkt wird.
http://de.html.net/tutorials/css/lesson2.php
https://www.mediaevent.de/css/css-einbinden.html

 

[pixelmaker]

Nun, mit den Google-Fonts ist das ja wegen der DSGVO so eine Sache.

Datenschutzbeauftragter Info sagt aus…
https://www.datenschutzbeauftragter-info.de/wie-google-fonts-dsgvo-konform-werden/

2. JANUAR 2019. Bis zu einer gerichtlichen Entscheidung oder einer Stellungnahme der Aufsichtsbehörden ist der „Online“-Modus von Google Fonts jedoch mit einem gewissen datenschutzrechtlichen Risiko verbunden.

Weil einfach immer noch niemand etwas genaues weiß und sich auch kein Politiker darum schert Klarheit zu schaffen. Die ohnehin überlasteten Gerichte machen das schon…

Dabei geht es in dem Artikel um die Frage ob denn die Übermittlung der Besucher-IP aus "berechtigtem Interesse" (Art. 6 Abs. 1 lit. f) DSGVO) stattfinden darf.
So lange es in Fachbeiträgen wie diesem keine Antwort gibt ist man auf wackeligem Fuß und muß selbst abwägen ob man Google Fonts in der Online-Version verwendet.
Hier ist ein Beitrag der erklärt wie man Google Fonts lokal einbindet.
Das ist relativ einfach und ich sehe die Aussagen von google in den Developer FAQ als


grüße
++ralfg

 

[maginon]

Vielen, vielen Dank an euch beide für diese umfassenden Aussagen! Das wird mein Wochenend-Programm, mir das alles zu Gemüte zu führen!
Liebe Grüße!!
maginon