Preparación de textos HTML, PDF y MSWord Julio Takayama Silvia de Medeiros Cabral Oficina de Comunicación y Marketing BIREME - OPAS - OMS Julio Takayama.

Presentación del tema: "Preparación de textos HTML, PDF y MSWord Julio Takayama Silvia de Medeiros Cabral Oficina de Comunicación y Marketing BIREME - OPAS - OMS Julio Takayama."— Transcripción de la presentación:

1 Preparación de textos HTML, PDF y MSWord Julio Takayama Silvia de Medeiros Cabral Oficina de Comunicación y Marketing BIREME - OPAS - OMS Julio Takayama Silvia de Medeiros Cabral Oficina de Comunicación y Marketing BIREME - OPAS - OMS

2 Diseño Gráfico en páginas web Clareza Orden Confiabilidad a las fuentes de información Clareza Orden Confiabilidad a las fuentes de información

3 Direccionar la atención Priorizar información Interacción mas eficiente Direccionar la atención Priorizar información Interacción mas eficiente Organización de gráficos y textos

4 Diseño Gráfico en páginas web La tarea básica del Diseño Gráfico es crear una jerarquía visual en la cual elementos son enfatizados y contenidos son organizados de forma logica y previsible

5 Diseño Gráfico es la administración de la información visual, utilizando herramientas de layout, tipografía e ilustración para conducir los ojos del lector a través de las páginas

6 Consistencia en el diseño Dimensiones de las páginas Organización de la información en la página Tipografia Formatación de textos para web Cascading Style Sheets (css) Tipos de documentos y Tipos de navegación Organización del sitio Creación de archivos PDF Consistencia en el diseño Dimensiones de las páginas Organización de la información en la página Tipografia Formatación de textos para web Cascading Style Sheets (css) Tipos de documentos y Tipos de navegación Organización del sitio Creación de archivos PDF Diseño Gráfico en páginas web

7 Consistencia en el diseño Establezca un esquema para guiar la inclusión de textos y gráficos, y lo utilice para crear ritmo y unidad visual en las páginas del sitio

8 Dimensiones de la página Area segura Formate el documento para una pantalla de 640X480 pixels La información principal debe estar disponible en el inicio de la página, para que el usuario no utilice las “scroll bars” Area segura Formate el documento para una pantalla de 640X480 pixels La información principal debe estar disponible en el inicio de la página, para que el usuario no utilice las “scroll bars”

9 Dimensiones de la página Extensión de la página Relación entre la página y el tamaño de la pantalla Contenido del documento ¿El usuario va quedar en linea, imprimir o bajar el documento? ancho de banda disponible Extensión de la página Relación entre la página y el tamaño de la pantalla Contenido del documento ¿El usuario va quedar en linea, imprimir o bajar el documento? ancho de banda disponible

10 Elementos indispensables Título Destaques Navegación entre páginas Título de la página Contenido Navegación en la página Informaciones acerca de la página Elementos indispensables Título Destaques Navegación entre páginas Título de la página Contenido Navegación en la página Informaciones acerca de la página Organización de la información en la Página

11 Tipografia Diferencias entre documentos impresos y web Tipografia Diferencias entre documentos impresos y web P A P E L 1200 dpi Mas opciones de tipos Resultado totalmente previsible Muchos recursos Tipográficos P A P E L 1200 dpi Mas opciones de tipos Resultado totalmente previsible Muchos recursos Tipográficos W E B 85 dpi Menos opciones de tipos resultado parcialmente previsible Pocos recursos Tipográficos W E B 85 dpi Menos opciones de tipos resultado parcialmente previsible Pocos recursos Tipográficos Todos los recursos tipográficos fueron desarrollados para papel y ahora son adaptados para web

12 Font Face S e r i f S a n s - S e r i f Aa

13 Font Face Times New Roman Courrier Serifa Georgia Arial Helvetica Verdana Monospace S e r i f S a n s - S e r i f

14 Font Face Énfasis Italico Bold Subrayado Colores Mayúsculas y minúsculas Énfasis Italico Bold Subrayado Colores Mayúsculas y minúsculas

15 Formatación de textos para web Excesivo Markup La utilización excesiva de links, diferentes tipos de letras, colores y estilos puede destruir la homogeneidad que caracteriza el buen diseño gráfico Excesivo Markup La utilización excesiva de links, diferentes tipos de letras, colores y estilos puede destruir la homogeneidad que caracteriza el buen diseño gráfico

16 Cascading Style Sheets (css) Hojas de Estilo Cascading Style Sheets (css) Hojas de Estilo “Cascading Style Sheets” proporcionan control de –Textos –Destaques –Listas –y otros elementos de la página “Cascading Style Sheets” proporcionan control de –Textos –Destaques –Listas –y otros elementos de la página

17 Tipos de Documentos HTML, PDF, MSWord Imagenes Multimediales HTML, PDF, MSWord Imagenes Multimediales

18 Tipos de navegación Linear Jerarquico Grade Red Linear Jerarquico Grade Red

19 Organización del sitio No utilice los caracteres diacríticos para los nombres de archivos y directorios Utilice solamente –las letras de A a Z, los números de 0 a 9, underscore y hifen Nombre de archivos iguales para directorios de los diferentes idiomas Observe que UNIX es “Case Sensitive” Organice la estructura de directorios de forma lógica Documentos y Aplicaciones en directorios diferentes No utilice los caracteres diacríticos para los nombres de archivos y directorios Utilice solamente –las letras de A a Z, los números de 0 a 9, underscore y hifen Nombre de archivos iguales para directorios de los diferentes idiomas Observe que UNIX es “Case Sensitive” Organice la estructura de directorios de forma lógica Documentos y Aplicaciones en directorios diferentes

20 Creación de archivos PDF Archivo Texto Archivo Post Script Conversión PS - PDF Archivo PDF Scanning Documento en Papel Bitmap Digital Sender