A fines del año pasado, hubo un error en el que las fuentes del sistema (al menos en Mac, no sé cuál era la historia en otras plataformas) en Chrome parecían demasiado delgadas y rastreadas en tamaños pequeños y demasiado gruesas y rastreadas en tamaños más grandes. Ese fue arreglado, afortunadamente. Pero si bien fue un problema, fue la razón por la que Renunció en las fuentes del sistema por ahora y cambió algo más. Una pérdida de rendimiento pero una ganancia estética.
Ahora hay un nuevo error mucho peor, donde la fuente del sistema no puede estar en negrita. No es genial, ya que muchos sitios funcionan con la pila de fuentes del sistema, ya que tiene dos beneficios principales: 1) puede ayudar a que su sitio se vea como el sistema operativo 2) tiene un gran rendimiento ya que el sitio no necesita descargar / visualización y fuentes personalizadas.
Jon Henshaw lo escribió:
… el error llamó la atención de Adam Argyle, creador de VisBug y Chrome CSS Developer Advocate en Google. Argyle creó un informe de error de Chromium, pero el equipo de desarrollo de Chromium finalmente decidió que no era un bloqueador para el lanzamiento de la versión 81. Eso resultó en que sitios como Coywolf no pudieran usar texto en negrita para fuentes de más de 16 px (por ejemplo, cada encabezado ).
El error no se corregirá en la versión 82 porque el equipo de Chromium anunció que lo omitirán y, en su lugar, lanzará la versión 83 a mediados de mayo. Argyle aseguró a todos en el informe de error original de GitHub que se solucionaría en la versión 83.
Arriba está el sitio de Jon. El sitio de Andy Bell también se vio afectado.
Así que estamos viendo 4 semanas más o menos. Šime Vidas propuso una solución temporal para ir a Helvetica por ahora:
body {
font-family: -apple-system, Helvetica;
}Supongo que con -apple-system ¿Allí, las versiones anteriores de Chrome / macOS aún podrían beneficiarse de las fuentes del sistema? No estoy seguro.
Eso me genera confusión. Cuando escuché por primera vez sobre el uso de pilas de fuentes del sistema, había -apple-system y BlinkMacSystemFont y se suponía que debías usarlos en ese orden en la pila de fuentes. Luego vino -system-ui, y eso parecía funcionar bien por sí solo y eso era bueno, ya que obviamente era menos específico de Mac. Pero tambien hay system-ui (sin guión inicial), y eso parece hacer lo mismo y no estoy seguro de cuál es la correcta. Ahora parece que el plan es ui-sans-serif y amigos (como ui-serif y ui-monospace). Me gusta la idea, pero me encantaría escuchar la claridad de los proveedores de navegadores sobre cuál es el uso recomendado. ¿Estamos en un lugar como este?
/* Just a guess... */
body {
font-family:
ui-sans-serif,
system-ui,
-system-ui,
-apple-system,
BlinkMacSystemFont,
Roboto, Helvetica, Arial,
sans-serif,
"Apple Color Emoji";
}Otra observación mía … mientras intentaba replicar esto en Chrome 81, al principio estaba como “raro, funciona para mí”, porque estaba probando el texto en negrita en 16px por defecto. Me di cuenta de que era cuando la fuente era de 20px o más, el problema se activaba:
Bramus tiene una idea de solución alternativa: use Inter.