Justificar a mano, ahora a 35 columnas

Read in English

Hace poco leí I just chose words carefully, de Marcin Wichary, y me fascinó. Va sobre cómo construir a mano un justificado perfecto, eligiendo las palabras adecuadas para ajustarlas a los 79 caracteres que imponía la terminal.

Entonces se me quedó una pregunta rondando la cabeza: si hoy leemos en móviles, ¿cuál sería la anchura equivalente?

El cálculo para móvil

Tomando los anchos de viewport típicos en píxeles lógicos y restando unos 16 px de margen a cada lado:

Dispositivo Ancho útil A 16px A 14px
Android pequeño (360) 328 px ~34 ~39
iPhone 15/16 (393) 361 px ~37 ~43
Pixel (412) 380 px ~39 ~45
Pro Max (430) 398 px ~41 ~47

El sucesor directo del "79 columnas" es hoy de unos 35 a 40 caracteres a tamaño de lectura cómodo (16px), o 40 a 47 si bajas a 14px como en los bloques de código.

Aquí encajan las dos mitades. El ancho físico de un móvil, esos 35 a 40 caracteres monoespaciados, cae casi exactamente sobre el mínimo del rango de legibilidad (30 a 40 CPL).

Una demo

Cada línea mide exactamente 35 caracteres, cortada eligiendo las palabras, sin rellenar con espacios. El mismo método, a la nueva anchura.

Captura en móvil de la demo: un bloque de texto monoespaciado en inglés con cada línea a 35 caracteres exactos y el margen derecho pegado a una guía punteada

El HTML que lo muestra fija el contenedor a 35ch y respeta los cortes con white-space: pre, para que el navegador no toque la justificación hecha a mano:

<pre class="text">I chose every word with utmost care
so that each line came out flush on
the right. No program, no tricks at
all, just the right words in a row.</pre>
pre.text {
  width: 35ch;
  font-family: "SF Mono", "Menlo", monospace;
  font-size: 16px;
  white-space: pre;   /* respeta el corte a 35 exacto */
}

A 16px, esos 35ch ocupan unos 336 px, así que entran de sobra en cualquier móvil en vertical. Ábrelo en el teléfono y verás el margen derecho perfectamente recto, sin un solo espacio de relleno.

Adapté al inglés el inicio del Quijote con el mismo método, ayudándome de una IA (¡modificar el texto original es un sacrilegio!). Ábrela en tu móvil y desplázate para ver cómo el margen derecho aguanta recto párrafo tras párrafo.

Divertido, ¿no crees?

Fuentes

  • I just chose words carefully, de Marcin Wichary en su serie Unsung: la historia de rs1n y el justificado a mano en texto monoespaciado.
  • Readability: The Optimal Line Length, Baymard: el rango cómodo de caracteres por línea y por qué importa.
  • Line length, Wikipedia: la regla de Bringhurst (45 a 75, con 66 como óptimo) y las cifras clásicas.
  • UI Typography: Line length, Imperavi: las mismas recomendaciones aplicadas a interfaz.
  • Dyson & Haselgrove, Optimal Line Length in Reading: el punto dulce hacia los 55 caracteres por línea.

Help me keep writing

Every coffee gives me a push toward the next article.

Comments

There are no comments yet.

You may also like