Betrachtet man Lizenzen wie:
Wie kann ich die Ubuntu-Schriftfamilie auf jeder Website verwenden, ohne dass der Benutzer sie installieren muss?
Jede Möglichkeit, es mit Tools wie http://code.google.com/intl/en-US/apis/webfonts/ zu verwenden.
Betten Sie Ubuntu-Schriftarten in jede Webseite ein
Antworten:
Es gibt zwei Methoden, mit denen Sie die Ubuntu-Schriftart in Ihre Website einbetten können - mithilfe des Google-Schriftartverzeichnisses (bevorzugt) oder mithilfe der @font-faceCSS-Deklaration und manuellem Konvertieren Ihrer Schriftarten.
Verwendung von Google Webfonts
Sie können die Ubuntu-Schriftart jetzt als Google-Webschrift verwenden. Dies wird den Prozess viel einfacher machen. Der größte Teil des Inhalts dieses Teils der Antwort stammt aus Sladens Antwort .
Warum ist die Verwendung der Google Font-API die bevorzugte Methode?
Die Verwendung der Google Font-API ist ein hervorragender Vorschlag, da Webfonts in allen modernen Browsern automatisch ausgeführt werden können, ohne sich um Details kümmern zu müssen. Wenn Sie die Schriftart-API verwenden, wird den Besuchern immer automatisch die neueste Version der Schriftart angezeigt.
Wie kann ich die Google Font API verwenden?
Seit dem 21. Dezember 2010 ist die Ubuntu-Schriftfamilie in der Google Font API enthalten und kann dort bereitgestellt werden. Besuchen Sie:
Sie können die Google Web Font-Veröffentlichung zu den Nachrichten lesen und dann:
- Öffnen Sie das Google-Schriftartverzeichnis: " Ubuntu - Verwenden Sie diese Schriftart "
Kreuzen Sie die für Ihre Webseite erforderliche Kombination von Gewichten und Stilen aus "Normal", "Kursiv", "Fett" und "Fett-Kursiv" an.
Wenn die Standardeinstellung nicht korrekt ist, wählen Sie die gewünschte Sprach- / Skriptkombination aus: Auf einer russischen Website mit englischen Beispielen wird möglicherweise "Kyrillisch, Lateinisch" verwendet.
Fügen Sie das angegebene
<link>Tag<head> ... </head>in Ihre HTML - Seite oder Vorlagen ein und fügen Sie den entsprechenden CSS - Code zwischen den<style> ... </style>Tags in Ihre ein<head>.Wenn Sie beispielsweise die russisch / englische Hybrid-Website erstellen und die Schriftart als Standard für den gesamten Text verwenden möchten, können Sie den folgenden Code zwischen Ihre
<head>Tags einfügen :<link href='http://fonts.googleapis.com/css?family=Ubuntu&subset=cyrillic,latin' rel='stylesheet' type='text/css' /> <style type="text/css" > body { font-family : 'Ubuntu', sans-serif; } </style>
Anmerkungen :
"Latin" ist die Schrift , in der Englisch und viele andere europäische und afrikanische Sprachen geschrieben sind.
"Subsetting" optimiert die Schriftdateien, indem nur Zeichen für bestimmte Sprachen gesendet werden. Die Schriftarten sind jeweils ca. 44 kB groß. Die derzeit angezeigte Zahl von 168 KB gilt für alle mehr als 1.200 Glyphen als Download einer einzelnen Webschrift - und die meisten werden für eine einzelne Website nicht benötigt.
Die Ubuntu-Schriftdateien werden für verschiedene Browser automatisch in das richtige Format konvertiert. je nach Marke und Version das gewünschte Format ist WOFF, EOT, SVGoder TTF. Die richtige Kombination von CSS ist spezifisch für jede Seitenanforderung und löst dieses schwierige Problem auf magische Weise.
@ Font-face verwenden
Sie können die Ubuntu-Schriften einbetten, indem Sie sie in WOFF-Schriften konvertieren . Sie können sie dann mithilfe der CSS @ font-face-Deklaration einbetten. Die Schriftarten (.ttf-Dateien) finden Sie in /usr/share/fonts/truetype/ubuntu-font-family.
Verwenden Sie zum Verwenden der Ubuntu Regular-Schriftart, die in eine WOFF-Datei, Ubuntu-R.woff, konvertiert wurde, diesen CSS-Code:
@font-face
{
font-family : "Ubuntu-R";
src: url('Ubuntu-R.woff');
}
Ähnliches gilt für Ubuntu Bold:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-B.woff');
font-weight : bold;
}
Ubuntu kursiv:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-I.woff');
font-style : italic;
}
Ubuntu Fett Kursiv:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-BI.woff');
font-weight : bold;
font-style : italic;
}
Dies wird von allen aktuellen Browsern unterstützt .
Überlegungen
Bitte denken Sie daran, dass einige Benutzer ihre Browser so einrichten, dass sie einen bestimmten Satz von Schriftarten verwenden. Dies kann ärgerlich sein, wenn benutzerdefinierte Schriftarten verwendet werden. Lesen Sie auch die Ubuntu-Lizenz für Schriftarten, um genaue Bedingungen für die Verteilung der Schriftarten zu erhalten.
@ Dkuntz2 - das ist ja besser; Ich habe jetzt meine Antwort geändert.
—
dv3500ea
Ich habe die Notwendigkeit, die Antwort von Sladen zu kopieren, nicht verstanden. Warum nicht einfach bearbeiten?
—
Papukaija
Ich habe diese Frage lange vor sladen beantwortet und die @ font-face-Methode umrissen. Dies war vor dem Hinzufügen der Schriftart zur Google Font-API (dies ist eine bessere Methode). Ich habe zu Beginn meiner Antwort nur eine kurze Anmerkung hinzugefügt und sladen hat viel umfassender geantwortet und hatte eine bessere Antwort für die Verwendung der Google-Methode.
—
dv3500ea
Zu diesem Zeitpunkt wurde meine Antwort jedoch akzeptiert und hoch gelobt, und das Ergebnis war, dass die Leute vielleicht denken, sie sollten die @ font-face-Methode verwenden, was weniger bevorzugt ist. sladen kontaktierte mich per E-Mail, und ich erklärte mich damit einverstanden, meine Antwort zu ändern und die in der Creative-Commons-Lizenz für diese Website vorgeschriebene Zuordnung vorzunehmen.
—
dv3500ea
Die Verwendung der Google Font-API ist ein hervorragender Vorschlag, da Webfonts in allen modernen Browsern automatisch ausgeführt werden können, ohne sich um Details kümmern zu müssen. Wenn Sie die Schriftart-API verwenden, wird den Besuchern immer automatisch die neueste Version der Schriftart angezeigt.
Seit dem 21. Dezember 2010 ist die Ubuntu-Schriftfamilie in der Google Font API enthalten und kann dort bereitgestellt werden. Besuchen Sie:
Sie können die Google Web Font-Veröffentlichung zu den Nachrichten lesen und dann:
- Öffnen Sie das Google-Schriftartverzeichnis: " Ubuntu - Verwenden Sie diese Schriftart "
- Kreuzen Sie die für Ihre Webseite erforderliche Kombination von Gewichten und Stilen aus "Normal", "Kursiv", "Fett" und "Fett-Kursiv" an.
- Wenn die Standardeinstellung nicht korrekt ist, wählen Sie die gewünschte Sprach- / Skriptkombination aus: Auf einer russischen Website mit englischen Beispielen wird möglicherweise "Kyrillisch, Lateinisch" verwendet.
- Kopieren Sie die beiden CSS-Zeilen und fügen Sie sie in die Abschnitte
<head> ... </head>und<style>...</style>Ihrer HTML-Seite oder -Vorlagen ein.
Anmerkungen:
"Latin" ist die Schrift , in der Englisch und viele andere europäische und afrikanische Sprachen geschrieben sind.
"Subsetting" optimiert die Schriftdateien, indem nur Zeichen für bestimmte Sprachen gesendet werden. Die Schriftarten sind jeweils ca. 44 kB groß. Die derzeit angezeigte Zahl von 168 KB gilt für alle mehr als 1.200 Glyphen als Download einer einzelnen Webschrift - und die meisten werden für eine einzelne Website nicht benötigt.
Die Ubuntu-Schriftdateien werden für verschiedene Browser automatisch in das richtige Format konvertiert. je nach Marke und Version das gewünschte Format ist WOFF, EOT, SVGoder TTF. Die richtige Kombination von CSS ist spezifisch für jede Seitenanforderung und löst dieses schwierige Problem auf magische Weise.
Das serverseitige Rendern von Schriftarten (vielleicht besser "dynamisches Rendern von Schriftarten") ist seit geraumer Zeit ein interessantes Thema.
Technisch gesehen erscheint es logisch, dass ein Computer, der eine bestimmte Schriftart anzeigen möchte, bereits lokal installiert sein muss.
Auf der anderen Seite verliert das Webdesign viel, weil es sich an die grundlegenden / bekannten 'Web-Schriften' halten muss.
CSS2.1 haben einige Verbesserungen durch die Verwendung gemacht @ font-face - Regel Erklärung.
Es ist noch kein Standard, aber es wird irgendwann mit CSS3.
Daneben gab es einige alternative Methoden, wie zum Beispiel:
Ich hoffe, die angegebenen Links geben Ihnen eine bessere Vorstellung davon, was getan werden kann ;-)