Chrome + Fuentes del sistema Snafu

Simplemente hubo un error a fines del año pasado donde las fuentes del sistema (al menos en Mac, no sé cuál fue la historia en otras plataformas) en Chrome parecían demasiado delgadas y con seguimiento en tamaños pequeños y demasiado gruesas y con seguimiento en tamaños pequeños . tamaños más grandes. Eso se solucionó, afortunadamente. Pero si bien fue un problema, fue la razón por la que abandoné las fuentes del sistema por ahora y cambié por otra cosa. 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 utilizan la pila de fuentes del sistema, ya que tiene dos beneficios principales: 1) puede ayudar a que su sitio se parezca al sistema operativo 2) tiene un gran rendimiento ya que el sitio no necesita descargarse/ visualización y fuentes personalizadas.

Jon Henshaw lo escribió:

… el error llamó la atención de Adam Argyle, creador de VisBug y defensor de desarrolladores de Chrome CSS en Google. Argyle creó un informe de error de Chromium, pero el equipo de desarrollo de Chromium finalmente decidió que no era un obstáculo para el lanzamiento de la versión 81. Eso resultó en que sitios como Coywolf no pudieron usar texto en negro para fuentes de más de 16 píxeles (por ejemplo, cada título).

El error no se solucionará en la versión 82 porque el equipo de Chromium anunció que lo omitirán y, en su lugar, lanzarán 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.

Entonces estamos considerando unas 4 semanas más o menos. Šime Vidas propuso una solución temporal para pasar a Helvética por ahora:

body {  font-family: -apple-system, Helvetica;}

Supongo que -apple-systemallí, ¿las versiones anteriores de Chrome/macOS aún podrían beneficiarse de las fuentes del sistema? No estoy seguro.

Esto me genera una fuente de confusión. Cuando escuché por primera vez sobre el uso de pilas de fuentes del sistema, había -apple-systemy BlinkMacSystemFontse suponía que debías usarlas en ese orden en la pila de fuentes. Luego apareció -system-ui, y parecía funcionar bien por sí solo y era bueno, ya que obviamente era menos específico de Mac. Pero también hay system-ui(sin guión inicial), y parece hacer lo mismo y no estoy seguro de cuál es la correcta. Ahora parece que el plan es ui-sans-serify amigos (me gusta ui-serify ui-monospace). Me gusta la idea, pero me encantaría escuchar a los proveedores de navegadores para aclarar 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 pensé “raro, funciona para mí”, porque estaba probando la negrita en el texto predeterminado de 16 píxeles. Me di cuenta de que cuando la fuente era de 20 píxeles o más, el problema apareció:

Bramus tiene una idea alternativa: utilizar el Inter.