G188Ofrecer un botón para aumentar el interlineado y el espacio entre párrafos

Por qué es importante

Un texto con las líneas muy juntas cuesta de leer. Es fácil saltarse una línea o leer la misma dos veces.

• Ayuda a personas con dislexia, con discapacidad intelectual o con problemas de atención.
• También ayuda a personas mayores y a quien tiene baja visión.

Es útil en páginas con mucho texto: bases de una convocatoria, noticias, normativa o condiciones de un servicio.

Cómo se hace

1. Ponga un botón o un enlace visible al principio de la página, con un texto claro: «Aumentar el espacio entre líneas».
2. Al activarlo, aplique una hoja de estilos o una clase que suba line-height a 1,5 como mínimo.
3. Aumente también el margen entre párrafos, para que siga siendo mayor que el espacio entre líneas.
4. Compruebe que el texto no se corta ni se solapa con el nuevo espaciado.
5. Si puede, recuerde la elección del usuario al pasar a otras páginas.

Cómo comprobarlo

1. Busque en la página un botón o un enlace que diga que aumenta el espaciado del texto.
2. Actívelo con el ratón y con el teclado.
3. Con las herramientas del navegador (F12), mire en un párrafo el valor de line-height: debe ser 1,5 o más.
4. Compruebe que el espacio entre párrafos es al menos 1,5 veces el espacio entre líneas.

Ejemplo

Un botón añade una clase a la página y esa clase aumenta el interlineado y el margen entre párrafos.

<button type="button" id="espaciar">Aumentar el espacio entre líneas</button>

<style>
  .espaciado p { line-height: 1.6; margin-bottom: 2.6em; }
</style>

<script>
  document.getElementById('espaciar').addEventListener('click', function () {
    document.body.classList.toggle('espaciado');
  });
</script>