Neue Typografie im Web – über Hinting, Rendering, Techniken & Services
-
Upload
david-querg -
Category
Design
-
view
2.994 -
download
0
description
Transcript of Neue Typografie im Web – über Hinting, Rendering, Techniken & Services
![Page 1: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/1.jpg)
1TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
Typografie im Web
![Page 2: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/2.jpg)
2TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
Typografie im Web
1. Print vs. Screen
2. Typografie auf dem Bildschirm
3. Typografie im Web
4. Ausblick & mehr
![Page 3: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/3.jpg)
3TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
Print vs. Screen
![Page 4: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/4.jpg)
4TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
1.1 Print vs. Screen: Farbmischung
Print:
• subtraktiv
• geringerer Kontrast
Bildschirm:
• additiv
• höherer Kontrast
![Page 5: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/5.jpg)
5TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
1.2 Print vs. Screen: Auflösung
Print:
• 300dpi / 1200 dpi ++
• viele Details
• hohe Schärfe
Bildschirm:
• 72dpi / 96dpi
• weniger Details
• geringere Schärfe
![Page 6: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/6.jpg)
6TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
1.3 Print vs. Screen
Bildschirm:
• höherer Kontrast
• weniger Details
• Fonts werden stark herunterskaliert, verlieren an Details
![Page 7: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/7.jpg)
7TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
Typografie auf dem Bildschirm
![Page 8: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/8.jpg)
8TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.1 Typografie auf dem Bildschirm: Hinting
ohne Hinting mit Hinting
![Page 9: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/9.jpg)
9TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.1 Typografie auf dem Bildschirm: Hinting
ohne Hinting mit Hinting
![Page 10: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/10.jpg)
10TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.1 Typografie auf dem Bildschirm: Hinting
• Fonts sind Vektoren
• Bildschirm kann nur Pixel darstellen
• Hinting bestimmt welche Pixel für den Buchstaben in der jeweiligen Schriftgröße von Bedeutung sind
• Hinting bezieht sich auf Rendering-Methode
![Page 11: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/11.jpg)
11TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.1 Typografie auf dem Bildschirm: Hinting
• Hinting verbessert nicht zwangsläufig die Lesbarkeit
• teilweise spielt Hinting überhaupt keine Rolle
• abhängig vom Format & Rasteriser
• TrueType vs. PostScript
![Page 12: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/12.jpg)
12TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.1 Typografie auf dem Bildschirm: Hinting
TrueType:
• Rasteriser nutzt Hinting, ohne Hinting verhalten sich Fonts tendenziell schlecht
PostScript:
• Rasteriser ignoriert Hinting weitgehend oder komplett
TrueType RASTERISER BILDSCHIRM AUSGABEHINTING
PostScript RASTERISER BILDSCHIRM AUSGABEHINTING
TrueType RASTERISER BILDSCHIRM AUSGABEHINTING
PostScript RASTERISER BILDSCHIRM AUSGABEHINTING
![Page 13: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/13.jpg)
13TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.1 Typografie auf dem Bildschirm: Hinting
TrueType:
• mehr Kontrolle über die Darstellung
• Updates sehr aufwändig
• Hinting erfolgt für Rendering- Methode, deshalb ist die Darstellung nicht zwangsläufig gut
PostScript:
• weniger Kontrolle für Type-Designer
• Optimierung des Rasterisers wirkt sich auf alle Fonts aus
• auch 20 Jahre alte Schriften werden auf Macs vernünftig dargestellt
![Page 14: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/14.jpg)
14TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.1 Typografie auf dem Bildschirm: Hinting
» I will not go into details here, but the primary difference is that Microsoft’s rasteriser tries to align characters to whole pixel grid, with the result that ‘Regular’ weights look lighter, ‘Bold’ weights look heavier, and subtle details of design can be lost at small point sizes.
Apple’s rasteriser tries to preserve the design of the typeface as much as possible, sometimes at the cost of image clarity.
Windows’ rasterising software produces extremely good results with a few built-in TrueType fonts, but sub-optimal results with 99% of other typefaces.
The Mac OS Quartz technology ignores font hinting completely and renders all fonts equally well regardless of their font format. «
Peter Biľak, typotheque.com
![Page 15: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/15.jpg)
15TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.2 Typografie auf dem Bildschirm: Rendering
Rendering auf Windows
RASTERISER
BLACK AND WHITE
RASTERISER
SUBPIXEL / CLEARTYPE
RASTERISER
ANTI-ALIASING / GREY-SCALE
RASTERISER
DIRECTWRITE
+
![Page 16: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/16.jpg)
16TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.2 Typografie auf dem Bildschirm: Rendering
Black and White
• Pixel an/aus
• Font liegt perfekt im Pixelraster
• 80h für 256 Zeichen
ohne Hinting
mit Hinting
RASTERISER
BLACK AND WHITE
RASTERISER
SUBPIXEL / CLEARTYPE
RASTERISER
ANTI-ALIASING / GREY-SCALE
RASTERISER
DIRECTWRITE
+
![Page 17: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/17.jpg)
17TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.2 Typografie auf dem Bildschirm: Rendering
Grey-Scale / Anti-Aliasing
• horizontal & vertikal
• schwächt Treppeneffekt durch das Hinzufügen von Graustufen ab
• 72h für 256 Zeichen
• besonders empfohlen für Röhrenmonitore
ohne Hinting
mit Hinting
RASTERISER
BLACK AND WHITE
RASTERISER
SUBPIXEL / CLEARTYPE
RASTERISER
ANTI-ALIASING / GREY-SCALE
RASTERISER
DIRECTWRITE
+
![Page 18: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/18.jpg)
18TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.2 Typografie auf dem Bildschirm: Rendering
Subpixel-Rendering (ClearType)
• nur horizontal
• nur für Flachbildschirme
• jeder Pixel besteht aus 3 Elementen, die seperat steuerbar sind
• blaue, rote und grüne Schatten
• Simulation einer 3-mal höheren Textauflösung
• 40h für 256 Zeichen
ohne Hinting
mit Hinting
RASTERISER
BLACK AND WHITE
RASTERISER
SUBPIXEL / CLEARTYPE
RASTERISER
ANTI-ALIASING / GREY-SCALE
RASTERISER
DIRECTWRITE
+
![Page 19: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/19.jpg)
19TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.2 Typografie auf dem Bildschirm: Rendering
DirectWrite
• Subpixel-Rendering + Anti-Aliasing, horizontal & vertikal
• bezieht sich auch auf OpenType Fonts
• Windows 7, IE9, Firefox 4
ohne Hinting
mit Hinting
RASTERISER
BLACK AND WHITE
RASTERISER
SUBPIXEL / CLEARTYPE
RASTERISER
ANTI-ALIASING / GREY-SCALE
RASTERISER
DIRECTWRITE
+
![Page 20: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/20.jpg)
20TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.2 Typografie auf dem Bildschirm: Rendering
ohne Hinting mit Hinting
ohne Hinting mit Hinting
ohne Hinting mit Hinting
ohne Hinting mit Hinting
Black & White
Grey-Scaled
Subpixel
Direct-Write
![Page 21: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/21.jpg)
21TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
2.3 Typografie auf dem Bildschirm: Praxis
Zusammenfassung:
• Hinting kann das Rendering von Fonts verbessern
• aber: Rasteriser rendern Fonts unterschiedlich
• abhängig von Plattform & Software (Browser)
• Hinting wird irgendwann überflüssig sein
aktuelle Marktsituation:
• Windows XP (44,2% Marktanteil, Febr. 2011, Wikipedia)
• XP hat ClearType standardmäßig deaktiviert, muss manuell angeschaltet werden
![Page 22: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/22.jpg)
22TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
Typografie im Web
![Page 23: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/23.jpg)
23TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
3. Typografie im Web
zwei Möglichkeiten:
• Websafe Fonts – sicher & bekannt
• Non-Websafe Fonts – riskant & schön
![Page 24: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/24.jpg)
24TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
3.1 Typografie im Web: Websafe-Fonts
CSS für Websafe-Fonts:
font-family: Arial, Helvetica, sans-serif;
font-family: ‘Courier New’, Courier, monospace;
font-family: Georgia, serif;
font-family: Tahoma, Geneva, sans-serif;
font-family: ‘Times New Roman’, Times, serif;
font-family: ‘Trebuchet MS’, Helvetica, sans-serif;
font-family: Verdana, Geneva, sans-serif;
![Page 25: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/25.jpg)
25TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
3.2 Typografie im Web: Font Embedding Methods
• DTR: Dynamic Text Replacement
• PIR: PHP Image Replacement
• Font Jazz: JS Type Rendering
• FLIR: Face Lift Image Replacement
• SIFR: Scalable Inman Flash Replacement
• Cufon: Javascript
• @font-face: CSS-only
![Page 26: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/26.jpg)
26TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
3.2 Typografie im Web: Font Embedding Methods
SIFR: Scalable Inman Flash Replacement
FLASH
DYNAMISCHES TEXTFELD
FONT
WEBSITE
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque
CSS
verteckt Originaltext
JAVASCRIPT
KONFIGURATION
SCRIPT
(+) zugänglich, markierbar, kompatibel (+) keine Lizenzverletzung
(–) Textlinks schwierig zu erstellen (–) Flash ist erforderlich, non-standard (–) relativ langsam
![Page 27: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/27.jpg)
27TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
3.2 Typografie im Web: Font Embedding Methods
Cufon:
GENERATOR
FONT SVG VML
WEBSITE
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque
JAVASCRIPT
JSON FONT INFORMATION
RENDERINGENGINE
(+) schnell, auch bei großen Textmengen (+) kompatibel
(–) Schriften können leicht gestohlen werden (–) nicht markierbar / kopierbar
![Page 28: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/28.jpg)
28TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
3.2 Typografie im Web: Font Embedding Methods
@font-face:
WEBSITE
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque
CSS bestimmt Schriftart
SERVER / SERVICE
FONT
(+) sehr einfache und saubere Einbindung, standard (+) zugänglich, markierbar, wachsend kompatibel
(–) evtl. Schriftlizenz-Probleme (–) Probleme mit alten Browsern (–) Rendering-Probleme
![Page 29: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/29.jpg)
29TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
3.2 Typografie im Web: Font Embedding Methods
@font-face: Browser-Unterstützung
• Webkit/Safari: TrueType/OpenType TT OpenType PS
• Opera: TrueType/OpenType TT OpenType PS SVG
• Internet Explorer: OpenType EOT WOFF (IE9)
• Mozilla/Firefox: TrueType/OpenType TT OpenType PS WOFF (F3.6)
• Chrome: TrueType/OpenType TT OpenType PS WOFF
![Page 30: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/30.jpg)
30TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
3.2 Typografie im Web: Font Embedding Methods
@font-face: CSS
@font-face { font-family: ‘ChunkFiveRegular’; src: url(‘Chunkfive-webfont.eot’); src: local(‚ò∫’), url(‘Chunkfive-webfont.woff’) format(‘woff’), url(‘Chunkfive-webfont.ttf’) format(‘truetype’), url(‘Chunkfive-webfont.svg#webfont’) format(‘svg’); font-weight: normal; font-style: normal; }
![Page 31: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/31.jpg)
31TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
3.3 Typografie im Web: Font Embedding Services
Font Embedding Services:
• Fontdeck
• Kernest
• Typoteque
• Fonts Live
• Type Front
• Fontspring
• Fonts.com Web Fonts
• Typekit
• Webtype
• Google Fonts
![Page 32: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/32.jpg)
32TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
3.3 Typografie im Web: Font Embedding Services
Typekit
• 4000 Fonts
(+) einfache Konfiguration (+) niedrige Preise (+) flexibles Preissystem (+) Self-Hosting via CDN (+) Tools zur Lade-Konfig.
(–) Javascript
Preise: – free trial with 2 fonts on 1 site – $24.99 per year (2 sites, 5 fonts per site)
![Page 33: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/33.jpg)
33TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
3.3 Typografie im Web: Font Embedding Services
Webtype
• 365 Fonts, good quality
(+) einfache Konfiguration (+) flexibles Preissystem (+) individuelle Fonts (+) kein Javascript
(–) teilweise teure Fonts
Preise: – free 30-day trial – fonts start at $10 per year
![Page 34: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/34.jpg)
34TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
3.3 Typografie im Web: Font Embedding Services
Google Webfonts
• 60 Fonts
(+) einfache Konfiguration (+) kein Javascript (+) kostenfrei (+) keine Registrierung
(–) geringe Auswahl (–) teilw. schlechte Qualität
Preise: – kostenfrei
![Page 35: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/35.jpg)
35TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
3.3 Typografie im Web: Font Embedding Services
http://fffo.grahambird.co.uk/
![Page 36: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/36.jpg)
36TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
Ausblick & mehr
![Page 37: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/37.jpg)
37TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
4. Ausblick & mehr
Ausblick:
• @font-face gehört die Zukunft
• Qualität der Schrift ist entscheidend
• Rasteriser / Rendering Methoden werden besser
• Hinting wird überflüssig
• mehr Kontrolle über Typografie via CSS
![Page 38: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/38.jpg)
38TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
4. Ausblick & mehr
… & mehr:
• The League of Moveable Type
• Smashing Magazine: 50 Useful Design Tools for Beautiful Web Typography
• Typoteque Essays
![Page 39: Neue Typografie im Web – über Hinting, Rendering, Techniken & Services](https://reader034.fdocument.pub/reader034/viewer/2022052602/559ec17c1a28ab39038b46a5/html5/thumbnails/39.jpg)
39TYPOGRAFIE IM WEB | DAVID QUERG | WWW.QUERG.DE | WWW.LOVINWAYNE.DE
www.querg.deDanke für Feedback und Ergänzungen!