[TomasSedovic]

This is a really cool site, thanks!

It also helped me understand something about the font sizes that always puzzled me (but never enough to actually look it up).

All of the fonts there have the size of 16, but some are clearly bigger than others. Compare e.g. Inconsolata and Meslo:

http://app.programmingfonts.org/#inconsolata http://app.programmingfonts.org/#meslo

Having them side by side, you can see that they contain the same vertical amount of space. Inconsolata's glyphs are smaller, but they're still in the box of the same height.

It does seem that the "font size" only refers to the height, though. The width is clearly variable.

To anyone who actually understands this properly: is the above correct or is that just an artefact of how the website renders the text?

[klageveen]

A font’s dimensions at a given “font-size” are actually completely up to the designer. Something like x-height can only be determined by rendering and then measuring. Editors tend to be full of character measuring code. x-height also doesn’t say anything about the length of descenders and ascenders. Some fonts are exactly the same size though, there a bunch of variations of Courier to be used as a replacement (for licensing reasons). If they’re not designed to the same dimensions you cannot be sure text will fit on the page with the other font. And if they’re the same size they can still look larger or smaller by a wide margin. It’s a wonderful world :)

[Kaibeezy]

What you’re noticing is the variation in “x-height”, that is, the height of the middle part of the lowercase letterforms, not counting ascenders/descenders.

Width can always vary. Combinations of greater width and x-height make the letters look bigger.

At least, that’s the way I’ve always understood it.

This image shows it clearly:

http://kapundahigh.weebly.com/uploads/6/1/5/4/61545621/xheig...