54 Typography Resources Every Designer Should Bookmark


Typography Resources

If you are a web designer, or a passionate CSS hobbyist, you must be aware of the impact well structured typography can have on your overall design. Though, optimizing your typography to work on old and new versions of plethora of web browsers on various operating systems can prove to be quite a headache. With the following list of resources, you can learn, optimize, and beautify your web typography, and never need to worry about those pesky compatibility issues again (I wish!).

Typography Tools

  • Typetester

    The Typetester is an online application for comparison of the fonts for the screen. Its’ primary role is to make web designer’s life easier. As the new fonts are bundled into operating systems, the list of the common fonts will be updated.

  • CSSTYPE

    Web Safe Typography on Screen for Pixel Perfectionists.

  • sIFR

    sIFR is meant to replace short passages of plain browser text with text rendered in your typeface of choice, regardless of whether or not your users have that font installed on their systems. It accomplishes this by using a combination of javascript, CSS, and Flash.

  • Font Tester

    Font Tester is a free online font comparison tool. It allows you to easily preview and compare different fonts side by side with various CSS font styles applied to them.

  • Designer Plaything

    A tool for designers and clients to experiment with different typography and colour combinations on a web page as well as check for colour accessibility level.
  • Em Calculator

    Em Calculator is a small JavaScript tool which helps making scalable and accessible CSS design. It converts size in pixels to relative em units, which are based on a text size.

  • CSS with vertical rhythm

    This tool will help you compute CSS that has a consistent vertical rhythm.

  • Colour Contrast Check

    The Colour Contrast Check Tool allows to specify a foreground and a background colour and determine if they provide enough of a contrast “when viewed by someone having color deficits or when viewed on a black and white screen”

  • Lorem Ipsum

    Lorem Ipsum is simply dummy text of the printing and typesetting industry.

  • PHP + CSS Dynamic Text Replacement

    P+C DTR allows you to take a vanilla standards-based (X)HTML web page and dynamically create images to replace and enhance page headings using only PHP + CSS. Sick of using the same three fonts? Tired of editing heading images in PhotoShop? If so, P+C DTR might be for you.

  • Baseline Rhythm Calculator

    Baseline Rhythm Calculator can be used to generate a basic stylesheet with the proper calculations.

Typography Books

  • The Elements of Typographic Style

    This lovely, well-written book is concerned foremost with creating beautiful typography and is essential for professionals who regularly work with typographic designs. Author Robert Bringhurst writes about designing with the correct typeface; striving for rhythm, proportion, and harmony; choosing and combining type; designing pages; using section heads, subheads, footnotes, and tables; applying kerning and other type adjustments to improve legibility; and adding special characters, including punctuation and diacritical marks. The Elements of Typographic Style teaches the history of and the artistic and practical perspectives on a variety of type families that are available in Europe and America today.

  • Thinking with Type
  • Great Web Typography

    Author shares the secrets the professionals use to resolve the problems of web typography and create eye-catching Web typography that looks as good when viewed with Explorer 4.

  • The Designer’s Guide to Web Type

    This is the must-have reference guide for digital designers, graphic artists, new media artisans and typographers who use type as a creative tool in their work. It showcases the latest, greatest type fonts of the world’s hottest online foundries, their Internet addresses (for downloading software or freeware) and electrifying examples of their graphic design applications.

  • Type Rules!: The Designer’s Guide to Professional Typography

    Type Rules!, Second Edition is an up-to-date, thorough introduction to the principles and practices of typography. From the fundamentals to cutting-edge applications, this Second Edition has everything today’s serious designer needs. Dozens of exercises reinforce authoritative coverage on such topics as how to select the appropriate type for the job, how to set type like a pro, how to avoid common mistakes, and how to design a typeface, as well as how to fully harness the power of major design packages like Adobe InDesign and QuarkXPress.

  • Typographically Speaking: The Art of Matthew Carter

    Typographically Speaking: The Art of Matthew Carter entered the field in the days of hand-cut punches and hot-metal type, and has continued to innovate through the eras of photocomposition and digital design. Essays discuss the form of his work, his position and use of typographic history, and his technological innovation. All of his fonts are reproduced in full for reference, and illustrations place his designs in context.
    Published in conjunction with the University of Maryland Baltimore County.

Typography Articles

Free typefaces/fonts

Other typography resources

121 comments so far and counting

  1. Weekly Links - 10/13/07 << Vandelay Website Design
  2. Improve Your Blog and Web Site - Need to Read Posts #6 | The Fatty Talks by Adam Hirsch
  3. Resources For Web Designers
  4. 13 typefaces every graphic designer needs :: David Airey :: Graphic Designer
  5. de vakantie is voorbij.be » Blog Archive » 54 Typography Resources Every Designer Should Bookmark
  6. Just A Small Break | StylishLabs
  7. Design Shrine Group | 54 Typography Resources Every Designer Should Bookmark
  8. Buenos recursos sobre tipografía
  9. Web 2.0 Announcer
  10. diarioTHC | 54 recursos tipográficos
  11. Drainedge Link Tank | Links From Around the Web
  12. Web 2.0 Announcer
  13. Tidbit from my Ma.gnolia at chrisprasojo.com/blog
  14. 54 recursos tipográficos que todo diseñador debería agregar a sus favoritos | Blog Image & Web Solution
  15. Craig Vidler | Weblog » links for 2007-11-05
  16. Fawnt - font resources for designers. -- flisterz:blog - life, reviews, technology, wordpress, design, CSS and anything!
  17. Just A Small Break | Zuitt Mag
  18. adobe » 54 Typography Resources Every Designer Should Bookmark
  19. urbandesire » Blog Archive » links for 2007-11-21
  20. Recursos tipograficos que no pueden faltarnos — Diseño — Freak Group — Diseño web, recursos y mucho más
  21. Typography Tips, History of Typography | Just Creative Design | Jacob Cass
  22. Тут Хумора.NET » Выпуск #335
  23. 16 Font Articles That You Should Read | Tutorial Wow
  24. eBookit.org - digital scripta manent » 54 Typography Resources Every Designer Should Bookmark
  25. Top 100 Best, Cool, Most Popular Professional Fonts (In English)
  26. 16 Font Articles That You Should Read | TutWow
  27. The Top 100 Best Fonts Of All Time | The Design Blog Database
  28. Kumail.H.T`s Blog » The ultimate list of really amazing design related lists
  29. 75+ Truly Remarkable Typography Resources | Hi, I'm Grace Smith
  30. 5 Recursos de Tipografia | Fernanda Carvalho
  31. Designer’s Favourite Fonts & Why
  32. ionoi » Blog Archive » 54 Typography Resources
  33. La importancia de la tipografía en un medio impreso « Xtyan’s Weblog
  34. 11 Essential New Years Resolutions For Web Designers In 2010 | Dreamcatcher Creative Studio
  35. Typography: Resources & Tools | Freelance Creative Media Alliance | FCMA
  36. BLOG { jörg steinhauer } » Gods of GFX #1 – GFX, Tutorials & Ressourcen
  37. eagrapho » 11 Essential New Years Resolutions For Web Designers In 2010
  38. This Weeks Most Popular Tweets (2010-10-31) | White Noise Studio
  39. ADesignDream.com » Blog Archive » The Top 100 Best Fonts Of All Time
  40. Fuentes tipográficas: información y descargas « Curso de Periodismo Digital
  41. 13 Typefaces for Graphic Design « The Creative Portfolio of Mark-Anthony
  42. glacial
  43. King Kreatif | Top 5 Typography Resources

Come on, say something!