Paul Irish
Las Herramientas para desarrolladores de Chrome ahora pueden decirte exactamente qué tipo de letra se usa para renderizar texto.
Las pilas de fuentes son una cosa divertida, más una sugerencia que una demanda. Como es posible que la familia que sugieres no esté presente, permites que el navegador de cada usuario controle el caso de resguardo, extraiga algo que funcione y lo use.
font-family: Baskerville, "Baskerville Old Face", "Hoefler Text", Garamond, "Times New Roman", serif;
Como desarrollador, quieres saber qué fuente se está usando. A continuación, le indicamos cómo funciona:
En Estilos calculados, ahora verás un resumen de los tipos de letra que se usaron para ese elemento. Ten en cuenta lo siguiente:
- Herramientas para desarrolladores informa el tipo de letra real que usa la capa de renderización de texto de Chrome. Ya no es necesario adivinar a qué fuente
serifosans-serifse resuelve. - ¿Funciona mi fuente para sitios web? A veces, es difícil saber si estás viendo la fuente web o la fuente del sistema de resguardo. Ahora puedes verificar que se aplique la fuente web. En el ejemplo anterior, extraemos Lobster como un tipo de letra web para el estilo
::first-line. - Las fuentes repetidas de tu pila son fáciles de detectar. Arriba, teníamos un error tipográfico que escribía Merriweather, por lo que no se usó y se pasó a Lobster.
- ¿Es Arial o Helvetica? Pregúntale a un diseñador o… a DevTools. ;)
- Funciona muy bien con fuentes web de Google, Typekit, fuentes locales, tipos de letra @font-face, glifos Unicode y todas las demás fuentes de fuentes interesantes.
Disfrútalo y deja un comentario si tienes alguna sugerencia.