Hallo Matthias, guten Morgen (jetzt ist schon Tag) zurück!
Hallo Holger (jetzt ist schon wieder dunkel)
Hier hat Gunnar erklärt, was lokal ist: Dein Rechner!
Ja, das ist mir klar (schon lange 😉).
Gut! 😀
Es ist vielleicht noch zu beachten, dass ich nicht unter Windows, sondern unter Linux (openSUSE Tumbleweed) arbeite; das bringt manches von zu Hause aus mit, was unter Windows erst nachinstalliert werden muss. Was aber nicht heißt, dass ich der "Coder" oder völlige Duchblicker bin. Ich nutze Linux "nur".
Anscheinend ist doch nich alles klar! 😉
Das Betriebssytem an sich hat nichts mit Webseiten und den Browsern zu tun!
Schriften kannst du nicht lokal testen - das verbieten die Browser!
Deshalb benötigst Du einen Webserver!
Praktisch gehe ich so vor:
Eingabe in der Adresszeile des Browsers (bei mir der neueste "Firefox" oder dessen Fork "Libre Wolf") folgendermassen:
file:///Pfad/wo/die/Homepage-Dateien/liegen/
So sehe ich eins zu eins, an was ich arbeite und wie sich Änderungen auswirken.
Aber eben nicht bei Schriften!
- In diesem Abschnitt wird erklärt, warum man irgendwann nicht mehr lokal testen kann: Fallstrick Same-Origin-Policy
- Sollte dieser Abschnitt weiter oben stehen, als Warnung in einer Box erscheinen?
Hm, "erklärt" ist für mich jetzt etwas zu viel gesagt. Es ist ein Hinweis, mit einigen Erläuterungen (die ich im Groben auch nachvollziehen kann), ohne mir jetzt aber für die Praxis den Schubser zu geben, wie ich weiter vorzugehen habe.
Könntest du den neugefassten Abschnitt noch mal gegenlesen?
Ich hoffe, dass das jetzt klarer formuliert ist!
Warum also überhaupt lokal installieren?
Da muss ich mich schlau machen, Das MDN sagt zu src: local():
Web fonts are subject to the same domain restriction (font files must be on the same domain as the page using them), unless HTTP access controls are used to relax this restriction. Übersetzung (über deepl.com): "Für Web-Schriftarten gilt dieselbe Beschränkung (Schriftdateien müssen sich in derselben Domäne befinden wie die Seite, die sie verwendet), es sei denn, diese Beschränkung wird durch HTTP-Zugriffskontrollen aufgehoben."
Das war vorher im Text nicht falsch, aber das wichtige fehlte. Ist es jetzt besser/ verständlicher?
Fazit: lokal + font = geht nicht!
Google-Fonts
Problematisch war eben das Abgreifen der Daten der Nutzer. Das geht heute immer noch, benötigt heute aber ein Einverständnis der Nutzer, das du vor dem Benutzen der Seite abfragst.
Ja, aber wer schaut sich die Klauseln schon an (sind ja auch extra lang verfasst oder kontrolliert die Firmen, die meinen "essentielle" Daten abgreifen zu müssen?! Meist nur so Leute wie ich; wobei ich es meide, wo möglich, solche Seiten überhaupt zu besuchen.
Das war für Anwälte halt eine Gelegenheit mit einem Bot Firmenwebseiten auf fremde (kostenpflichtige) Schriften zu durchsuchen und dann Abmahnungen zu erstellen. Besonders schlimm wurde es, als auch Einbindungen von Google-Fonts als "Weitergabe von Nutzerdaten" angesehen wurden und die Anwälte von einem Gericht auch noch Recht bekamen. Anwälte handeln da angeblich im Auftrag eines Mitbewerbers, ob das Fehlen eines solchen bei gemeinnützigen Vereinen euch vor juristischem Ärger bewahrt, weiß man nicht.
Schöner geht es, wenn Du die Schriftdateien selbst im woff2-Format hostest und auslieferst. Dann werden keine Daten erhoben.
Ja, genau das möchte ich nun noch umsetzen. 😁
Gleich mal schauen, ob ich das kapiere ...
Gib eine Rückmeldung, ob der Text verständlich ist!
P.s. Was für Validatoren nutzt Ihr denn? Auf obigem Link (vom selfhtml-Wiki) finde ich folgende:
A) HTML-Validatoren:
- validator.w3.org, DTD-basiert https://validator.w3.org/
- https://validator.w3.org/nu/, nicht DTD-basiert, beruht auf dem "validator.nu" https://validator.w3.org/nu/
- validator.nu https://validator.w3.org/nu/
B) CSS-Validatoren:
- W3C Developer Tools http://w3c.github.io/developers/tools/ → Bei dem kapiere ich was nicht (öffnet sich nur in Github oder der (Linux-)Konsole / Terminal?)
- CSS Validator (W3C): Der maßgebliche, vom W3-Konsortium zur Verfügung gestellte Syntax-Check für eigene Stylesheets. Überprüft wird, ob der CSS-Quelltext korrekt ist. http://jigsaw.w3.org/css-validator/
Beim normalen Validator kannst du auch HTML4 und so was checken lassen. Der nu-Validator testet automatisch auf HTML5.
Der nu-Validator checkt auch CSS-Dateien (Deine ist fehlerfrei! Super!)
Herzliche Grüße
Matthias Scharwies
Die Signatur findet sich auf der Rückseite des Beitrags.