Editorial Craft Bible
Márgenes y retículas
Inicio Fundamentos de página Márgenes y retículas
Fundamentos de página

Márgenes y retículas

11 reglas The Elements of Typographic Style · thebookdesigner.comW3C CSS Paged Media · Adobe InDesign Facing PagesThe Elements of Typographic Style · Butterick’s Practical TypographyGrid Systems (Josef Müller-Brockmann)
02

Márgenes y retículas

11 reglas
12

Dale aire al texto: márgenes generosos

El texto necesita blanco alrededor para leerse cómodo, los márgenes apretados hacen la página pesada y difícil de escanear. En un libro trade apunta a 15–20mm por lado, y deja el margen exterior como el más ancho para que el pulgar descanse sin tapar el texto. Un margen amplio no es espacio perdido, conduce la vista y aloja notas al margen o el folio.

Correcto
Márgenes amplios enmarcan la caja de texto y descansan la vista.
Evitar
El texto pegado al borde se ve pesado y arriesga el corte.
The Elements of Typographic Style · thebookdesigner.com
13

Espeja los márgenes en documentos a doble cara

En un pliego los dos márgenes interiores se juntan en el lomo, así que una página simétrica deja el medianil pareciendo la mitad de ancho que el exterior. Define un margen asimétrico y espejado: interior (lomo) mayor y exterior cómodo, e intercámbialos en páginas izquierda y derecha. En CSS usa @page :left / :right, en InDesign activa Páginas enfrentadas para que Interior/Exterior sustituyan a Izquierda/Derecha.

@page :left { margin: 18mm 16mm 22mm 22mm }
@page :right { margin: 18mm 22mm 22mm 16mm }
/* sup exterior inf interior(lomo) */
Correcto
Los interiores más anchos evitan que el lomo se coma el texto.
Evitar
Márgenes iguales meten el texto al lomo, ilegible junto a la encuadernación.
W3C CSS Paged Media · Adobe InDesign Facing Pages
14

Ajusta el nº de columnas a la tarea de lectura

Una columna sirve para lectura corrida larga (libros, ensayos), dos o tres para revistas, newsletters e informes donde quieres una medida corta y escaneable. El factor decisivo es la longitud de línea: una sola columna ancha en A4 puede pasar de 90 caracteres y cansa la vista, así que divide en columnas para mantener cada medida cerca de 45–75. Elige el nº de columnas primero, define toda la retícula.

Correcto
Dos columnas mantienen la medida corta y escaneable en revista.
Evitar
Una columna ancha en página grande da 90+ caracteres por línea, agota.
The Elements of Typographic Style · Butterick’s Practical Typography
15

Deja un medianil real entre columnas

El medianil es el hueco entre columnas, si es muy estrecho el ojo salta a la línea equivocada y lee dos columnas como una. Usa al menos 4–6mm (aprox. un eme del cuerpo) para que las columnas se lean separadas. En CSS es column-gap, escálalo con el tamaño de letra y nunca dejes que un filete sustituya al espacio real.

.body { columns: 2; column-gap: 6mm }
Correcto
Un medianil de 6mm se lee como corte limpio entre las dos medidas.
Evitar
Un medianil de 2mm funde las líneas, el ojo cruza el hueco.
Grid Systems (Josef Müller-Brockmann)
16

Ancla el texto a una rejilla de línea base

La rejilla base es una cuadrícula invisible al intervalo del interlineado del cuerpo, alinear cada línea a ella hace que columnas contiguas y páginas enfrentadas casen línea con línea, dando ritmo vertical. Fija el paso de la rejilla al interlineado del cuerpo (ej. cuerpo 10/13pt implica rejilla de 13pt) y haz títulos y espacios múltiplos enteros de ese paso. Sin ella las columnas se desfasan y el texto trasluce descuadrado en papel fino.

Correcto
Ambas columnas sobre las mismas líneas base: casan de lado a lado.
Evitar
Interlineado distinto por columna: las líneas dejan de casar.
Grid Systems (Müller-Brockmann) · Adobe InDesign baseline grid
17

Usa retícula modular en layouts complejos

Cuando una página mezcla texto e imágenes (revistas, dashboards, catálogos), cruza las columnas con filas horizontales para que la retícula sea un campo de módulos. Los elementos se ajustan a módulos enteros, dejando que una imagen ocupe, por ejemplo, 2×2 o 3×1 celdas mientras el texto llena el resto, todo alineado. Una base editorial común es una retícula de 12 columnas subdividida en filas con el mismo medianil que las columnas.

Correcto
Imagen y texto se ajustan a módulos enteros, los bordes casan.
Evitar
Colocación libre no alinea nada, la página se ve azarosa.
Grid Systems (Müller-Brockmann) · Making and Breaking the Grid
18

Fija la caja de texto con un canon clásico

Los cánones clásicos dan proporciones de margen probadas en vez de adivinar. El canon de Van de Graaf coloca la caja de texto para que página y texto compartan la misma diagonal, dando márgenes en aprox. 2:3:4:6 (interior:cabeza:exterior:pie) y una altura de texto igual al ancho de página. Un atajo más simple es la regla de novenos: divide la página en 9, pon interior y cabeza a 1/9 y exterior y pie a 2/9. Ambos son eco de la regla de tercios, dejan la caja descentrada y cómoda.

Correcto
Márgenes 2:3:4:6 de Van de Graaf: la caja va alta y hacia fuera.
Evitar
Márgenes iguales en los cuatro lados se ven estáticos y centrados.
Jan Tschichold, The Form of the Book · Van de Graaf canon
19

Haz el pie más profundo que la cabeza

El centro óptico de una página queda un poco por encima del geométrico, así que una caja con márgenes de cabeza y pie iguales parece hundida. Dale más espacio al pie que a la cabeza, una proporción común es pie 1.5× la cabeza, que además deja sitio al folio y el pie corriente sin apretar el texto. Por eso casi todo canon clásico tiene el margen más profundo abajo.

Correcto
El pie profundo sube la caja al centro óptico y aloja el folio.
Evitar
Cabeza y pie iguales hacen que la caja parezca escurrirse.
The Form of the Book (Tschichold) · thebookdesigner.com
20

Suma tolerancia de encuadernación al margen interior

La encuadernación se come espacio interior útil: el cosido/hotmelt (lomo pegado) puede tragar 3–6mm que se curvan hacia el medianil y nunca abren plano. Suma una tolerancia de encuadernación al margen interior por encima de tu margen de diseño, más para cosido perfecto y libros gruesos, menos para grapa. Pide a la imprenta su cifra exacta, quedarte corto hace que el texto desaparezca en el lomo.

Correcto
Margen interior extra deja el texto lejos de la zona del lomo pegado.
Evitar
Sin tolerancia: los primeros caracteres se curvan al lomo, ilegibles.
Print house perfect-binding guides · thebookdesigner.com
21

Define los márgenes de impresión en mm, no en px

Los píxeles no tienen tamaño físico fijo en impresión, un margen de 48px cae en anchos distintos según el DPI de render, así que un diseño ajustado en pantalla se desvía en papel. Para todo lo que va a imprenta, expresa los márgenes en unidades físicas: mm, cm o in. En CSS Paged Media el margen de @page y el tamaño deben ser físicos, ej. margin: 18mm en una página 210mm 297mm.

@page { size: 210mm 297mm; margin: 18mm 16mm 22mm 22mm }
/* unidades físicas sobreviven a cualquier DPI de salida */
Correcto
margin: 18mm
Los milímetros dan los mismos 18mm a 72, 150 o 300 DPI.
Evitar
margin: 48px
Los px se desvían con el DPI: 48px son 17mm a 72dpi pero 4mm a 300dpi.
W3C CSS Paged Media · CSS Values and Units (absolute units)
22

Mantén los márgenes coherentes en todo el documento

Un solo sistema de márgenes debe regir cada página, cuando los márgenes cambian de página a página la caja de texto parece saltar al hojear y se rompe la sensación de un objeto único. Define los márgenes una vez (en la página maestra o la regla @page) y deja que cada página los herede. Desvíate solo con intención, una apertura de capítulo que baja la caja, una lámina a sangre, y haz que la excepción se vea deliberada, no accidental.

Correcto
Misma caja en cada página: hojear se siente como un objeto estable.
Evitar
Los márgenes bailan de página a página: la caja salta y se ve descuidada.
The Elements of Typographic Style · Adobe InDesign master pages