Magdeburg | 2010-04-12 | Typographie im Web

1.669 Aufrufe

Veröffentlicht am

Veröffentlicht in: Design
0 Kommentare
0 Gefällt mir
Statistik
Notizen
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Keine Downloads
Aufrufe
Aufrufe insgesamt
1.669
Auf SlideShare
0
Aus Einbettungen
0
Anzahl an Einbettungen
238
Aktionen
Geteilt
0
Downloads
4
Kommentare
0
Gefällt mir
0
Einbettungen 0
Keine Einbettungen

Keine Notizen für die Folie























  • Magdeburg | 2010-04-12 | Typographie im Web

    1. 1. MIKROTYPOGRAPHIE IM WEB Wolf Brüning – webvariants / UCDplus
    2. 2. AGENDA • Warum ist saubere Typographie wichtig • Rückblick auf Christophs Vortrag • Mikrotypographie allgemein • Mikrotypographie im Web
    3. 3. WARUM • Lesbarkeit • Ästhetik • Professionelles Auftreten • Sauberer Textsatz ist eines der am häufigsten vernachlässigten Felder im Webdesign
    4. 4. ALLGEMEINE TYPOGRAPHIE • Schriftarten und -schnitte • Text- und Hintergrundfarbe • Laufweite und Zeilenabstände • Einzüge • Abstände
    5. 5. Nicht optimierter Text
    6. 6. Laufweite
    7. 7. Schriftarten und -schnitte
    8. 8. Schriftgrößen
    9. 9. Farben
    10. 10. Vertikaler Rhythmus
    11. 11. Einzüge
    12. 12. MIKROTYPOGRAPHIE
    13. 13. MIKROTYPOGRAPHIE
    14. 14. MIKROTYPOGRAPHIE
    15. 15. MIKROTYPOGRAPHIE
    16. 16. WICHTIGE SONDERZEICHEN Anführungszeichen „“ Einfach ,’ Französisch »« Gedankenstrich – Trennstrich - Auslassung …
    17. 17. HTML-ENTITIES Anführungszeichen „“ „ ” Einfach ,’ ‚ ’ Französisch »« » « Gedankenstrich – – — Trennstrich - ­ Auslassung … …
    18. 18. SAY HELLO TO... UTF-8
    19. 19. SONDERZEICHEN PC Anführungszeichen „“ Alt+0132, Alt+0147 Einfach ,’ Alt+0130 , Alt+0145 Französisch »« Alt+0171, Alt+0187 Gedankenstrich – Alt+0150, Alt+0150 Trennstrich - Auslassung … Alt+0133
    20. 20. SONDERZEICHEN MAC Anführungszeichen „“ Alt+^, Alt+2 Einfach ,’ Shift+#, Shift+Alt+# Französisch »« Shift+Alt+Q, Alt+Q Gedankenstrich – Alt+-, Shift+Alt+- Trennstrich - Auslassung … Alt+.
    21. 21. EINSATZ VON MIKROTYPOGRAPHIE • Vorteile: • Ästhetischeres Schriftbild • Formale Korrektheit • Nachteile • Änderungen direkt im HTML, erhöhter Aufwand • Schwierig zu kontrollieren, z.B. in CMS
    22. 22. MEHR DAZU • The trouble with EM ‘n EN and other shady characters http://www.alistapart.com/articles/emen/ • Web Typography Sucks http://www.webtypography.net/sxsw2007 • Website des Vortragenden http://www.wolfbruening.de

    ×