Nice Web Type

Nice Web Type is one place for web typography, following experiments, advancements, and best practices in typesetting web text. Handcrafted by Tim Brown, Type Manager for Adobe Typekit.

Twitter: @nicewebtype
Dribbble: timbrown

John Gruber on typography

From a Daring Fireball post entitled The Trend Against Skeuomorphic Textures and Effects in User Interface Design, two sentiments that resonated with me:

On retina displays there’s simply no reason not to use any font you want. All fonts render nicely on retina displays.

If you want to see the future of software UI design, look to the history of print design.

And in case you missed it, John was a guest on The Big Web Show last week. He talked about typesetting as an enjoyable mental puzzle, and waxed nostalgic about Quark Express (I loved it, too – Quark is where I learned to typeset).

Where to Avoid CSS Hyphenation

Eric Meyer:

Since hyphens is an inherited property, it isn’t sufficient to set it for a limited number of elements and assume you’re done. You have to make sure you’ve turned it off for the elements that shouldn’t be hyphenated.

Science!

Jon Tan for 24 ways:

Even though there were no actual differences in reading speed and comprehension, the people who read the version with good typography thought that it took less time to read, and were induced into a good mood by doing so. Not only that, but by being in a good mood, people were more capable of completing creative tasks faster.

Crossing my fingers for a Back to Work typography episode. Merlin’s index card: That’s fine for Massimo; OMG, you guys, Source Code Pro; What couldn’t Cobden-Sanderson ship?

Big Spaceship’s Web Font Viewer

Stephen Koch:

There was a disconnect between the designer and the developer. The designer created the comp in Photoshop with the text exactly as they wanted it to appear. A developer had then taken these specs and made it look like the comp during development, but something was lost in the translation. CSS does not have the fine control of text that Photoshop does, and each browser displays text a little bit differently.

This is where the Web Font Viewer comes in.

Another tool to help designers and developers see type in real web context, and talk about web typesetting without getting wrapped up in layout. I bet this is super useful for teams and clients.

The responsive web will be 99.9% typography

James Young:

It’s all going to be type based because anything else will ultimately end up being too complicated to remain device agnostic.

Hard to predict, but one thing’s certain: it’s a great time to double down on graphic design fundamentals like color, texture, and typography.

Responsive Mistakes (a mini-series)

David Bushell:

The Web is ubiquitous and it’s our job to design for what we know, not what we prefer. As far as we’re concerned there are devices with varying viewport sizes and connectivity. They have different input methods, [plus] each device has a unique subset of web standards it supports and many other features that give us a mere fragment of a clue towards user context.

David goes on to suggest the solution:

Design and build for an entirely fluid viewport (don’t forget height). Allow content to dictate design breakpoints.

Makes sense to me.

SOTA Catalyst Award: Call for entries

The Society of Typographic Aficionados:

The award recognizes a person 25 years of age or younger who shows both achievement and future promise in the field of typography. The purpose of the award is to act as a catalyst in the career of a young person who does not yet have broad exposure in the profession.

The winner gets to speak at TypeCon Portland. Yours truly will be judging, along with Carolina de Bartolo, Craig Eliason, and Ivo Gabrowitsch.

Grids, flexibility, and responsiveness

Laura Kalbag:

The first step in my grid design was to choose an appropriate typeface.

What’s Your Vertical?

Matt Griffin:

The problem that I see here is that responsive designers have often been making the assumption that wider screens also means taller screens. And we adjust our layouts accordingly.

Design Systems

Laura Kalbag for 24 ways:

A design system allows you to focus separately on the components that make up the system, disconnecting the look and feel from the layout. This helps prevent us getting stuck in the rut of the Apple breakpoints […] of mobile, tablet and desktop.

And:

Typography is the easiest way to set the visual tone of the design across all viewport widths.

← Newer Older →

Combining Typefaces

 

I wrote a small book about combining typefaces. Buy it for less than the cost of a fancy beverage.