#fonts (134 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
- Geist Font — Vercel vercel.com
Geist embodies our design principles of simplicity, minimalism, and speed, drawing inspiration from the renowned Swiss design movement.
Forked from Inter, apparently
- 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.
Via ttscoff.
- 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
- Inter font family rsms.me
Inter is a typeface carefully crafted & designed for computer screens.
Via monospaced.
- A Variable Fonts Primer variablefonts.io
- Variable fonts: What brands need to know | Monotype. monotype.com
- Recursive Sans & Mono recursive.design
A highly-flexible new variable font. Built to maximize versatility, control, and performance, Recursive is a five-axis variable font. This enables you to choose…
- Font style matcher meowni.ca
- Introducing OpenType Variable Fonts medium.com
- Font Testing Page impallari.com
- impallari/Font-Testing-Page github.com
A webpage for testing typefaces, live at www.impallari.com/testing
This is sort of a response to Adam “ @mrmrs_ ” Morse’s “ Webfonts .” It’s not a rebuttal by any means, but rather a collection of my own thoughts that at least…
- 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
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.
- State of Web Type stateofwebtype.com
Up-to-date data on support for type and typographic features on the web.
- Fixed Monospace Sizing meyerweb.com
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.
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.
Lea Verou makes a good point.
- Firefox 4: OpenType font feature support hacks.mozilla.org
Some excellent live examples.
- The New CSS3 Relative Font Sizing Units sitepoint.com
- Bulletproof Accessible Icon Fonts | Filament Group, Inc., Boston, MA filamentgroup.com
- Easy-peasy Rem Conversion with Sass stubbornella.org
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
- 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
Test custom fonts in the browser.
Easy to forget.