Name: The complete manual of typography
ISBN: 9780321773265

What Hacker News says

itafromaOct 2017

I would highly recommend James Felici's The Complete Manual of Typography. Goes through all the core concepts of typography and why they matter, and provides a number of guidelines.

thread

charlieparkFeb 2013

The best book I know on the topic is Robert Bringhurst's The Elements of Typographic Style. Highly, highly recommended.

Other great books: Ellen Lupton's Thinking With Type and James Felici's The Complete Manual of Typography. Both are really solid.

Books that would be worth checking out at a library: Richard Hendel's On Book Design and Ruari McLean's Typographers on Type. More philosophical in nature, less practical.

thread

arkitaipMay 2011

IMHO you first need to understand design, its various sub fields (i.e. typography, colors, layout), user experience design/interaction design/usability, and finally how all of this applies to the web. You can learn the basics by reading books but the only way to truly understand and master is by study this things in the world and by practicing them. Start thinking about design, analyze it in your daily life, do your own makeovers of sites you use, design a blog theme, etc, etc.

As for web typography, you want to check of the latest generation of font embedding because that's where the real magic's at. The most known web font solutions are: CSS3 (font-face), typeface.js, cufon, flir, sifr, Google Font API, Typekit.

Here's a list of quality books on design and typography:

    A History of Graphic Design
    Before & After Page Design
    Designing Brand Identity
    Emotional Design: Why We Love (or Hate) Everyday Things
    Graphic Design Solutions
    How Designers Think
    Information Dashboard Design: The Effective Visual Communication of Data
    Making and Breaking the Grid: A Graphic Design Layout Workshop 
    The Complete Manual of Typography
    The Designer's Guide to Color Combinations
    The Elements of Graphic Design: Space, Unity, Page Architecture, and Type
    The Elements of Typographic Style
    The New Typography
    The Visual Display of Quantitative Information
    Thinking with Type: A Primer for Designers
    Typography Workbook: A Real-World Guide to Using Type in Graphic Design

Books on web design:

    About Face 3: The Essentials of Interaction Design
    Ambient Findability: What We Find Changes Who We Become  
    Bulletproof Web Design
    Cascading Style Sheets: The Definitive Guide
    Designing Web Usability
    Designing With Web Standards
    Designing the Obvious: A Common Sense Approach to Web Application Design
    Designing the User Interface: Strategies for Effective Human-Computer Interaction
    Don't Make Me Think: A Common Sense Approach to Web Usability
    Homepage Usability: 50 Websites Deconstructed
    Information Architecture for the World Wide Web: Designing Large-Scale Web Sites
    Information Architecture: Blueprints for the Web  
    Interaction Design: Beyond Human-Computer Interaction
    Rocket Surgery Made Easy: The Do-It-Yourself Guide to Finding and Fixing Usability Problems
    The Essential Guide to User Interface Design
    The Inmates Are Running the Asylum
    Thoughtful Interaction Design: A Design Perspective on Information Technology
    Web Form Design: Filling in the Blanks

thread

fsck--offNov 2013

Here's a pretty good explanation from The Complete Manual of Typography, by James Felici:

"No two words in typography are as commonly misused as font and typeface. A typeface is a collection of characters—letters, numbers, symbols, punctuation marks, etc.—that are designed to work together like the parts of a coordinated outfit. A typeface is an alphabet with a certain design. A font, in contrast, is a physical thing, the description of a typeface—in computer code, photographic film, or metal—used to image the type. The font is the cookie cutter, and the typeface is the cookie (see Figure 3 1).† When you look at a page of type, you can say, “What typeface is that? ” or “What font was used to set that? ” But you can’t say, “What font is that? ” because you’re not looking at a font; you’re looking at the product of a font. The confusion between the terms arises largely from the ambiguous use of the term font in computer programs, most of which have a Font menu. Although that menu lists what fonts are available for use by the program, it could just as easily be called the Typeface menu, as it also lists the typefaces available for your pages. In fact, since some fonts contain data for more than one typeface, it would be more accurate to call it the Typeface menu."

† Figure 3.1 shows an example font (the computer code) and its corresponding typeface.

thread

itafromaMay 2013

It's not really that bad, just a few quirks:

- Left sidebar has no right padding

- The right sidebar loses its left padding in narrow viewports

If you want to go hardcore, there are a couple of other things, based off of James Felici's Complete Manual of Typography :

- The measure (line length) at its max width is about double what it should be for the font size (which is inheriting the browser default, usually 16px). Measure in picas (1/6 inch) should be 2-2.5 times the font size in points (1/72 inch, but a straight conversion of 16px = 12pt is usually fine).

- Currently, the line height is set to 130%. If using your current measure, the leading should be about 5 points, for a line height of about 141%. If you halve the measure, the leading would be about 1.5, for a line height of 109%. However, I'd still set the line height to be ~140% because you have a lot of superscript and your links have underlines that go below the descenders. Leading in points should be Measure in picas / font size in points, rounded to the nearest half point. Increase if you have things that go beyond the descenders (like you do) or decrease if you don't have any descenders (e.g., all caps).

thread