Editorial Craft Bible
Portada y preliminares
Inicio Estructura del documento Portada y preliminares
Estructura del documento

Portada y preliminares

11 reglas W3C CSS Paged Media · Paged.jsChicago Manual of Style · thebookdesignerW3C CSS Paged Media · Chicago Manual of StyleBringhurst · refactoringui
19

Portada y preliminares

11 reglas
200

Aísla la portada con break-after: page y sin elementos corrientes

La portada es una pieza aparte: ciérrala con break-after: page para que el cuerpo arranque en hoja nueva, y suprime el folio y el encabezado/pie corrientes con @page :first. Un número de página o un título de capítulo colado en la portada es la señal más clara de un PDF amateur.

@page :first { margin: 0; @top-center { content: none } @bottom-center { content: none } }
.cover { break-after: page }
Correcto
3
Portada sin folio; el cuerpo empieza a numerar
Evitar
Titulo del reporte
1
Folio y encabezado corriente colados en la portada
W3C CSS Paged Media · Paged.js
201

Ordena los preliminares en su secuencia canónica

Los preliminares tienen un orden fijo: portadilla, portada completa, créditos/colofón, dedicatoria, índice y luego el cuerpo. Saltarse o barajar estas páginas se lee como descuido; cada una tiene su función y su posición convencional antes de la página 1 del texto.

Correcto
Portadilla
Portada
Créditos
Índice
Portadilla, portada, créditos, índice, luego cuerpo
Evitar
Portada
Índice
Créditos
Créditos tras el índice, sin portadilla
Chicago Manual of Style · thebookdesigner
202

Numera los preliminares en romano y reinicia arábigo en el cuerpo

Los preliminares llevan romano en minúscula (i, ii, iii); el cuerpo reinicia en arábigo 1 en su primera página. En CSS Paged Media reinicia el contador al abrir el cuerpo, o en Paged.js gobiérnalo con una página nombrada para la sección preliminar. Así los folios impresos concuerdan con el índice.

@page front { @bottom-center { content: counter(page, lower-roman) } }
.body:first-of-type { counter-reset: page 1 }
Correcto
ii
iii
1
Romano en preliminares, arábigo 1 abre el cuerpo
Evitar
2
3
4
Arabigo corrido cuenta la portada como 1
W3C CSS Paged Media · Chicago Manual of Style
203

Construye la jerarquía: título dominante, marca y fecha subordinados

Un elemento debe ganar claramente: el título, el más grande. Subtítulo, autor o marca, y fecha bajan en tamaño y peso para que el ojo aterrice en orden. El equilibrio óptico gana a centrar por matemática: sube el bloque un poco sobre el centro geométrico para que no se vea bajo.

Correcto
Saltos claros: título, subtítulo, marca
Evitar
Todo a un tamaño, ningún elemento guía
Bringhurst · refactoringui
204

Usa la retícula: coloca con tensión y aire, no centres por defecto

Una portada editorial cuelga sus elementos de la misma retícula que el interior: título alineado a una columna, marca fijada a un margen, espacio en blanco generoso. Centrar todo al medio es el default seguro que se lee genérico. La asimetría con un borde de alineación fuerte se siente intencional.

Correcto
Marca arriba, título anclado a la columna base
Evitar
Todo apilado al centro exacto, sin retícula
Josef Müller-Brockmann · thinkingwithtype
205

Da su sangrado de 3mm a la imagen de portada full-bleed

Si el arte o la tinta de la portada llega al borde, debe extenderse 3mm (0.125in) más allá del trim, igual que cualquier elemento a sangre, más print-color-adjust: exact para que el motor conserve el color. Pon @page :first { margin: 0 } y coloca el texto seguro como padding de un contenedor interno para que la tolerancia de guillotina nunca deje filo blanco.

Correcto
La imagen entra en la trama de sangrado tras el trim
Evitar
El arte se detiene en el trim; un corte deja blanco
Adobe print guidelines · W3C CSS Paged Media
206

Diseña contraportada y solapas con su propio contenido

En piezas impresas la contraportada y las solapas llevan contenido definido: sinopsis y código de barras/ISBN atrás, bio del autor y una cita destacada en las solapas. Trátalas como páginas diseñadas, no como sobras; una contra pelada o una solapa vacía desperdicia un espacio que el lector sí mira.

Correcto
Sinopsis y código/ISBN llenan la contraportada
Evitar
Contraportada en blanco, sin sinopsis ni ISBN
thebookdesigner · Bowker ISBN
207

Registra el colofón: fuente, versión, fecha y licencia

Un colofón o página de créditos declara las tipografías usadas, la versión del documento, la fecha y la licencia o copyright. En libros va en la página de créditos (verso de la portada); en reportes y decks, como bloque pequeño al pie. Hace el PDF auto­documentado y zanja las dudas de reuso antes de que surjan.

Compuesto en Source Serif 4 e Inter
Versión 1.2 · 2026-07-17
CC BY-NC 4.0
Correcto
Fuente, versión, fecha y licencia registradas
Evitar
Sin créditos: versión y licencia desconocidas
Chicago Manual of Style
208

Haz que la portada anticipe el sistema del interior

La portada es una promesa del sistema visual interior: el mismo color de acento, la misma familia tipográfica y la misma lógica de espaciado deben reaparecer en el cuerpo. Una portada que no se parece a su interior se siente pegada. Lleva un elemento firma (un filete, una banda de color, la tipografía del título) hasta las primeras páginas.

Correcto
El mismo filete de acento sigue en el interior
Evitar
Portada llamativa, interior plano y ajeno
refactoringui · Bringhurst
209

Patrón de portada de reporte: marca arriba, título abajo, mucho aire

Para reportes y decks el patrón editorial confiable es: logo o marca fijados al margen superior, título anclado cerca del tercio inferior y mucho espacio vacío entre ambos. Resiste llenar el hueco; el aire es lo que señala un documento cuidado. Añade fecha y autor como línea pequeña bajo el título.

Correcto
Marca arriba, título abajo, aire entre ambos
Evitar
Todo apretado al centro, sin aire
refactoringui · thinkingwithtype
210

Mantén la información crítica de la portada fuera de la zona de corte

El título, el logo y cualquier línea imprescindible quedan al menos a 3 a 5mm dentro del trim, en la zona segura, sin tocar nunca el borde. La tolerancia de guillotina de unos +-1mm puede rebanar lo que se coloque muy cerca. En una portada full-bleed esto significa que el fondo sangra pero la tipografía se queda holgada dentro del margen seguro.

Correcto
Título dentro de la zona segura punteada
Evitar
El título se sale al corte fuera de la zona segura
Adobe print guidelines · Ghent Workgroup