Creación de artículos HTML para DPS

Puede importar artículos basados en HTML en una publicación para que se puedan mostrar en el visor como un artículo. Una ventaja de los artículos HTML es que tienen un tamaño mucho menor y, por tanto, más adecuado para publicaciones semanales y artículos sencillos con mucho texto. Los artículos HTML también pueden incluir interactividad no disponible en el panel Folio Overlays.

Tutorial en vídeo

Para obtener más información sobre el uso de Adobe Edge para crear HTML para DPS, consulte el artículo de Raghu Thricovil Mejora de las publicaciones de DPS con animaciones HTML mediante Adobe Edge (en inglés).

Si va a editar archivos HTML, seleccione el artículo HTML en el panel Folio Builder y seleccione Actualizar.

Requisitos de artículos HTML

• Puede crear un solo archivo HTML que se pueda utilizar tanto con la orientación horizontal como vertical, o bien puede crear distintos archivos HTML para las dos orientaciones. Si desea utilizar varios archivos HTML para las orientaciones vertical y horizontal, añada los sufijos _v y _h al final de los nombres de archivos HTML, como “index_h.html”. Si va a crear una publicación con una sola orientación, solo necesita un archivo HTML. Incluya los sufijos _h o _v para el archivo HTML en una publicación de una sola orientación.

• Actualmente, no se admiten los archivos con HTML dinámico (DHTML).

• En el caso de la estructura de archivos, un método consiste en colocar todos los gráficos y secuencias de comandos asociados del archivo HTML en las carpetas de los distintos artículos. Otra opción consiste en colocar los gráficos y las secuencias de comandos asociados para toda la publicación en un archivo HTMLResources.zip. El archivo HTMLResources.zip debe importarse a la publicación desde el panel Folio Builder o desde Folio Producer en la Web. Consulte Importación de la carpeta HTMLResources.

  
  Ejemplo de una carpeta HTMLResources

• Asegúrese de utilizar rutas de acceso relativas en el código HTML. Si está creando un vínculo a una imagen del mismo nivel que el archivo HTML, utilice este método:

  <img src="ImagenGlobal.jpg"/>

  Si está creando un vínculo a una imagen de la carpeta HTMLResources, utilice este método:

  <img src="../HTMLResources/GlobalImage.jpg"/>

Para obtener información sobre la creación de hipervínculos a artículos HTML y desde estos, consulte Creación de hipervínculos navto para artículos HTML.

Creación de artículos HTML para visores Android

Para obtener ayuda para la creación de artículos HTML para visores Android, consulte Cómo crear artículos HTML para visores Android (en inglés).

Recursos HTML5

• Para obtener más información sobre la creación de artículos con HTML5, consulte el artículo de Johannes Henseler Marcos en HTML5 en un solo archivo (en inglés).

• Para obtener más información sobre el uso de CreateJS para crear HTML5 con Flash Pro, consulte Kit de herramientas CreateJS.

• Para obtener más información sobre las fuentes disponibles en artículos HTML y superposiciones de vista web en el iPad, consulte www.michaelcritz.com/2010/04/02/fonts-for-ipad-iphone/ (en inglés).

• Rufus Deuchler ha creado un tutorial de vídeo sobre el uso de Adobe Muse para crear contenido HTML para publicaciones digitales (en inglés).

Permitir que los vídeos en artículos HTML se comporten como superposiciones de vídeo de pantalla completa

Al crear un artículo HTML de una sola orientación con vínculos de vídeo, es posible que el vídeo rote si se rota el dispositivo. Además, cuando termina la reproducción del vídeo, el navegador integrado que reproduce el vídeo se puede descartar. Para activar este comportamiento, use el prefijo “videofile://” en el vínculo del vídeo HTML. Esta opción solo está disponible para aplicaciones de iOS.

Con este ejemplo, el vídeo se reproduce en un navegador integrado y no rota en una publicación de una sola orientación.<a href="Links/video.mp4">Ver vídeo</a>

o bien<a href="../HTMLResources/videos/video.mp4">Ver vídeo</a>

Con este ejemplo, el vídeo rota correctamente en una publicación de una sola orientación y vuelve al artículo cuando termina el vídeo.<a href="videfile://Links/video.mp4">Ver vídeo</a>

o bien<a href="videofile://../HTMLResources/videos/video.mp4">Ver vídeo</a>

También puede activar este comportamiento con JavaScript, mediante la función playFullscreenVideo en el objeto de ventana.<a onclick="window.playFullscreenVideo('Links/video.mp4');">Ver vídeo</a>

o bien<a onclick="window.playFullscreenVideo('../HTMLResources/videos/video.mp4');">Ver vídeo</a>

Este ejemplo reproduce un flujo de vídeo.<a href="videohttp://www.mysite.com/video.mp4">Ver vídeo</a>