C14Indicar el tamaño de letra en unidades em

Por qué es importante

Muchas personas con baja visión o personas mayores necesitan letra más grande. La configuran en el navegador o usan el zoom solo de texto.

Los tamaños fijos en píxeles pueden no responder a ese ajuste. Los tamaños en em parten del tamaño elegido por la persona, así que el texto de un menú o de un formulario se agranda con todo lo demás.

Cómo se hace

1. No fije el tamaño del texto base, o déjelo en 1em.
2. Defina los demás tamaños en em: títulos en 2em, notas en 0.875em.
3. Tenga en cuenta la herencia. Un 0.8em dentro de otro 0.8em da un texto muy pequeño.
4. La unidad rem, que se calcula siempre sobre el tamaño de la página, también crece con el ajuste y evita ese efecto de herencia.
5. Use también em en alturas y márgenes de las cajas con texto, para que no se corte al ampliarlo.

Cómo comprobarlo

1. Con las herramientas del navegador (F12), revise que font-size va en em.
2. En Firefox, active «Ampliar solo el texto» (menú Ver, Zoom) y amplíe hasta el 200 %.
3. Compruebe que todo el texto crece y que nada se corta ni se solapa.

Ejemplo

Tamaños de letra en em para la página de un trámite.

h1 { font-size: 2em; }
h2 { font-size: 1.5em; }
strong { font-size: 1.1em; }
.ayuda { font-size: 0.875em; }