#fonts (127 links)
- A web font strategy adactio.com
How I’m prioritising performance when it comes to typography on The Session.
- Fonts Knowledge - Google Fonts fonts.google.com
- Modern Font Stacks modernfontstacks.com
System font stack CSS organized by typeface classification for every modern OS. The fastest fonts available. No downloading, no layout shifts, no flashes — just instant renders.
- More than you ever wanted to know about font loading on the web industrialempathy.com
- How to avoid layout shifts caused by web fonts – Simon Hearne simonhearne.com
- A Variable Fonts Primer variablefonts.io
- Variable fonts: What brands need to know | Monotype. monotype.com
- Font style matcher meowni.ca
- Introducing OpenType Variable Fonts medium.com
- Font Testing Page impallari.com
- Variable Fonts for Responsive Design alistapart.com
- Non-blocking web fonts using LocalStorage crocodillon.com
- Self-Hosting Google Web Fonts | Hacker News news.ycombinator.com
- OpenType features — Typofonderie typofonderie.com
Nice visual run-down of OpenType features.
- TYPEKIT | Using OpenType features in CSS help.typekit.com
<blockquote>OpenType features are like secret compartments in fonts. Unlock them and you’ll find ways to make fonts look and behave differently in subtle and dramatic ways. Not all OpenType features are appropriate to use all of the time, but some features are critical for great typography.</blockquote>
- State of Web Type stateofwebtype.com
<blockquote>Up-to-date data on support for type and typographic features on the web.</blockquote>
- Fixed Monospace Sizing meyerweb.com
<blockquote>Monospace text sizing is, from time to time, completely unintuitive and can be quite maddening if you don’t look at it in exactly the right way.</blockquote>
- The 62.5% Solution? | Tracy Rotton taupecat.com
<blockquote>the whole idea of converting pixels to ems is pointless. Use ems where you need something to scale with the font size of the component, rems for something that scales with the base font-size and pixels where you need an absolute value that doesn’t depend on the font-size whatsoever etc. Different units have different purposes. </blockquote>
Lea Verou makes a good point.
- Firefox 4: OpenType font feature support hacks.mozilla.org
Some excellent live examples.
Icon fonts have a few nasty problems that icon font makers rarely make you aware of. Here’s a few of these problems...
- The New CSS3 Relative Font Sizing Units sitepoint.com
- Easy-peasy Rem Conversion with Sass stubbornella.org
- On ems and rems | Filament Group, Inc., Boston, MA filamentgroup.com
rems and ems serve different purposes and need not be mutually exclusive; both can be very useful in the same CSS layout, depending on what you’re trying to do
- WebINK Web Fonts webink.com
- A Closer Look At Font Rendering | Smashing Magazine smashingmagazine.com
Now that we have a great choice of fonts that can be used on websites, it becomes clear that the translation of a design into pixels is not something that happens naturally or consistently. OS makers apply different strategies to render how typefaces are displayed, and these have evolved greatly over time (and still continue to do so). As we now look closer at fonts on screen more than ever before, we realize that the rendering of these glyphs can differ significantly between systems and font formats. What’s more, it has become clear that even well-designed fonts may not look right on Windows if they are missing one crucial added ingredient: hinting.
Great review of @font-face performance by Dave Artz: http://t.co/CqPOUaBY
- font dragr | Drag and drop font testing fontdragr.com
Test custom fonts in the browser.
Easy to forget.
- Default Font Smoothing On Windows « Typblography blogs.adobe.com
With a nice table included.
- Font-Embedding Icons somerandomdude.com
Not entirely convinced. See related HN discussion.
- Better web font loading with JavaScript « The Typekit Blog blog.typekit.com