Diseo y Creacin de Pginas Web

Diseo de Pginas Web

La universalidad de Internet hace de la red el mejor lugar para que nuestras ideas lleguen a todos los rincones del mundo y para encontrarnos con quienes comparten nuestra tarea e intereses. Este curso permitir al alumno crear pginas web de un modo sencillo y eficiente, dndoles un aspecto profesional y atractivo. Objetivos Que en pocas lecciones el alumno utilice las herramientas fundamentales de la creacin y mantenimiento de pginas web, el lenguaje HTML, los protocolos que se utilizan en la web y los pasos necesarios para publicar y actualizar la informacin. Asimismo se incorporarn tcnicas de diseo para lograr un mayor impacto en el documento final, como el uso de imgenes, animaciones y sonidos. Destinatarios Profesionales de distintas reas. Diseadores grficos. Estudiantes en general y toda persona que desee utilizar la Internet como un medio de comunicacin masivo y dinmico. Metodologa didctica El curso es totalmente personalizado, con una computadora para uso exclusivo del alumno y un instructor particular atendindolo personalmente sin otros participantes. Con breves introducciones tericas, es eminentemente prctico: el alumno avanza guiado por el instructor. Temario Introduccin a los protocolos de Internet. Pginas y sitios. Introduccin al lenguaje HTML. Microsoft FrontPage. Formatos de pgina. Hipervnculos. Uso de Tablas. Imgenes. Animaciones. Uso de sonido con FrontPage. Plantillas. Pginas de marcos (frames). Temas de Front page. Herramientas de FrontPage. HTML dinmico. Las extensiones de FrontPage. Publicar el Web con FrontPage. Uso de FTP. Requisitos Manejo de Windows y nociones bsicas de Internet (excluyentes). Comentarios adicionales Internet es el centro de informacin ms importante, dinmico y universal que ha creado el hombre. Poner cualquier informacin en la red significa conectarse con millones de personas en todo el mundo de manera inmediata. Tambin es la herramienta de comunicacin ms econmica jams imaginada. Este curso le permitir conocer todas las posibilidades para poner su informacin en la red con gastos mnimos o nulos.

DREAMWEAVER SITIO Qu es un sitio? Crear un sitio Datos locales y datos del servidor Web Editar un sitio Eliminar un sitio web Estructura de un sitio - Pagina principal - Nombre de archivo y Ttulo de la pgina: dstincin Publicacin de un sitio web en un servidor ENTORNO DE DREAMWEAVER Estructura de una pgina web: cuerpo y cabecera. Creacin y visualizacin de notas de diseo La barra de esatado: resolucin de la pgina. Vistas de Dreamweaver Propiedades de la pgina - Color de Texto - Color vnculos - Fondo de la pgina Creacin de nuevas pginas Creacin de enlaces entre pginas - Vculos externos - Vnculos a un correo electr Creacin de vnculos en espacios concretos de pginas Propiedades del texto (etiquetas): - Prrafo, Color , Alineacin Creacin de listas (esquemas): - Numeradas, sin numerar Imgenes: - Insercin y eliminacin de imgenes - Propiedades de la imagen Creacin de imgenes de sustitucin Capas: - insercin y dibujo de capas - modificacin de capas - propiedades de capas - visibilidad - Apariencia - Tamao - Posicin - Apilamiento - Solapamiento - Ventaja de las capas frente a las tablas Creacin y modificacin de mapas de imagenes Creacin de botones swf Creacin de textos swf Insercin de smbolos Marcos - Creacin, diseo, propiedades,edicin Comprobacin de exploradores de destino Estilos - Estilos CSS (DHTML) Activos de Dreamweaver Creacin de lbum de fotos Formularios - Creacin de formularios - Insercin de campos de formularios Creacin de tablas y celdas de disposicin - Vista disposicin - Vista normal La cabecera de la pgina (HEAD) - Componente

- Visualizacin Lnea de tiempo - Movimiento de capas - Movimientos continuos - Movimientos de varias capas a la vez - Edicin de la lnea de tiempo - Eliminacin de la lnea de tiempo Comportamientos - Arrastre de capas - Abrir ventana del explorador - Abrir varios URL - Mostrar y ocultar capas - Destinos en funcin del explorador instalado - Destino en funcin del plug-ins instalado - Mensajes de alerta - Definicin de texto: - En capas - Barra de estado - Cuadro de texto - Validacin de formulario - Insercin de un sonido en una pgina web FLASH Herramientas y entorno - Escenario - Barras de herramientas e inspectores - Fotogramas y lnea de tiempo - Creacin del movimiento a travs de los fotrogramas - Tipos de fotogramas - Fotograma clave - Fotograma clave vaco - Fotograma intermedio Alineacin de objetos Creacin de degradados Propiedades de la pelcula Movimientos - Movimiento de un objeto o movimiento de varios objetos simultaneamente - Interpolacin de movimiento - de rotacin - de tamao - de inclinacin - de posicin - de color y transparencia - Interpolacion de foma - Paso de un objeto a otro - Trabajar con capas - Tipos de capas - Utilizacin - Eliminacin - Modificacin - la capa mscara - La capa de guas - Creacin de botones - Creacin de objetos en movimiento - Creacin de botones animados - Utilizacin de escenas - Introduccin a la programacin en flash - Creacin y utilizacin de

acciones - reproduccin de una pelicula - Detencin de una pelcula - Desplazamiento dentro de la pelcula - Creacin de mens desplegables - Creacin de campos de contrasea - Creacin de barras de desplazamientos - Utilizacin de acciones condicionales - Utilizacin de Accin IS FRAME IS LOADED - Creacin de objetos que sigan al puntero del mouse - Creacin de proyectores independientes - Insercin y modificacin de sonidos en la pelcula - Insercin y modificacin de sonidos en los botones. FIREWORKS Entorno de Fireworks - Herramientas: utilizacin, barras de herramientas - Modo objetos y modo edicin de imgenes-distincin - Inspectores Utilizacin de trazos Utilizacin de rellenos - Utilizacin de patrones - Creacin de degradados Utilizacin e insercin de texturas Estilos - Aplicacin de estilos - Creacin de estilos - Modificacin - Eliminacin Efectos - Sombra, Iluminacin, cambio de color, relieve Definicin de transparencias Composicines Creacin de mapas de imgenes Optimizacin de imgenes Edicin de una imagen insertada - Recorte, efectos, transparencia Creacin de banner y objetos animados. - Fotogramas Barras de exploracin Creacin de botoneras - Estados - Smbolos animados - Asignacin de vnculos - Barras de exploracin para dreamweaver Rollovers - Comportamientos - Creacin - Intercambio de imgenes - Rollover simple, Rollover compuesto

Creacin de mscaras Interseccin entre objetos - Unin, agrupacin, perforacin Prevalencia del trazo sobre el relleno o del relleno sobre el trazo Creacin de textos - Creacin de mens desplegables

HTML, DHTML, JavaScript, Photoshop, Flash

Temario HTML 1. Introduccin a HTML 2. Cabecera del documento 3. Cuerpo del documento 4. Texto 5. Formato de texto 6. Hipertexto y marcadores 7. Imgenes y mapas de imgenes 8. Listas 9. Tablas 10. Formularios 11. Marcos CURSO DE DISEO Y CREACIN DE PAGINAS WEB

PRESENTACIN DEL CURSO Hoy da la Informtica y la Tecnologa de la Comunicacin (ITC) forman parte de la vida de numerosas personas en todo el mundo. En el nivel profesional, es imprescindible el conocimiento de estas tcnicas para el perfecto y completo funcionamiento del personal de cualquier empresa, sea cual sea el rea en el que se muevan los empleados. La ITC se manifiesta como la herramienta necesaria en cualquier contexto laboral para el desarrollo de la empresa. El Instituto Europeo de Estudios Superiores, consciente de la importancia que la ITC tiene en todo el mundo, cre en el ao 1989 la Escuela Superior de Informtica, en la que, adems de la Carrera de Tcnico Superior en Informtica, se imparten diferentes Cursos ajustados a las necesidades de cualquier persona que desarrolla o, desea desarrollar, cualquier profesin en cualquier entidad o empresa. El Curso de Diseo de Pgina WEB de IEES est preparado para aquellas personas que ya han adquirido unos conocimientos introductorios amplios en Informtica y que desean elaborar presentaciones en

pginas web, usar hojas de estilo, crear estructuras, usar tablas e imgenes, etc obteniendo un alto nivel de formacin en esta rea. TEMARIO 1. Introduccin - Creacin de sitios Web con Dreamweaver. - Instalacin del Programa. - Requisitos del Sistema. - Interfaz y Entorno de Trabajo. 2. Creacin de la Estructura de un Sitio Web. - La sede Web. - Definir una sede Web. - Administracin de archivos y carpetas. - Entender la estructura de la sede. - Crear el mapa de la sede. 3. Construir una pgina Web. - Abrir y guardar un documento. - Insertar texto e imgenes. - Modificacin de las propiedades de la pgina. - Etiquetas <PRE> - Listas ordenadas, desordenadas y de definicin. - Fuentes y tamao del texto. - Combinar imgenes y texto. - Color e imagen para el fondo. - Justificar Texto. - Hojas de Estilo. 4. Enlaces. - Crear un enlace de texto. - Crear un enlace con imgenes. - Enlaces apuntando a un archivo. - Meta etiquetas. - Imgenes con zonas activas. - Mens de salto con Listas Desplegables. - Enlaces utilizando botones y Textos Flash. 5. Tablas. - Creacin de tablas. - Propiedades del conjunto de la Tabla. - Propiedades de Celda. - Alineacin del contenido usando tablas.

6. Marcos. - Configuracin y control de marcos. - Propiedades de marcos. - Incluir pginas y eliminar marcos. - Hipervnculos y destinos. - Barras de desplazamiento y redimensin. 7. Imgenes interactivas. - Crear imagen de sustitucin. - Barra de navegacin multieventos. - Botn Flash. - Botn texto. - HTML de Fireworks. 8. Capas. - Crear capas. - Insertar texto e imgenes en capas - Mover y activar capas. - Animar capas. - Trayectoria y velocidad de una animacin. 9. Formularios. - Crear un formulario. - Propiedades de formulario. - Crear un men de salto. - Valores de un men de salto. - Crear un men de opciones. - Los resultados de un formulario. 10. Plug-Ins. - Enlaces de sonidos. - Crear un vnculo de sonido. - Insertar pelculas QuickTime. - Enlaces a vdeos de Internet. - Insertar Flash. - Insertar contenido de Director. 11. Comportamientos y Utilizacin del Interfaz de Dreamweaver para la Programacin (HTML, JavaScript, VBScript, VBScript y ASP). - Aadir acciones a objetos. - Implementar las Pginas Web mediante la insercin de trabajos programados en HTML, JavaScript, VBScript, ASP, etc. 12. Creacin de un Sitio Web profesional paso a paso. Su Publicacin y Administracin. - Creacin de un Sitio Web haciendo uso de lo aprendido durante el

Curso. - Configurar datos remotos. - Enviar archivos por FTP. - Proteger y desproteger una sede. OBJETIVOS DEL CURSO Al finalizar el Curso, los alumnos estarn perfectamente capacitados parar: ? Crear Sitios Web ? Realizar diferentes diseos, utilizando las posibilidades que ofrece el propio programa en cuanto a diseo, as como sus posibilidades de insertar objetos realizados con otros programas. ? Publicar el Sitio Web, Subindolo a travs del programa FTP que incluye Dreamweaver. As como el mantenimiento del Sitio Web, actualizndolo y modificando los archivos incluidos en el Servidor. 1. Usar hojas de estilo. 1.1. Crear una hoja de estilo externo. 1.2. Crear el estilo de etiquetas comunes. 1.3. Especificar el aspecto de los tipos. 1.4. Aplicar etiquetas. 2. Crear Estructura. 2.1. Crear una pgina principal. 2.1.1. Crear una pgina principal, segn las instrucciones. 2.1.2. Aplicar opciones de men a las pginas, segn las instrucciones. 2.2. Crear enlaces. 2.2.1. Crear enlaces, segn las instrucciones. 2.2.2. Abrir los enlaces en una ubicacin especificada 3. Usar Tablas. 3.1.1. Insertar una tabla. 3.1.2. Especificar los bordes. 3.1.3. Fusionar las celdas. 4. Usar imgenes. 4.1. Insertar imgenes. 4.1.1. Insertar imgenes. 4.1.2. Colocar la imagen relativa al texto. 4.2. Modificar la imagen. 4.2.1. Utilizar etiquetas para ajustar el tamao. 4.2.2. Utilizar Software para modificar el tamao de la imagen/ajustar la profundidad del color.

5. Datos de salida. 5.1. Guardar e imprimir pginas web. 5.1.1. Guardar e imprimir las pginas web, segn las instrucciones.

Diseo de Paginas web (HTML Bsico)

Contenido del Curso

Presentacin 1. Qu es un Sitio web 2. Qu herramientas necesito para construir una pagina en Internet 3. Utilizando cdigo HTML para cre@r tu pagina web 3.1 Cmo se escribe una etiqueta HTML 3.2 Estructura de un documento HTML 3.3 Texto Realzado y Negritas 3.4 Subrayado de palabras 3.5 Tachado de palabras 3.6 Letra itlica, cursiva o bastardilla 3.7 Saltos de lnea 3.8 Tamao y Tipo de letra 3.9 Delimitacin de prrafos 3.10 Alinear prrafos 3.11 lneas divisorias 3.12 Mas etiquetas HTML de uso comn y tabla de colores 3.13 Listas 3.14 Inclusin de imgenes tipo gif, jpg, y bmp 3.15 Insercin de vnculos o links. 3.16 Tablas de Datos 3.17 Los Frames 3.18 Creando un ejemplo con frames 3.19 Los editores de Paginas Web 4. Cmo Publicar tu pagina web en Internet 5. Recursos para tu web