1 Diseño y gestión de sitios Web con Adobe GoLive Requisitos mínimos para la aplicación Adobe GoLive 6.0.1 PowerPC MacOS 9.1 96 MB RAM 90 MB de espacio libre en disco PC compatible Procesador Pentium II, 400 MHz Windows 98 96 MB RAM 90 MB de espacio libre en disco
12 Planteamiento y duración del curso (24 horas) El curso consta de dos fases bien diferenciadas. Fase 1: 20 horas de duración. Se plantea de forma eminentemente práctica precedida, cuando proceda, de explicación y justificación teórica. Fase 2: 4 horas de duración. Se impartirá en un periodo de tiempo no inferior a 15. días y no superior a 30 días a partir de la fecha de terminación de la fase 1. Resolución de las dudas surgidas a partir de la puesta en marcha de los conocimientos adquiridos en la fase 1. El curso será soportado técnicamente mediante el envío de dudas a la dirección de correo electrónico edu@eduvela.com Objetivos del curso Aprender a diseñar y gestionar un sitio Web para publicar información en Internet o intranets mediante la utilización de una potente aplicación de fácil manejo. Conocer y aprender a optimizar los distintos formatos gráficos utilizados en la Web. Convertir documentos procedentes de distintas aplicaciones de manera cómoda y eficaz para su utilización en en la Web.
3 Temario del curso Acercamiento al medio desde el diseño gráfico Internet Quien, porqué y para qué se crea Repercusión en el diseño gráfico Intranet La World Wide Web (WWW, Web o 3W) Sitio y página Web Editores WYSIWYG Navegador HTML JavaScript Elementos principales de una página Web Texto ASCII Tipografía Imágenes Espacios de color Resoluciones Compresiones Nuevo muestreo Formatos GIF, GIF animado, JPEG, PNG Optimización de imágenes para su utilización en la Web Trabajo con Photoshop e ImageReady Nomenclatura Web Limitaciones en el diseño gráfico aplicado a la Web Diseño de un sitio Web con Adobe GoLive Qué es y para qué sirve Adobe GoLive Formas de trabajo con Adobe GoLive Sitio o páginas Web Configuración de las preferencias de la aplicación Organización del interface de la aplicación Barra de menús Ventanas flotantes Sitio Páginas Trabajo con texto Diseño de un sitio Web Trabajo con vínculos Trabajo con Frames (cuadros) Trabajo con animación (DHTML) Trabajo con formularios Hojas de estilo en cascada (CSS) Gestión de un sitio Web con Adobe GoLive Subida de la información al servidor Web mediante FTP Aprendizaje complementario Conversión de documentos desde cualquier aplicación a HTML Preparación de archivos para su descarga a través de la Web
4 Glosario de términos relacionados con los formatos JPEG y GIFF JPEG Línea de base Estándar Formato que reconocen la mayoría de los navegadores. Optimizada Optimiza la calidad del color de la imagen. Produce archivos de tamaño ligeramente más pequeño. No es compatible con todos los navegadores. Progresiva Crea una imagen que se muestra gradualmente a medida que se descarga. Genera archivos ligeramente más grandes. No son soportados por todos los navegadores ni por todas las aplicaciones. GIF Tipo de paleta o tabla de colores para convertir una imagen RGB a color indexado. En las opciones Perceptual, Selectiva y Adaptable se puede optar entre utilizar una paleta local basada en los colores de la imagen actual o una paleta maestra creada en ImageReady. a Exacta Crea una paleta utilizando los colores exactos que aparecen en la imagen RGB. Opción disponible solo si la imagen usa 256 colores o menos. Puesto que la paleta de la imagen contiene todos los colores de la imagen, no hay ningún tramado. Sistema Windows Usa la paleta de 8 bits por defecto del sistema Windows, que se basa en un muestreo uniforme de los colores. Sistema Mac OS Usa la paleta de 8 bits por defecto del sistema Mac OS, que se basa en un muestreo uniforme de los colores. Web Usa la paleta de 216 colores que los navegadores, con independencia de la plataforma, usan para mostrar imágenes en un monitor de 256 colores. Es un subconjunto de la paleta de 8 bits de Mac OS. Utiliza esta opción para impedir los tramados del navegador al ver las imágenes en la pantalla de un monitor de 256 colores. Uniforme Crea una paleta realizando un muestreo uniforme de los colores del cubo de colores RGB. Por ejemplo, si Photoshop toma 6 niveles de color distribuidos uniformemente para el rojo, el verde y el azul, la combinación genera una paleta uniforme de 216 colores (6 elevado al cubo = 6 x 6 x 6 = 216). La cantidad total de colores que se muestran en una imagen corresponde al cubo perfecto más aproximado (8, 27, 64, 125 o 216) que es inferior al valor del cuadro de texto Colores. b Perceptual Crea una paleta personalizada en la que tienen prioridad los colores más sensibles para el ojo humano. Selectiva (opción por defecto) Crea una tabla de colores similar a la tabla de colores Perceptual, pero favorece amplias áreas de color y protege los colores Web. Normalmente, esta opción genera imágenes con la mayor integridad de los colores. Adaptable Crea una paleta realizando un muestreo de los colores del espectro que aparecen con más frecuencia en la imagen. Por ejemplo, una imagen RGB con sólo los colores verde y azul genera una paleta principalmente de verdes y azules. La mayoría de las imágenes concentran los colores en áreas determinadas del espectro. Para controlar una paleta con más exactitud, selecciona primero una parte de la imagen que contenga los colores que deseas enfatizar. Photoshop carga la conversión hacia estos colores.
5 c Personalizar Crea una paleta personalizada usando el cuadro de diálogo Tabla de colores. Edita la tabla de colores y guárdala para usos posteriores o bien haz clic en Cargar para cargar una tabla de colores creada anteriormente. Esta opción también muestra la paleta adaptable actual que sirve para previsualizar los colores que se usan con más frecuencia en la imagen. d Previa o Anterior Usa la paleta personalizada de la conversión anterior y, por tanto, es muy fácil convertir varias imágenes con la misma paleta personalizada. Tramado A no ser que se utilice la opción de la tabla de colores Exacta, puede que la tabla de colores no contenga todos los colores que se usan en la imagen. Para simular los colores que no están en la tabla de colores, puede generar colores tramados. Los tramados mezclan los píxeles de los colores disponibles para simular los colores que faltan. Ninguno No genera ningún color tramado pero, en su lugar, usa el color más cercano al color que falta. Esto suele producir transiciones nítidas entre los tonos de color de la imagen y crea el efecto de posterizado. Difusión Usa un método de difusión de errores que genera un tramado menos estructurado que la opción Motivo. Para proteger los colores de la imagen que contienen entradas en la tabla de colores y, por tanto, impedir los tramados, seleccione Mantener colores exactos y, de esta forma, mantener líneas finas y texto en las imágenes Web. Motivo Usa un motivo cuadrado similar a los semitonos para simular cualquier color que no está en la tabla de colores. Ruido (Seleccionar si se va a dividir en sectores la imagen para colocarla en una tabla HTML) Ayuda a reducir los motivos de costura a lo largo de los bordes de los sectores de la imagen. Otros conceptos Normal Crea una imagen que se muestra en el navegador solo cuando se ha descargado completamente. Entrelazado Crea una imagen que se muestra como versiones de baja resolución en el navegador hasta que se ha descargado completamente. Produce la sensación de un menor tiempo de descarga. Aumenta el tamaño del archivo.