Web Typografie

Web Typografie bezieht sich auf die Verwendung von Schriftarten auf der Weltweites Netz. Wann Html wurde zuerst erstellt, Schriftflächen und Stile wurden ausschließlich durch die Einstellungen der einzelnen gesteuert Webbrowser. Es gab keinen Mechanismus für einzelne Webseiten, um die Schriftart zu steuern, bis Netscape stellte die vor Schriftart
Element im Jahr 1995, das dann in der HTML 3.2 -Spezifikation standardisiert wurde. Die durch die angegebene Schriftart jedoch Schriftart
Das Element musste auf dem Computer des Benutzers oder auf einer Fallback -Schriftart installiert werden, z. B. der Standardeinstellung eines Browsers serifenlos oder Monospace Schriftart, würde verwendet. Der Erste Cascading Style Sheets Die Spezifikation wurde 1996 veröffentlicht und bot die gleichen Fähigkeiten.
Das CSS2 Die Spezifikation wurde 1998 veröffentlicht und versuchte, den Schriftauswahlprozess zu verbessern, indem Schriftart, Synthese und Download hinzugefügt wurde. Diese Techniken wurden nicht viel verwendet und wurden in der CSS2.1 -Spezifikation entfernt. Jedoch, Internet Explorer Unterstützung für die Schriftart -Download -Funktion in der Schriftart hinzugefügt in Version 4.0, veröffentlicht 1997.[1] Das Download des Schriftartes wurde später im CSS3 -Schriftarten enthalten und wurde inzwischen in der Implementierung in der Implementierung Safari 3.1, Oper 10 und Mozilla Firefox 3.5. Dies hat anschließend das Interesse an Web -Typografie sowie die Verwendung von Schriftart heruntergeladen.
CSS1
In der ersten CSS -Spezifikation,[2] Die Autoren spezifizierten Schriftmerkmale über eine Reihe von Eigenschaften:
font-family
font-style
font-variant
font-weight
font-size
Alle Schriftarten wurden ausschließlich mit Namen identifiziert. Über die oben genannten Eigenschaften hinaus hatten Designer keine Möglichkeit, Schriftarten zu stylen, und es gab keinen Mechanismus, um Schriftarten auszuwählen, die im Client -System nicht vorhanden sind.
Web-Safe-Schriftarten
Web-Safe-Schriftarten sind Schriftarten wahrscheinlich auf einer breiten Palette von vorhanden sein Computer Systeme und verwendet von Netz Inhaltsautoren erhöhen die Wahrscheinlichkeit, dass Inhalte in der gewählten Schriftart angezeigt werden. Wenn ein Besucher einer Website nicht über die angegebene Schriftart verfügt, versucht sein Browser, eine ähnliche Alternative auszuwählen, basierend auf dem Autor-spezifizierten Fallback -Schriftarten und generische Familien oder es verwendet Schriftartsubstitution definiert im Betriebssystem des Besuchers.
Microsofts Kernschriften für das Web

Um sicherzustellen, dass alle Webbenutzer einen grundlegenden Satz von Schriftarten hatten, Microsoft begann die Kernschriften für das Web Initiative im Jahr 1996 (im Jahr 2002 beendet). Veröffentlichte Schriftarten enthalten Arial, Kurier neu, Times New Roman, Comic sans, Einfluss, Georgia, Trebuchet, Webdings und Verdana- unteran Eula Das machte sie frei verteilbar, beschränkte aber auch einige Rechte an ihrer Verwendung. Ihre hohe Penetrationsrate hat sie zu einem Grundnahrungsmittel für Webdesigner gemacht. Die meisten Linux -Verteilungen Fügen Sie diese Schriftarten standardmäßig nicht ein.
CSS2 versuchte, die für Webentwickler verfügbaren Tools zu erhöhen, indem die Schriftsynthese, eine verbesserte Schriftanpassung und die Möglichkeit, Remote -Schriftarten herunterzuladen, hinzugefügt.[3]
Einige CSS2 -Schriftarten wurden aus CSS2.1 entfernt und später in CSS3 enthalten.[4][5]
Fallback -Schriftarten
Mit der CSS -Spezifikation können mehrere Schriftarten als Fallback -Schriftarten aufgeführt werden.[6] In CSS die Schriftfamilie
Immobilien akzeptiert eine Liste der von Kommas getrennten Schriftarten wie so:
Schriftfamilie: "Nimbus sans l", Helvetica, Arial, serifenlos;
Die erste angegebene Schriftart ist die bevorzugte Schriftart. Wenn diese Schriftart nicht verfügbar ist, versucht der Webbrowser, die nächste Schriftart in der Liste zu verwenden. Wenn keine der angegebenen Schriftarten gefunden wird, zeigt der Browser seine Standardschrift an. Der gleiche Vorgang erfolgt auch auf pro Charakter, wenn der Browser versucht, ein Zeichen anzuzeigen, das in der angegebenen Schriftart nicht vorhanden ist.
Generische Schriftfamilien
Um Webdesignern eine gewisse Kontrolle über das Erscheinungsbild von Schriftarten auf ihren Webseiten zu geben, auch wenn die angegebenen Schriftarten nicht verfügbar sind, ermöglicht die CSS -Spezifikation die Verwendung mehrerer Generika Schriftfamilien. Diese Familien sind so konzipiert, dass sie aufgrund ihres allgemeinen Erscheinungsbilds Schriftarten in verschiedene Kategorien aufteilt. Sie werden allgemein als letzte in einer Reihe von Fallback -Schriftarten als letztes Mittel angegeben, falls keiner der vom Autor angegebenen Schriftarten verfügbar ist. Für mehrere Jahre gab es fünf generische Familien:[6]
- Schriftarten, die keine dekorativen Markierungen oder Serifen auf ihren Briefen haben. Diese Schriftarten werden oft als einfacher als leichter auf Bildschirmen angesehen.[7]
- Schriftarten mit dekorativen Markierungen oder Serifen, die auf ihren Charakteren vorhanden sind. Diese Schriftarten werden traditionell in gedruckten Büchern verwendet.
- Schriftarten, in denen alle Zeichen gleich breit sind.
- Schriftarten, die kursives Schreiben ähneln. Diese Schriftarten mögen ein dekoratives Aussehen haben, können jedoch in kleinen Größen schwer zu lesen sein, sodass sie im Allgemeinen sparsam verwendet werden.
Fantasie
- Schriftarten, die Symbole oder andere dekorative Eigenschaften enthalten, repräsentieren aber dennoch das angegebene Zeichen.
CSS -Schriftarten arbeiten Entwurf 4 mit weniger Browser -Unterstützung
[8] System-UI
- Standardschriften in einem bestimmten System: Der Zweck dieser Option besteht darin, Webinhalte in das Erscheinungsbild des nativen Betriebssystems zu integrieren.
ui-serif
- Standardschriften eines bestimmten Systems im Serifenstil
UI-sans-serif
- Standardschriften eines bestimmten Systems in einem seriF-Stil
UI-monospace
- Standardschriften eines bestimmten Systems in einem Monospace -Stil
UI-abgerundet
- Standardschriften eines bestimmten Systems in einem abgerundeten Stil
- Schriftarten verwenden Emoji
- Schriftarten für komplexe mathematische Formel und Ausdrücke.
Fangsong (Chinesisch: 仿宋体)
- Chinesische Schriftarten zwischen Serifenlied und Kursivkai -Formen. Dieser Stil wird oft für Regierungsdokumente verwendet.
Web -Schriftarten
Geschichte
Eine Technik, auf die Sie Remote -Schriftarten beziehen und automatisch herunterladen sollten @font-face
konstruieren. Zu diesem Zeitpunkt war das Abrufen von Schriftdateien aus dem Web umstritten, da Schriftarten, die nur für bestimmte Webseiten verwendet werden sollen, auch im Verstoß gegen die Schriftlizenz heruntergeladen und installiert werden konnten.[9]
Microsoft fügte zuerst Support für herunterladbar hinzu Eot Schriftarten in Internet Explorer 4 1997 mussten die Autoren das Eigentümer verwenden SCHUSS Tool zum Erstellen einer subartierten Schriftdatei für jede Seite. EOT zeigte, dass Webfonts funktionieren konnten und das Format einige Nutzung in Schreibsysteme nicht von gemeinsamen Betriebssystemen unterstützt. Das Format erlangte jedoch nie eine weit verbreitete Akzeptanz und wurde letztendlich von W3C abgelehnt.[10]
In 2006, Håkon Wium Lüge Startete eine Kampagne gegen die Verwendung von EOT und ließ Webbrowser häufig verwendete Schriftformate unterstützen.[11][12][13] Die Unterstützung für die häufig verwendeten Formate von TrueType und OpenType -Schriftart wurde inzwischen implementiert Safari 3.1, Oper 10, Mozilla Firefox 3.5 und Internet Explorer 9.
Im Jahr 2010 die Woff Komprimierungsmethode für TrueType- und OpenType -Schriftarten wurde von der W3C untergebracht Mozilla Foundation, Opera -Software und Microsoftund Browser haben seitdem Unterstützung hinzugefügt.[14][15][16]
Google -Schriftarten wurde 2010 ins Leben gerufen, um Webfonts unter zu servieren Open Source Lizenzen. Bis 2016 sind mehr als 800 WebFont -Familien verfügbar.[17]
Webfonts sind zu einem wichtigen Tool für Webdesigner geworden, und ab 2016 verwendet ein Großteil der Websites Webfonts.[18]
Dateiformate
Durch Verwendung eines bestimmten CSS @font-face
Einbettungstechnik[19] Es ist möglich, Schriftarten so einzubetten, dass sie mit IE4+, Firefox 3.5+, Safari 3.1+, Opera 10+ und Chrome 4.0+ arbeiten. Dies ermöglicht es der überwiegenden Mehrheit der Webbenutzer, auf diese Funktionalität zuzugreifen. Einige kommerzielle Gießereien lehnen die Umverteilung ihrer Schriftarten ab. Zum Beispiel, Hoefler & Frere-Jones sagt, dass sie "... begeistert das Aufkommen eines ausdrucksvolleren Webs unterstützen, in dem Designer online hochwertige Schriftarten sicher und zuverlässig verwenden können" @font-face
wird von der Gießerei als "illegale Verteilung" angesehen und ist nicht zulässig.[20] Stattdessen bieten Hoefler & Co. ein in der Cloud verwurzeltes proprietäres Schriftsystem an. Viele andere kommerzielle Gießereien befassen sich mit der Umverteilung ihrer Schriftarten, indem eine bestimmte Lizenz, die als Web -Schriftart -Lizenz bezeichnet wird, die Verwendung der Schriftsoftware zum Anzeigen von Inhalten im Web ermöglicht. Natürlich beeinträchtigt dies nicht die Schriftarten und Gießereien unter kostenlosen Lizenzen.[M 1]
Truedoc
TruedocObwohl nicht speziell eine WebFont -Spezifikation, war der erste Standard für die Einbettung von Schriftarten. Es wurde von der Typ Gießerei entwickelt Bitstream 1994 und wurde nativ unterstützt in Netscape Navigator 4, 1996. Aufgrund von Open -Source -Lizenzbeschränkungen, wobei Netscape den Quellcode von Bitstream nicht freigeben konnte, wurde die native Unterstützung für die Technologie endete, als Netscape Navigator 6 veröffentlicht wurde. Ein ActiveX Plugin war verfügbar, um Truedoc zu unterstützen Internet Explorer, aber die Technologie musste gegeneinander antreten Microsoft's Eingebetteter Openentyp Schriftarten, die seit Version 4.0 in ihrem Internet Explorer -Browser nativ unterstützt hatten.[21] Ein weiteres Hindernis war das Fehlen von Open-Source- oder kostenloses Tool zum Erstellen von Webfonts im TRUEDOC Webbetting -Schriften Tool So erstellen Sie Webfonts in ihrem Format.
Eingebetteter Openentyp
Internet Explorer hat die Schriftart unterstützt, die sich durch das Eigentum einbettet Eingebetteter Openentyp Standard seit Version 4.0. Es verwendet Management von Digitalen Rechten Techniken, mit denen verhindern, dass Schriftarten ohne Lizenz kopiert und verwendet werden. Eine vereinfachte Teilmenge von EOT wurde unter dem Namen CWT formalisiert (Kompatibilitätswebentypfrüher Eot-lite)[22]
Skalierbare Vektorgrafiken
Web Typografie gilt für SVG In zwei Wegen:
- Alle Versionen der SVG 1.1 -Spezifikation, einschließlich der SVGT Definieren Sie ein Schriftmodul, das die Erstellung von Schriftarten innerhalb eines SVG -Dokuments ermöglicht. Safari Einführte Unterstützung für viele dieser Eigenschaften in Version 3. Oper Die vorläufige Unterstützung in Version 8.0 mit Unterstützung für weitere Immobilien in 9.0 hinzugefügt.
- Mit der SVG -Spezifikation können CSS für SVG -Dokumente auf ähnliche Weise wie HTML -Dokumente und die gelten
@font-face
Regel kann in SVG -Dokumenten auf Text angewendet werden. Opera fügte Unterstützung dafür in Version 10 hinzu,[23] und Webkit Da Version 325 diese Methode auch nur mit SVG -Schriftarten unterstützt.
Skalierbare Vektorgrafikschriften
SVG -Schriftarten waren ein W3C -Standard von Schriftarten unter Verwendung von SVG -Grafik, die zu einer Untergruppe von Openentyp -Schriftarten wurde.[24] Es erlaubte mehrfarbig[25] oder animierte Schriftarten.[26] Es war zunächst eine Untergruppe von SVG 1.1 -Spezifikationen[27] aber es wurde veraltet[28] In der SVG 2.0 -Spezifikation. Die SVG -Schriftarten als unabhängiges Format werden von den meisten Browsern außer IE und Firefox unterstützt und in Chrom (und Chrom) veraltet.[29] Das ist jetzt allgemein veraltet; Der Standard, mit dem die meisten Browser -Anbieter zustimmten, ist die SVG -Schriftart, die im OpenType (und dann WOFF Superset, siehe unten), als SVGOPentypefonts enthalten ist.[30] Firefox hat seit Firefox 26 SVG OpenType unterstützt.
TrueType/Openentype
Verknüpfung mit Branchenstandard TrueType (TTF) und Offener Typ (TTF/OTF) Schriftarten werden von Mozilla Firefox 3.5+, Opera 10+, unterstützt.[31] Safari 3.1+,[32] und Google Chrome 4.0+.[33] Internet Explorer 9+ unterstützt nur diese Schriftarten mit Einbettungsberechtigungen auf installierbar.[34]
Web Open -Schriftformat
Das Web Open -Schriftformat (Woff) ist im Wesentlichen Offener Typ oder TrueType mit Kompression und zusätzlichen Metadaten. WOFF wird von Mozilla Firefox 3.6+ unterstützt,[35] Google Chrome 5+,,[36][37] Oper Presto,[38] und wird unterstützt von Internet Explorer 9 (Seit 14. März 2011).[39] Support ist unter Mac OS X Lion's verfügbar Safari Aus Release 5.1.
Unicode -Schriftarten
Standardmäßig nur zwei Schriftarten auf der Fenster Plattform, Microsoft sans serif und Lucida sans unicode, eine breite Bereitstellung Unicode Charakterrepertoire. EIN Fehler in Verdana (und das unterschiedliche Handling von verschiedenen Benutzeragenten) behindert seine Benutzerfreundlichkeit wo Charaktere kombinieren sind gewünscht.
An Kostenlose und Open-Source-Software Plattformen wie Linux, GNU Unifont und GNU Freefont liefern eine breite Palette von Unicode Charakter.
Alternativen
Eine häufige Hürde im Webdesign ist das Design von Modellen, die Schriftarten enthalten, die nicht Web-Safe sind. Es gibt eine Reihe von Lösungen für solche Situationen. Eine übliche Lösung besteht darin, den Text durch eine ähnliche websichere Schriftart zu ersetzen oder eine Reihe ähnlich aussehender Fallback-Schriftarten zu verwenden.
Eine andere Technik ist Bildersatz. Diese Praxis umfasst das Überlagern von Text mit einem Bild, das denselben Text enthält, der in der gewünschten Schriftart geschrieben wurde. Dies ist gut für ästhetische Zwecke, verhindert jedoch die Textauswahl, erhöht die Verwendung der Bandbreite, ist schlecht für Suchmaschinenoptimierungund macht den Text nicht zugänglich für Benutzer mit Behinderungen.
In der Vergangenheit, Blinken-basierte Lösungen wie z. SIFR wurden verwendet. Dies ähnelt den Bildersatztechniken, obwohl der Text als Vektor ausgewählt und gerendert wird. Diese Methode erfordert jedoch das Vorhandensein eines proprietären Plugins im System eines Kunden.
Eine andere Lösung besteht darin, JavaScript zu verwenden, um den Text durch zu ersetzen VML (für Internet Explorer) oder SVG (für alle anderen Browser).[40]
Siehe auch
- Skalierbarer Inman -Flash -Ersatz
- Liste von RFC, wie in WOFF (Entwurf von 2009-10-23) erwähnt:
Anmerkungen
- ^ Siehe Open-Source-Schriften und kostenlose Software-Unicode-Schriftzeichen für solche Schriftarten.
Verweise
- ^ Garaffa, Dave (2. September 1997). "Eingebettete Schriftarten in Microsoft IE4PR2". Internet.com. Archiviert von das Original Am 8. Juli 1998.
- ^ Cascading -Stilblätter, Stufe 1, W3C, 1996-12-17
- ^ "Schriftarten", Cascading -Stilblätter, Stufe 2: CSS2 -Spezifikation, World Wide Web Konsortium, 1998-05-12, abgerufen 2009-07-28
- ^ CSS2.1 Änderungen - C.2.97 Kapitel 15 Schriftarten, World Wide Web Konsortium, abgerufen 2010-01-30
- ^ CSS3 -Modul: Web -Schriftarten, World Wide Web Konsortium, abgerufen 2010-01-30
- ^ a b "CSS2 -Spezifikation", Schriftarten, World Wide Web Konsortium
- ^ Poole, Alex (2005-04-07). "Welche sind lesbarer: Serife- oder Sans Serif Schype?". Archiviert vom Original am 2017-07-22. Abgerufen 2017-09-27.
- ^ "UI-Serif-, UI-sans-Serif-, UI-Monospace- und UI-abgerundete Werte für Schriftfamilie | Kann ich ... Support-Tabellen für HTML5, CSS3 usw. verwenden?".
- ^ Hill, Bill (2008-07-21), Schriftart in das Web einbettet, Microsoft
- ^ W3C -Teamkommentar
- ^ Microsoft's Forgotten Monopoly
- ^ Web -Schriftarten: Die Ansicht aus der freien Welt
- ^ CSS @ Ten: Das nächste große Ding
- ^ WOFF -Dateiformat 1.0 Einreichungsanforderung an W3C
- ^ Galineau, Sylvain (2010-04-23), Treffen Sie WOFF, das Standard -Web -Schriftart -Format, Microsoft
- ^ WOFF -Konvertierungsreferenzcode, abgerufen 8. Mai, 2016
- ^ "Die neue Google Fonts -Datenbank ist ein Paradies eines Design -Geek". Theverge.com. Abgerufen 24. August 2016.
- ^ Richard Fink (2016-09-06)Webfonts auf der PrärieAlist auseinander
- ^ Kimler, Scott Thomas (2009-07-04), Xbrowser -Schriftarten - Erweitern Sie Ihre Schriftpalette mit CSS3, abgerufen 2010-02-05
- ^ Wubben, Mark (27. Februar 2009). "Geek Meet: Web Typografie und SIFR 3 - Folie 15 und 16". Slideshare. Abgerufen 17. März 2010.
- ^ Genst, Jennifer (2001). Webdesign auf den Punkt gebracht: Ein Desktop -Schnellreferenz (2. Aufl.). O'Reilly. p.36. ISBN 0-596-00196-7. Abgerufen 20. März 2016.
Welches Jahr wurde Truedoc entwickelt.
- ^ Daggett, John (2009-07-31), EOT-LITE-Dateiformat v.1.1, World Wide Web Konsortium, abgerufen 2010-01-30
- ^ Mills, Chris (2008-12-04), Opera Presto 2.2 und Opera 10 - ein erster Blick, Opera -Software, abgerufen 2010-01-30
- ^ SVG im Openentyp, W3c, abgerufen 2014-09-20
- ^ Bunte Typografie im Internet: Machen Sie sich bereit für mehrfarbige Schriftarten, Pixel Ambacht, abgerufen 2014-09-20
- ^ Anymated Glyph Beispiel, people.mozilla, abgerufen 2014-09-20
- ^ Schriftarten, W3c, abgerufen 2014-09-20
- ^ Schriftarten Kapitel, W3c, abgerufen 2018-03-08
- ^ Kann ich SVG -Schriftarten verwenden?, Kann ich benutzen, abgerufen 2014-09-20
- ^ Svgopentypefonts, Mozilla, abgerufen 2014-09-20
- ^ Mills, Chris (2008-12-04), Opera Presto 2.2 und Opera 10 - ein erster Blick, Opera Developer Community, abgerufen 2010-01-29
- ^ Marsal, Katie (2008-02-07), Apples Safari 3.1 zur Unterstützung von herunterladbaren Web -Schriftarten, mehr, Appleinsider, abgerufen 2010-02-05
- ^ Irish, Paul (2010-01-25), Chrome und @Font-Face: Es ist hier!
- ^ Galineau, Sylvain (2010-07-15), Die CSS -Ecke: bessere Web -Typografie für besseres Design, Microsoft
- ^ Shapiro, Melissa (2009-10-20), Mozilla unterstützt Web -Open -Schriftformat, Mozilla, abgerufen 2010-02-05
- ^ Gilbertson, Scott (2010-04-26), Google Chrome, um das Web -Open -Schriftformat zu unterstützen, Webmonkey
- ^ Fehler 38217 - [Chrom] WOFF -Unterstützung hinzufügen, Webkit
- ^ Webspezifikationen unterstützen in Opera Presto 2.7Opera
- ^ Galineau, Sylvain (2010-04-23), Treffen Sie WOFF, das Standard -Web -Schriftart -Format, Microsoft
- ^ Über Cufon