Exportar Markdown a PDF desde el navegador
Hay dos maneras de que un navegador produzca un PDF a partir de una página web, y no son igual de buenas.
La primera es representar la página como una imagen y envolver esa imagen en un PDF. Las bibliotecas que hacen esto son fáciles de añadir, y el resultado es un archivo donde el texto ya no es texto: no puedes seleccionarlo, ni buscarlo, ni copiar una línea, y el archivo pesa varias veces más de lo necesario.
La segunda es imprimir la página y elegir «Guardar como PDF» como destino. El navegador compone el documento para papel, respeta la hoja de estilos de impresión y escribe texto vectorial real. Cuesta un clic más y produce un archivo genuinamente mejor, así que eso es lo que ocurre aquí cuando pulsas Guardar como PDF.
Los cuatro ajustes que importan
Todo lo que sigue está en el diálogo de impresión, no en la página, porque ninguna hoja de estilos puede fijarlo.
Destino: Guardar como PDF. No una impresora física.
Gráficos de fondo: activados. Está en Más ajustes y es el que más gente se salta. Con esto desactivado el navegador descarta todos los rellenos de fondo: los bloques de código pierden su sombreado, los encabezados de tabla se quedan en blanco, y un PDF con tema oscuro sale como papel blanco con texto blanco encima, lo que parece una exportación rota y no un ajuste.
Encabezados y pies de página: desactivados. Esa opción es el navegador añadiendo la URL de la página y la fecha por su cuenta. Si has puesto tu propio encabezado o pie, los dos chocan. Desactiva el del navegador y conserva el tuyo, o haz lo contrario si quieres números de página, algo que se explica más abajo.
Escala: 100 % o Predeterminada. «Ajustar a la página» reescala la tipografía y descuadra los márgenes, y los márgenes son de lo que depende el espacio del encabezado y el pie.
Por qué a veces desaparece el control de Escala
Si un documento declara un tamaño de papel fijo, Chrome da el papel por decidido por el autor y esconde el control de Escala por completo. No es un error del navegador ni de la página: es la consecuencia de que el documento sea específico.
Así que el papel es una elección: A4, Carta o Predeterminado de la impresora. Las dos primeras piden un tamaño y pierdes la Escala. La tercera no pide nada y la Escala vuelve. Los márgenes los fija el documento en los tres casos, así que un encabezado o un pie conserva su espacio en cualquiera de ellos.
Encabezados y pies repetidos
Un encabezado repetido aparece en todas las páginas. En un navegador esto se hace con un elemento de posición fija, que según la especificación se repite en cada hoja de un medio paginado.
Lo sutil es reservarle espacio. El enfoque obvio — relleno en la parte superior del cuerpo del documento — reserva espacio una sola vez, porque el cuerpo es una única caja por muchas páginas que ocupe al imprimirse. Funciona en la página uno y a partir de la dos el encabezado se sienta encima del texto.
La solución es reservar el espacio en el margen de @page, que se aplica por página, y
colocar la barra dentro de ese margen con un desplazamiento negativo. Eso es lo que hace la
zona de sellado, y ensancha el margen solo en el borde que realmente lleva una barra.
Cada uno de los cuatro campos — encabezado izquierda, encabezado derecha, pie izquierda, pie derecha — acepta el texto que quieras, más unos comodines que se rellenan al imprimir:
{title}— el primer título o la primera línea del documento{date},{time},{datetime}— cuándo se hizo el PDF
Sin números de página, y por qué
A propósito no hay comodín {page}. Contar páginas dentro de un elemento repetido no es
algo que un navegador pueda hacer: counter(page) solo se resuelve dentro de las cajas de
margen de @page, y ningún navegador importante las implementa. Un comodín que imprimiera
silenciosamente nada sería peor que no tener comodín.
Si necesitas números de página, la propia opción de encabezados y pies del navegador los añade. Usa eso en lugar de un sello, o acepta los dos y déjalos en bordes opuestos.
PDF oscuros
La opción oscura invierte la página — papel negro, tinta blanca — y deja los demás colores en paz. Con una excepción deliberada: el color de los enlaces se aclara, porque el azul del tema claro queda a unos 2,5:1 contra el negro y es ilegible. Conserva su tono y gana contraste.
Acuérdate de los gráficos de fondo. Un PDF oscuro impreso sin ellos es una página en blanco.