diseño paginas web

11
Diseño y Creación de Páginas Web Diseño de Páginas 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 páginas web de un modo sencillo y eficiente, dándoles un aspecto profesional y atractivo. Objetivos Que en pocas lecciones el alumno utilice las herramientas fundamentales de la creación y mantenimiento de páginas web, el lenguaje HTML, los protocolos que se utilizan en la web y los pasos necesarios para publicar y actualizar la información. Asimismo se incorporarán técnicas de diseño para lograr un mayor impacto en el documento final, como el uso de imágenes, animaciones y sonidos. Destinatarios Profesionales de distintas áreas. Diseñadores gráficos. Estudiantes en general y toda persona que desee utilizar la Internet como un medio de comunicación masivo y dinámico. Metodología didáctica El curso es totalmente personalizado, con una computadora para uso exclusivo del alumno y un instructor particular atendiéndolo personalmente sin otros participantes. Con breves introducciones teóricas, es eminentemente práctico: el alumno avanza guiado por el instructor. Temario Introducción a los protocolos de Internet. Páginas y sitios. Introducción al lenguaje HTML. Microsoft FrontPage. Formatos de página. Hipervínculos. Uso de Tablas. Imágenes. Animaciones. Uso de sonido con FrontPage. Plantillas. Páginas de marcos (frames). Temas de Front page. Herramientas de FrontPage. HTML dinámico. Las extensiones de FrontPage. Publicar el Web con FrontPage. Uso de FTP. Requisitos Manejo de Windows y nociones básicas de Internet (excluyentes).

Upload: paul-delgado-soto

Post on 09-Feb-2016

9 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Diseño Paginas Web

Diseño y Creación de Páginas Web

Diseño de Páginas 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 páginas web de un modo sencillo y eficiente, dándoles un aspecto profesional y atractivo.

ObjetivosQue en pocas lecciones el alumno utilice las herramientas fundamentales de la creación y mantenimiento de páginas web, el lenguaje HTML, los protocolos que se utilizan en la web y los pasos necesarios para publicar y actualizar la información. Asimismo se incorporarán técnicas de diseño para lograr un mayor impacto en el documento final, como el uso de imágenes, animaciones y sonidos.

DestinatariosProfesionales de distintas áreas. Diseñadores gráficos. Estudiantes en general y toda persona que desee utilizar la Internet como un medio de comunicación masivo y dinámico.

Metodología didácticaEl curso es totalmente personalizado, con una computadora para uso exclusivo del alumno y un instructor particular atendiéndolo personalmente sin otros participantes. Con breves introducciones teóricas, es eminentemente práctico: el alumno avanza guiado por el instructor.

TemarioIntroducción a los protocolos de Internet. Páginas y sitios. Introducción al lenguaje HTML. Microsoft FrontPage. Formatos de página. Hipervínculos. Uso de Tablas. Imágenes. Animaciones. Uso de sonido con FrontPage. Plantillas. Páginas de marcos (frames). Temas de Front page. Herramientas de FrontPage. HTML dinámico. Las extensiones de FrontPage. Publicar el Web con FrontPage. Uso de FTP.

RequisitosManejo de Windows y nociones básicas de Internet (excluyentes).

Comentarios adicionalesInternet es el centro de información más importante, dinámico y universal que ha creado el hombre. Poner cualquier información en la red significa conectarse con millones de personas en todo el mundo de manera inmediata. También es la herramienta de comunicación más económica jamás imaginada. Este curso le permitirá conocer todas las posibilidades para poner su información en la red con gastos mínimos o nulos.

Page 2: Diseño Paginas Web

DREAMWEAVERSITIO¿Qué es un sitio?Crear un sitioDatos locales y datos del servidor WebEditar un sitioEliminar un sitio webEstructura de un sitio - Pagina principal- Nombre de archivo y Título de la página: dstinciónPublicación de un sitio web en un servidorENTORNO DE DREAMWEAVEREstructura de una página web: cuerpo y cabecera.Creación y visualización de notas de diseñoLa barra de esatado: resolución de la página.Vistas de DreamweaverPropiedades de la página - Color de Texto- Color vínculos- Fondo de la páginaCreación de nuevas páginas Creación de enlaces entre páginas- Vículos externos - Vínculos a un correo electrCreación de vínculos en espacios concretos de páginasPropiedades del texto (etiquetas):- Párrafo, Color , AlineaciónCreación de listas (esquemas):- Numeradas, sin numerarImágenes:- Inserción y eliminación de imágenes- Propiedades de la imagen Creación de imágenes de sustituciónCapas:- inserción y dibujo de capas - modificación de capas - propiedades de capas- visibilidad- Apariencia - Tamaño - Posición- Apilamiento - Solapamiento - Ventaja de las capas frente a las tablas Creación y modificación de mapas de imagenesCreación de botones swfCreación de textos swfInserción de símbolos Marcos- Creación, diseño, propiedades,ediciónComprobación de exploradores de destinoEstilos- Estilos CSS (DHTML)Activos de DreamweaverCreación de Álbum de fotosFormularios - Creación de formularios- Inserción de campos de formulariosCreación de tablas y celdas de disposición- Vista disposición- Vista normalLa cabecera de la página (HEAD)- Componente - VisualizaciónLínea de tiempo - Movimiento de capas

Page 3: Diseño Paginas Web

- Movimientos continuos- Movimientos de varias capas a la vez- Edición de la línea de tiempo- Eliminación de la línea de tiempoComportamientos - Arrastre de capas - Abrir ventana del explorador- Abrir varios URL - Mostrar y ocultar capas - Destinos en función del explorador instalado- Destino en función del plug-ins instalado- Mensajes de alerta- Definición de texto:- En capas - Barra de estado - Cuadro de texto- Validación de formulario- Inserción de un sonido en una página web

FLASHHerramientas y entorno- Escenario- Barras de herramientas e inspectores- Fotogramas y línea de tiempo- Creación del movimiento a través de los fotrogramas- Tipos de fotogramas- Fotograma clave- Fotograma clave vacío- Fotograma intermedio Alineación de objetos Creación de degradadosPropiedades de la películaMovimientos - Movimiento de un objeto o movimiento de varios objetos simultaneamente- Interpolación de movimiento - de rotación- de tamaño - de inclinación - de posición- de color y transparencia- Interpolacion de foma - Paso de un objeto a otro- Trabajar con capas- Tipos de capas- Utilización - Eliminación - Modificación - la capa máscara - La capa de guías - Creación de botones - Creación de objetos en movimiento - Creación de botones animados- Utilización de escenas- Introducción a la programación en flash- Creación y utilización de acciones- reproducción de una pelicula - Detención de una película - Desplazamiento dentro de la película

Page 4: Diseño Paginas Web

- Creación de menús desplegables- Creación de campos de contraseña- Creación de barras de desplazamientos- Utilización de acciones condicionales- Utilización de Acción IS FRAME IS LOADED- Creación de objetos que sigan al puntero del mouse- Creación de proyectores independientes- Inserción y modificación de sonidos en la película- Inserción y modificación de sonidos en los botones.

FIREWORKS Entorno de Fireworks - Herramientas: utilización, barras de herramientas- Modo objetos y modo edición de imágenes-distinción - InspectoresUtilización de trazos Utilización de rellenos- Utilización de patrones- Creación de degradadosUtilización e inserción de texturasEstilos- Aplicación de estilos- Creación de estilos- Modificación- EliminaciónEfectos- Sombra, Iluminación, cambio de color, relieveDefinición de transparenciasComposiciónesCreación de mapas de imágenesOptimización de imágenesEdición de una imagen insertada- Recorte, efectos, transparenciaCreación de banner y objetos animados.- FotogramasBarras de exploración Creación de botoneras- Estados- Símbolos animados - Asignación de vínculos- Barras de exploración para dreamweaverRollovers- Comportamientos- Creación- Intercambio de imágenes- Rollover simple, Rollover compuestoCreación de máscarasIntersección entre objetos- Unión, agrupación, perforaciónPrevalencia del trazo sobre el relleno o del relleno sobre el trazoCreación de textos- Creación de menús desplegables

Page 5: Diseño Paginas Web

HTML, DHTML, JavaScript, Photoshop, Flash

Temario

HTML

1. Introducción a HTML2. Cabecera del documento3. Cuerpo del documento4. Texto5. Formato de texto6. Hipertexto y marcadores7. Imágenes y mapas de imágenes8. Listas9. Tablas10. Formularios11. Marcos

CURSO DE DISEÑO Y CREACIÓN DE PAGINAS WEB

PRESENTACIÓN DEL CURSO

Hoy día la Informática y la Tecnología de la Comunicación (ITC) forman parte de la vida de numerosas personas en todo el mundo. En el nivel profesional, es imprescindible el conocimiento de estas técnicas 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 año 1989 la Escuela Superior de Informática, en la que, además de la Carrera de Técnico Superior en Informática, se imparten diferentes Cursos ajustados a las necesidades de cualquier persona que desarrolla o, desea desarrollar, cualquier profesión en cualquier entidad o empresa.

El Curso de Diseño de Página WEB de IEES está preparado para aquellas personas que ya han adquirido unos conocimientos introductorios amplios en Informática y que desean elaborar presentaciones en páginas web, usar hojas de estilo, crear estructuras, usar tablas e imágenes, etc obteniendo un alto nivel de formación en esta área.

TEMARIO

1. Introducción

Page 6: Diseño Paginas Web

- Creación de sitios Web con Dreamweaver.- Instalación del Programa.- Requisitos del Sistema.- Interfaz y Entorno de Trabajo.

2. Creación de la Estructura de un Sitio Web.- La sede Web.- Definir una sede Web.- Administración de archivos y carpetas.- Entender la estructura de la sede.- Crear el mapa de la sede.

3. Construir una página Web.- Abrir y guardar un documento.- Insertar texto e imágenes.- Modificación de las propiedades de la página.- Etiquetas <PRE>- Listas ordenadas, desordenadas y de definición.- Fuentes y tamaño del texto.- Combinar imágenes y texto.- Color e imagen para el fondo.- Justificar Texto.- Hojas de Estilo.

4. Enlaces.- Crear un enlace de texto.- Crear un enlace con imágenes.- Enlaces apuntando a un archivo.- Meta etiquetas.- Imágenes con zonas activas.- Menús de salto con Listas Desplegables.- Enlaces utilizando botones y Textos Flash.

5. Tablas.- Creación de tablas.- Propiedades del conjunto de la Tabla.- Propiedades de Celda.- Alineación del contenido usando tablas.

6. Marcos.- Configuración y control de marcos.- Propiedades de marcos.- Incluir páginas y eliminar marcos.- Hipervínculos y destinos.- Barras de desplazamiento y redimensión.

Page 7: Diseño Paginas Web

7. Imágenes interactivas.- Crear imagen de sustitución.- Barra de navegación multieventos.- Botón Flash.- Botón texto.- HTML de Fireworks.

8. Capas.- Crear capas.- Insertar texto e imágenes en capas- Mover y activar capas.- Animar capas.- Trayectoria y velocidad de una animación.

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 vínculo de sonido.- Insertar películas QuickTime.- Enlaces a vídeos de Internet.- Insertar Flash.- Insertar contenido de Director.

11. Comportamientos y Utilización del Interfaz de Dreamweaver para la Programación (HTML, JavaScript, VBScript, VBScript y ASP).- Añadir acciones a objetos.- Implementar las Páginas Web mediante la inserción de trabajos programados en HTML, JavaScript, VBScript, ASP, etc.

12. Creación de un Sitio Web profesional paso a paso. Su Publicación y Administración.- Creación 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

Page 8: Diseño Paginas Web

Al finalizar el Curso, los alumnos estarán perfectamente capacitados parar:

? Crear Sitios Web? Realizar diferentes diseños, utilizando las posibilidades que ofrece el propio programa en cuanto a diseño, así como sus posibilidades de insertar objetos realizados con otros programas.? Publicar el Sitio Web, “Subiéndolo” a través del programa FTP que incluye Dreamweaver. Así como el mantenimiento del Sitio Web, actualizándolo 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 página principal.2.1.1. Crear una página principal, según las instrucciones.2.1.2. Aplicar opciones de menú a las páginas, según las instrucciones.2.2. Crear enlaces.2.2.1. Crear enlaces, según las instrucciones.2.2.2. Abrir los enlaces en una ubicación especificada

3. Usar Tablas.3.1.1. Insertar una tabla.3.1.2. Especificar los bordes.3.1.3. Fusionar las celdas.

4. Usar imágenes.4.1. Insertar imágenes.4.1.1. Insertar imágenes.4.1.2. Colocar la imagen relativa al texto.4.2. Modificar la imagen.4.2.1. Utilizar etiquetas para ajustar el tamaño.4.2.2. Utilizar Software para modificar el tamaño de la imagen/ajustar la profundidad del color.

5. Datos de salida.5.1. Guardar e imprimir páginas web.5.1.1. Guardar e imprimir las páginas web, según las instrucciones.

Diseño de Paginas web (HTML Básico)

Page 9: Diseño Paginas Web

Contenido del Curso Presentación

1. Qué es un Sitio web 2. Qué herramientas necesito para construir una pagina en Internet 3. Utilizando código HTML para cre@r tu pagina web

3.1 Cómo 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 itálica, cursiva o bastardilla 3.7 Saltos de línea 3.8 Tamaño y Tipo de letra 3.9 Delimitación de párrafos 3.10 Alinear párrafos 3.11 líneas divisorias 3.12 Mas etiquetas HTML de uso común y tabla de colores 3.13 Listas 3.14 Inclusión de imágenes tipo gif, jpg, y bmp 3.15 Inserción de vínculos 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. Cómo Publicar tu pagina web en Internet 5. Recursos para tu web