En el artículo anterior de introducción a esta serie dedicada a la maquetación de poemas en EPUB, se había introducido una técnica para evitar la partición (ni por palabras ni por sílabas) de los versos de una estrofa, mediante la añadidura de una propiedad CSS a tal efecto. De este modo es posible asegurar que el reflujo del texto dentro del e-reader (al cambiar el tamaño del cuerpo del texto) no rompa los versos del poema de ninguna manera, preservando entonces la disposición visual de los mismos y facilitando entonces la lectura e identificación de la métrica del poema.
Sin embargo, la contrapartida es que el texto de dichos versos puede acabar desbordándose por el margen derecho de la pantalla, quedando por lo tanto invisible para la lectura.
En esta segunda parte vamos a abordar tres técnicas adicionales de control de versos y estrofas. De este modo dispondremos de más recursos a la hora de abordar el problema de cómo queremos que se visualicen nuestros poemas en EPUB una vez que éstos refluyan por la pantalla del e-reader (o tableta, o smartphone claro está):
He aquí de nuevo un ejemplo de poema maquetado en Adobe InDesign CC. Se trata de una Rima de Gustavo Adolfo Bécquer, donde al igual que en el ejemplo del artículo de introducción, se ha limpiado el texto original de tal modo que cada estrofa es un solo párrafo y cada verso está separado por saltos de línea forzados.:
+18.58.23.png)
En una de las estrofas de esta rima, aparece al final un verso suelto con una sangría diferenciada:
Aquí la persona que en su día transcribió este verso recurrió a acumular caracteres de espacio en blanco para implementar dicha sangría. Lógicamente existen otras formas de hacer esto, tanto en maquetación fija para papel como en maquetación fluida para dispositivos electrónicos. Sin embargo esta forma de sangrar nos sirve como ejemplo para conocer qué sucede con toda esta ristra de espacios en blanco una vez exportamos este documento a EPUB.
InDesign añade todos esos espacios en blanco en el código, pero lo hace como caracteres básicos no como entidades HTML de espacio de no separación, que sería interpretable por el lector ADE, así que obtenemos este resultado:
donde se puede apreciar claramente que desapareció la sangría. El código HTML generado sería el siguiente (el estilo de párrafo de las estrofas en este caso se llama ‘estrofa’):
el espacio en blanco que se ve antes del verso de «Tal es la inspiración» son dichos espacios en blanco —copiados y pegados desde el código en Dreamweaver— pero que el lector lógicamente ignora, al igual que lo haría un navegador web.
Una forma sencilla de que el e-reader respete literalmente el formato manual de una estrofa, fabricada a golpe de saltos de línea, espacios o tabulaciones, para disponer los versos de una manera peculiar determinada, es establecer una equivalencia entre un estilo de párrafo de InDesign y una etiqueta HTML específica que respete esos formato manual. Una opción podría ser dedicar un estilo de párrafo específico a esas estrofas y, en la definición de dicho estilo en InDesign, asignarle manualmente la etiqueta reservada para texto preformateado en la opción ‘Etiquetas de exportación’:
Al hacerlo, el aspecto visual a base de formatear añadiendo espacios se preserva en el lector. Sin embargo, al igual que cuando forzábamos la no partición de los versos, si aumentamos demasiado el texto, éste se acaba perdiendo por el margen derecho de la pantalla:
El código HTML equivalente que exportaría InDesign para este estilo de párrafo específico sería el siguiente:
donde se emplea la etiqueta «pre» en lugar de la de párrafo «p».
Otro asunto pendiente es la separación de las estrofas en páginas. En este caso, la rima consta de estrofas compuestas por cuatro versos cada una (excepto las que tienen ese ‘verso suelto’ extra, que tienen cinco). En la imagen anterior se puede observar que al final aparece, solitario, el primer verso de la siguiente estrofa. Esto es fruto del reflujo de texto, que va rellenando «pantallas» a medida que vamos cambiando el tamaño del mismo o, en el caso de ADE para ordenadores, también el tamaño de la ventana del software.
Si no queremos que esto ocurra, podemos optar por varias soluciones:
1) Desde el mismo InDesign, podemos editar el estilo de párrafo de las estrofas, y ahí en Opciones de Separación, activar la opción de «Conservar todas las líneas juntas» de cada párrafo de ese estilo:
Este cambio tiene un doble efecto: además de conseguir que las estrofas no se dividan en la paginación que hace el e-reader al refluir el texto, también hace lo propio en las páginas del documento de InDesign. Al exportar dicho documento a EPUB, InDesign consigue este efecto modificando la propiedad CSS orphans (huérfanas) de este modo:
orphans:99;
2) Dejando intacto el estilo de párrafo en InDesign, una vez exportado el EPUB podemos editar la hoja de estilos CSS que éste genera, y modificar allí el estilo de las estrofas añadiendo una propiedad adicional: display: inline-block;
con Adobe Dreamweaver es sencillo retocar el código CSS con precisión con la ayuda de la opción de autocompletar dicho código mientras se escribe. Aquí en la última línea de CSS se añade la opción «display: inline-block» de esta manera.
De este modo, utilizando cualquiera de estos dos métodos, al visualizar el poema en el lector tipo ADE, el poema sólo puede leerse en estrofas completas y no partidas, aunque se induzca el reflujo de texto cambiando el tamaño de la ventana o el cuerpo del texto, como se puede apreciar en el siguiente vídeo:
Sin embargo, y ya para finalizar, se puede observar que todavía los versos pueden partirse por sílabas. Si no queremos que se produzca ese efecto, es posible hacerlo, pero tendremos que recurrir a editar levemente el código CSS si queremos que surja efecto tanto en iBooks de iPad como en e-readers tipo ADE (Sony Reader, por ejemplo).
En las opciones del estilo de párrafo en InDesign, si desmarcamos la opción de Separación por sílabas, ésto tendrá efecto en el estilo CSS equivalente al exportar en EPUB de la siguiente forma:
-epub-hyphens:none;
-webkit-hyphens:none;
Sin embargo, éstas dos propiedades no funcionan en ADE. Es preciso añadir una propiedad extra específica para este tipo de lectores («adobe-hyphenate»), de tal modo que el fragmento de código CSS resultante modificado quedaría así:
-epub-hyphens:none;
-webkit-hyphens:none;
adobe-hyphenate:none;
De este modo nos aseguramos que ningún verso de las estrofas de ese estilo se partan por sílabas.
Existen otros muchos métodos para manipular los estilos CSS de un archivo EPUB de tal modo que se acomoden a nuestras necesidades de maquetación. En próximas entregas de esta serie de artículos dedicados al género de la poesía iremos desgranando algunos más.
Por lo pronto, si estás interesado/a en aprender más de estilos CSS aplicados a EPUB, te puedo recomendar mi curso en vídeo «CSS específico para EPUB» para que puedas aprender a tu ritmo y desde casa este interesante mundo:
+18.58.23.png)
+18.59.57.png)
+19.03.57.png)
+19.31.55.png)
+20.24.56.png)
+19.39.49.png)
+19.48.51.png)
+08.39.05.png)
+08.49.13.png)
+09.00.54.png)
+09.02.18.png)
+09.03.43.png)
+09.08.21.png)
+09.09.09.png)
