Category: Typography

The science behind fonts (and how they make you feel)

After experimenting with how content is displayed on the ooomf blog, Mikael Cho discovered there’s an element of science behind why seemingly small things like font and the spacing between letters can impact how we feel when reading online. The result is an article about the research done, complete with tips on how to better present the content by choosing the right font and layout.

“Understanding the way we read is important for designing how words look because you can directly impact someone’s connection to your writing with the right font and layout. ”

~ Mikael Cho

The Era of Symbol Fonts

Today A List Apart features a very good article on symbol fonts by Brian Suda. It covers the place of symbol fonts in the whole process of improving web site performance, visual and accessibility advantages of their use, new possibilities for ligatures, and possible issues a web designer can run into with symbol fonts.

Why Subtle Typographic Choices Make All The Difference

Carolyn Knight and Jessica Glaser look at the reasons why subtle typographic changes can create considerable effect, referring to linguistic and semiotic examples, as well as design case studies, to get to grips with why subtle changes can make all the difference.

Why Subtle Typographic Choices Make All The Difference

Applying Macrotypography For A More Readable Web Page

Any application of typography can be divided into two arenas: micro and macro. Understanding the difference between the two is especially useful when crafting a reading experience, because it allows the designer to know when to focus on legibility and when to focus on readability.

This article by Nathan Ford focuses mostly on a few simple macrotypographic techniques — with a dash of micro — and on how to combine them all to build a more harmonious, adaptable and, most importantly, readable Web page.

How To Choose The Right Face For A Beautiful Body

What is it that makes a typeface into a text font, instead of a font for larger sizes? The answer differs slightly, depending on whether one aims for print or Web-based environments.

Nevertheless, there are certain features that most good text faces have in common. Familiarity with these helps to select the right fonts for a given project. This article by Dan Reynolds presents a few criteria to help the process along.

Responsive text

Some websites now contain ‘responsive images’. These scale (or crop) depending upon your screen’s viewing area, so the image sizes remain appropriate whether you’re looking at the website on a mobile phone, or on a huge flat screen monitor.

This is an example of responsive text. The amount of textual detail scales relative to your screen size.

The effect is achieved using simple HTML class names and CSS media queries which show or hide the content depending upon the current screen width.