31 de mayo de 2010

Ven a conocer al iPad


El próximo viernes 4 de Junio, a las 18 horas en Barcelona PublicarEnDigital te invita a un pequeño encuentro con el nuevo iPad de Apple. En esta sesión mostraremos los aspectos esenciales de la publicación en digital para este soporte, en concreto el temario será:




Libros digitales:
Ejemplos de libros de la aplicación iBooks. Cuentos ilustrados. El caso de la app “Alice in Wonderland”. Otros libros de la App Store.

Prensa diaria y revistas:
Diarios digitales via web, en el iPad. El caso de Orbyt. Revistas “de papel” en el iPad con la aplicación de comercialización Zinio. Los cómics en el iPad.

El formato PDF
Legibilidad de un pdf en un iPad. El caso a estudio de la aplicación GoodReader.

La web en el iPad
Pros y contras. Qué funciona y qué no funciona. Vídeos y multimedia en el iPad. HTML5.

Qué herramientas harán falta publicar para el iPad
InDesign. HTML, CSS y Javascript. XCode.



El evento es gratuito. Eso sí, las plazas están limitadas a 14 asistentes. Así que si deseas venir, rellena cuanto antes el formulario de inscripción a la jornada.




¡Te esperamos!

25 de mayo de 2010

Páginas web ricas en tipografía

Hasta ahora uno de los hándicaps más habituales que los diseñadores gráficos se encontraban a la hora de publicar contenidos en la web era el entorno pobre en fuentes tipográficas que era la web. Era común plantear un grafismo usando, por ejemplo, Photoshop® afinando al máximo el look & feel para que posteriormente el experto en maquetación HTML nos devolviera a la cruda realidad espetándonos un árido "con esta fuente no puede ser, cámbialo todo a Arial..." o similares.


El motivo de esta barrera gráfica a la hora de presentar unos textos en la web con un aspecto adecuado estriba en que las páginas HTML en un inicio empleaban familias de fuentes tipográficas ubicadas en el ordenador del navegador del cliente, que podía ser cualquier cosa. Así, un párrafo en una página HTML venía marcado con un estilo que incluía dicha familia de fuentes, a saber:


font face="Arial, Helvetica, sans-serif" ...


Este fragmento de código HTML venía a decir que el texto a continuación se intentaba representar en fuente Arial. Si ésta no estaba disponible en el Sistema del cliente, el navegador pasaba a intentarlo con la Helvetica (más típica en Mac) y por último, empleaba el código especial "sans-serif" para utilizar la tipografía de palo seco por defecto de dicho Sistema.


Este método garantizaba una representación más o menos homogénea del texto en HTML, independientemente de la plataforma utilizada para representarlo. Pero aún así el abanico de tipografías disponible era muy escaso, y obligaba a menudo a optar por alguna de estas "soluciones":

  • Resignarse a emplear una familia tipográfica ajena al grafismo proyectado en un principio
  • Sustituir los textos por imágenes GIF, creadas con un programa de diseño gráfico, con tal de respetar el grafismo
  • Sustituir el texto HTML por texto en formato Flash (SWF)
En el segundo y tercer supuesto, el remedio podía ser peor que la enfermedad: por un lado había que asegurar de colocar un texto alternativo a las imágenes (por aquello de la accesibilidad y de la indexación del contenido correctas) y por otro lado hacía muy difícil la actualización de los contenidos.

Con la evolución del diseño web, y el nuevo paradigma de separación de los contenidos en HTML del grafismo en CSS, se abría una posible puerta a la revolución tipográfica en la web: incrustar la fuente peculiar en el código CSS a costa de subir los archivos de la fuente necesarios al servidor web.

Esta solución presentaba un problema adicional: no era posible dejar un archivo de una fuente tipográfica en un directorio del servidor web potencialmente accesible de manera pública, de tal modo que podríamos incurrir en estar distribuyendo libremente una fuente licenciada, cosa que lógicamente no se debe hacer.

pequeña muestra de algunas de las tipografías que ofrece Google Font Directory


Pues bien, parece ser que la era de la web tipográficamente pobre o repleta de parches de texto-imagen toca a su fin. Existen en la actualidad diversos servicios web que ofrecen utilizar hojas de estilos CSS vinculadas a sus servidores, donde también residen fuentes propietarias de libre uso. Google Labs por ejemplo ofrece el servicio de Google Font Directory.

Este servicio permite al diseñador web añadir vía HTML o Javascript una hoja de estilos situada en los servidores de Google, que a su vez alberga un catálogo tipográfico de libre uso. Un ejemplo de cloud computing aplicado al diseño. Si usamos ya sea el Google Font API junto con sus fuentes, o simplemente para cargar las fuentes de otro proveedor de fuentes web, será posible alcanzar diseños HTML más eficientes, donde no sea necesario sustituir texto por imágenes para alcanzar un grafismo atractivo en nuestras páginas web.


3 de mayo de 2010

Exportar de InDesign a SWF página a página

Adobe® InDesign CS4 dispone de una sencilla herramienta que permite exportar un documento (por ejemplo, un libro) ya maquetado al popular formato de "paso de página interactivo" de Flash. Esta exportación facilita mucho la tarea pero a cambio nos ofrece un archivo SWF cerrado, el cual es dificil de integrar dentro de otros sistemas similares.


Existen otras soluciones en el mercado, basadas en un visor de revistas genérico en Flash, que va cargando las páginas del contenido individualmente a partir de un sencillo índice de texto (o XML) que indica dónde están los archivos SWF o JPEG correspondientes a cada una de las páginas.


InDesign CS4 permite exportar rangos de páginas, pero claro, para obtener un rango de UNA página por exportación, se requeriría de realizar tantas exportaciones como páginas tuviera el documento.


Para facilitar esta tarea, y poder con un solo clic exportar todas y cada una de las páginas de un documento InDesign a archivos SWF individuales que luego se puedan integrar en alguna solución de revista interactiva tipo, por ejemplos, FlashPageFlip o Zinio, he creado un sencillo Script de InDesign que realiza dicha tarea.


Para poder usarlo, sigue los siguiente pasos:


1) Descarga el archivo del script (ExportSWFIndividually.jsx, Javascript) desde la página de descargas de Telegama.com


2) Copia dicho documento .jsx a la carpeta de Scripts de InDesign, tal y como se muestra a continuación (en Windows la ruta es análoga):




de este modo el script aparecerá dentro del panel de Scripts en InDesign (menú Ventana > Automatización > Scripts):


3) Abre el documento que quieras exportar, y haz una primera exportación en SWF a mano, aunque sea de una página. Esto es básicamente para fijar los parámetros de exportación del formato de una vez para todas las páginas.


4) Haz doble clic sobre el iconito del script dentro de la ventana de Scripts, recibirás un aviso de confirmación cuando haya finalizado la exportación:







5) Comprueba que, en la misma carpeta donde está tu documento de InDesign, también se hayan tantos documentos SWF como páginas tenía. Dichos documentos tendrán un nombre del tipo "page_" + el número de la página (el número de orden de la página)



De este modo, te será más fácil posteriormente integrar dichas páginas en cualquier composición de una revista en Flash.





Consulteu aquí la versió en català d'aquest blog