Exportación de contenido a HTML | CS6 y CS5.5

La exportación a HTML es una forma sencilla de optimizar su contenido de InDesign para Internet. Al exportar contenido como HTML, puede controlar el modo de exportación del texto y las imágenes. InDesign conserva los nombres de los estilos de párrafo, carácter, objeto, tabla y celda que se aplican al contenido exportado marcando el contenido HTML con clases de estilos CSS del mismo nombre. Si utiliza Adobe Dreamweaver o un editor HTML compatible con CSS, puede aplicar rápidamente el formato y la maquetación al contenido.

InDesign exporta todos los artículos, gráficos vinculados e incrustados, archivos de películas SWF, notas al pie de página, variables de texto (como texto), listas numeradas y con viñetas, referencias cruzadas internas e hipervínculos que llevan al texto o a páginas web. También se exportan las tablas, pero no se exportan determinados formatos, tal como contornos de celdas y tablas. Las tablas reciben ID exclusivos para que se pueda hacer referencia a ellas como conjuntos de datos Spry en Dreamweaver. Los archivos de audio y vídeo H.264 colocados se adjuntan a las etiquetas HTML5 de <audio> y <video>.

InDesign no exporta objetos dibujados (tales como rectángulos, óvalos y polígonos), hipervínculos (salvo los vínculos a páginas web y los vínculos aplicados a textos que saltan a anclajes de texto en el mismo documento), objetos pegados (incluidas las imágenes pegadas de Illustrator), texto convertido en contorno, etiquetas XML, libros, marcadores, glyphlets SING, transiciones de página, marcadores de índice, objetos de la mesa de trabajo que no están seleccionados y no tocan la página o elementos de página principal (a no ser que se hayan omitido o seleccionado antes de la exportación).

Se crea un documento con el nombre especificado y una extensión .html (por ejemplo, “boletín.html”) y, en la misma ubicación, si se indica, se guarda una subcarpeta de imágenes web (por ejemplo, “imágenes-web-boletines”).

En el cuadro de diálogo HTML, especifique las opciones siguientes.

Opciones generales

En el área General se incluyen las siguientes opciones.

Determina si solo se exportan los elementos seleccionados o todo el documento. Si se selecciona un marco de texto, se exporta todo el artículo, incluido el texto desbordado.

Si se selecciona Documento, se exportan todos los elementos de página de todos los pliegos, excepto los elementos de página principal que no se han ignorado y los elementos de página de las capas invisibles. También se pasan por alto las etiquetas XML y los índices y tablas de contenido.

permite especificar el orden de lectura de los objetos de la página.

Según maquetación de página

La ubicación de los elementos en la página determina el orden de lectura.

Si se selecciona Según maquetación de página, InDesign determinará el orden de lectura de los objetos de la página mediante una búsqueda de izquierda a derecha y de arriba abajo. En algunos casos, especialmente en documentos complejos de varias columnas, puede que los elementos de diseño no aparezcan en el orden de lectura deseado. Utilice Dreamweaver para reorganizar y dar formato a los contenidos.

(Solo para las versiones de Asia) Si se selecciona Según maquetación de página, InDesign determinará el orden de lectura de los objetos de la página según la encuadernación del documento (de izquierda a derecha o de derecha a izquierda). En algunos casos, especialmente en documentos complejos de varias columnas, puede que los elementos de diseño exportados no aparezcan en el orden de lectura deseado. Utilice Dreamweaver para reorganizar y dar formato a los contenidos.

Igual que la estructura XML

Si se selecciona Igual que estructura XML, el panel de estructura XML controla el orden del contenido exportado y el contenido que se exporta. Si el contenido ya está etiquetado, puede limitarse a arrastrar las etiquetas en el panel de estructura XML para establecer el orden de exportación de XHTML. Si el contenido no está etiquetado, puede seleccionar Añadir elementos no etiquetados en el menú del panel Estructura para generar etiquetas que puede reordenar. Si no desea incluir un elemento en la exportación, puede eliminar la etiqueta del panel de estructura XML. (Al eliminar una etiqueta no se elimina el contenido del archivo INDD). Consulte Etiquetado de elementos de página.

Igual que el panel Artículos

El orden de los elementos en el panel Artículos determina el orden de lectura. Solo se exportarán los artículos seleccionados. Consulte Selección de artículos para exportación

Especifique un margen simple en ems o píxeles. Especificar márgenes en ems es mejor para la compatibilidad en diferentes monitores. El mismo valor se aplica a todos los márgenes (superior, inferior, izquierdo y derecho).

Seleccione Asignar a lista sin ordenar para convertir párrafos con viñetas en elementos de lista, a los que se le da el formato HTML mediante la etiqueta <ul>. Seleccione Convertir a texto para dar formato mediante la etiqueta <p> con caracteres de viñetas como texto. Si ha utilizado viñetas automáticas nativas de InDesign, también se incluirán las viñetas de segundo nivel (subviñetas).

Determina cómo se convierten los números en el archivo HTML. Si ha utilizado la numeración automática nativa de InDesign, también se incluyen las viñetas de segundo nivel (subviñetas).

Convierte listas numeradas en elementos de lista, a los que se les da el formato HTML mediante la etiqueta <ol>.

Convierte listas numeradas en elementos de lista, pero asigna un atributo <value> de acuerdo con el número de párrafo actual en InDesign.

Convierte listas numeradas en párrafos que comienzan con el número de párrafo actual como texto.

Abre el navegador, si lo hay.

Opciones de Imagen

especifica cuántas imágenes se exportarán a HTML.

Exporta la imagen original a la subcarpeta “<nombre_documento>-web-images”. Cuando se selecciona esta opción, todas las demás opciones se atenúan.

Le permite cambiar configuraciones para determinar cómo se exporta la imagen.

En lugar de exportar imágenes a una subcarpeta, esta opción le permite introducir una URL local (por ejemplo “imágenes/”) que aparece delante del archivo de imagen. En el código HTML, el atributo de vínculo muestra la ruta y la extensión que se indique. Esta opción es especialmente efectiva cuando se convierten imágenes en imágenes compatibles con la web.

Marque la casilla de verificación para que se hereden de la maquetación los atributos de objeto de las imágenes.

Especifique la resolución de las imágenes en píxeles por pulgada (ppp). Si bien los sistemas operativos se han estandarizado en 72 ppp o 96 ppp, los dispositivos móviles varían desde 132 ppp (iPad) a 172 ppp (Sony Reader) hasta más de 300 ppp (iPhone 4). Puede especificar un valor de ppp para cada objeto seleccionado. Las opciones para estos valores son 72, 96, 150 (valor medio para todos los dispositivos de libros electrónicos actuales) y 300.

Especifique si el tamaño de imagen debe permanecer fijo o si debe redimensionarse respecto a la página. La opción de tamaño Relativo a la página establece un valor porcentual relativo a partir del tamaño de la imagen respecto a la anchura de la página de InDesign. Mediante esta opción, se cambia la escala de las imágenes proporcionalmente respecto a la anchura del área de lectura.

Especifique la alineación de la imagen (izquierda, centro, derecha) y el espacio anterior y posterior.

Active la casilla de verificación para aplicar estos ajustes a todos los objetos anclados.

Permite elegir si las imágenes optimizadas del documento deben convertirse a GIF, JPEG o PNG. Elija Automático para que InDesign decida qué formato utilizar en cada caso. Si elige PNG, se desactivará la configuración de compresión de imágenes. Utilice PNG para imágenes sin pérdida o para imágenes con transparencia.

Permite controlar el modo en que InDesign administra los colores al optimizar archivos GIF. El formato GIF utiliza una paleta de color limitada, que no puede incluir más de 256 colores.

Elija Adaptada para crear una paleta con una muestra representativa de colores en el gráfico sin simulación (mezcla de pequeñas manchas de colores para simular otros colores). Elija web para crear una paleta de colores compatibles con la web que son un subconjunto de colores del sistema de Windows y macOS. Elija Sistema (Win) o Sistema (Mac) para crear una paleta con la paleta de colores integrada del sistema. Esta opción puede producir resultados imprevistos.

Seleccione Entrelazar para cargar las imágenes progresivamente, rellenando las líneas que faltan. Si no se selecciona esta opción, la imagen aparecerá borrosa y se verá cada vez más nítida a medida que se acerca a la resolución completa.

Determina el equilibrio entre la compresión (para tamaños de archivo más pequeños) y la calidad de imagen para cada imagen JPEG creada. Con el nivel bajo se crea el archivo más pequeño y la calidad de imagen menor.

Determina la rapidez con la que se visualizan los gráficos JPEG cuando se abre en la web el archivo que contiene la imagen. Elija Progresivo para que las imágenes JPEG se muestren gradualmente y con un grado de detalle creciente mientras se descargan. (Los archivos que se creen con esta opción son ligeramente mayores y requieren más RAM para visualizarlos). Elija Línea de base para que cada archivo JPEG se muestre únicamente después de que se haya descargado por completo; en su lugar aparece un marcador de posición hasta que se muestra el archivo.

Ignora las Opciones de exportación de objetos aplicadas a cada imagen. Consulte Aplicación de las opciones de exportación de objetos

Opciones avanzadas

Acceda al área Avanzado para definir opciones de CSS y JavaScript.

CSS (Cascading Style Sheets, hojas de estilo en cascada) es una colección de normas de formato que controla el aspecto del contenido de una página web. Cuando se utiliza CSS para dar formato a una página, el contenido se separa de la presentación. El contenido de la página (el código HTML) reside en el propio archivo HTML, mientras que las reglas CSS que definen la presentación del código residen en otro archivo (una hoja de estilos externa) o en el documento HTML (normalmente en la sección del encabezado). Por ejemplo, puede indicar diferentes tamaños de fuentes para el texto seleccionado y puede utilizar CSS para controlar el formato y la posición de los elementos en el bloque de una página web.

Al exportar a XHTML, puede crear una lista de estilos CSS que aparece en la sección del encabezado del archivo HTML con declaraciones (atributos).

Si se selecciona Incluir definiciones de estilo, InDesign intenta hacer coincidir los atributos del formato de texto de InDesign con los equivalentes CSS. Si se deselecciona la opción, el archivo HTML incluye declaraciones vacías. Puede editar estas declaraciones más tarde en Dreamweaver.

Si se selecciona Conservar cambios locales, se incluyen formatos locales como cursiva o negrita.

Si selecciona esta opción, se omite la sección CSS del archivo HTML.

Indique la URL de la hoja de estilo CSS externa, que normalmente es una URL relativa (por ejemplo “/estilos/estilo.css”). InDesign no comprueba si la CSS existe o es válida, así que es conveniente utilizar Dreamweaver para confirmar la configuración de la CSS externa.

Especifique CSS mediante el botón Añadir hoja de estilos.

Seleccione Vincular a JavaScript externo para ejecutar un JavaScript cuando se abra la página HTML. Indique la URL del JavaScript, que normalmente es una URL relativa. InDesign no comprueba si el JavaScript existe o es válido.

Temas relacionados

Cree y publique libros electrónicos, panfletos, folletos, postales, pósteres, diseños de páginas interactivas y mucho más con Adobe InDesign.