Curso

DISEÑO Y DESARROLLO WEB CON HTML5 Y CSS3

  • Desde: 24/9/12
  • Hasta: 31/7/13
  • Campus Virtual
  • Idioma: Castellano

Preinscripción desde el 7/9/12

Matrícula disponible hasta el 31/7/13

Promovido por:
Dpto. de Proyectos de Ingeniería

Responsable de la actividad:



Modalidad

Presencial Online Emisión en directo

0 horas


0 horas


0 horas

Lugar de impartición
Impartición Online
Modalidad
Curso

2012-2013

ECTS

1,2

Campus

Virtual

0 h

Presenciales

0 h

Online

Precio Colectivo
245 € Alumno UPV 
295 € Alumni UPV PLUS o AAA UPV 
295 € Personal UPV 
365 € Público en general 
245 euros - Alumnos de la UPV
295 euros - Alumni, PAS y PDI de la UPV
365 euros - Externos de la UPV

Objetivos

Los asistentes a este curso adquirirán los conocimentos necesarios para diseñar y programar de principio a fin paginas web completamente estructuradas a través del uso del HTML y estilizadas a través del uso del CSS.
Con este curso se obtendrá un nivel avanzado en el uso práctico y teórico de ambos lenguajes.

Acción formativa dirigida a

Cualquier persona o profesional interesado en aprender a desarrollar sitios web usando las últimas novedades de los lenguajes HTML5 y CSS3.


Profesores

  • Ángela María Bleda Tomás Profesional del sector
  • Vicente Agustín Cloquell Ballester Profesor/a Titular de Universidad
  • Jose Vicente Carratala Sanchis Profesional del sector

Metodología didáctica y sistemas de evaluación

La metodología empleada para impartir este curso principalmente será, mediante formación teórica online a través de tutoriales y video tutoriales guiados. Esta documentación permitirá al alumno ir realizando el proyecto sobre el que gira el curso a medida de que avance en el estudio del temario. Al llegar a la finalización del curso, se evaluará al alumno mediante un proyecto completo realizado por el alumno en el que se ejemplifiquen los conocimientos adquiridos a lo largo del curso.
En todo momento se busca que el alumno no solo sepa utilizar estos lenguajes a nivel teórico, sino que desde un principio empiece a programar de forma agil y practica con ellos atendiendo a factores como el posicionamiento y la indexación gracias a un correcto uso del código.

Temas a desarrollar

Unidad 1: HTML
Subunidad 1: Espacio de trabajo:
Lección 1: Configuracion del espacio de trabajo
Lección 2: Creacion de carpetas de ejercicios y proyecto
Lección 3: Primera prueba
Subunidad 2: Estructura:
Lección 1: Doctype
Lección 2: Head y Body
Lección 3: Titulo
Lección 4: Cabeceras y paragrafos
Lección 5: Cabeceras, secciones y pie de pagina
Subunidad 3: Listas:
Lección 1: Listas
Lección 2: Listas anidadas
Lección 3: Segundas anidaciones
Lección 4: Insercion de comentarios
Lección 5: Uso de las listas para crear un menu de navegacion
Subunidad 4: Metaetiquetas:
Lección 1: Metaetiquetas
Lección 2: Mas metaetiquetas
Subunidad 5: Hipervinculos:
Lección 1: Creacion de hiperenlaces y preparacion
Lección 2: Enlace de las dos paginas
Lección 3: Enlaces externos
Lección 4: Demostracion CSS y estilizacion de enlaces
Subunidad 6: Estructura y formato:
Lección 1: Adicion de etiquetas HTML
Lección 2: Etiquetas de formato: negrita e italica
Lección 3: Etiquetas de formato II
Lección 4: Etiqueta semantica Time
Subunidad 7: Ejercicio practico:
Lección 1: Ejercicio de la unidad: creacion de la estructura de una web
Subunidad 8: Tablas:
Lección 1: Creacion de una tabla
Lección 2: Estilo de la tabla
Lección 3: Creacion de columnas y filas
Lección 4: Anchura de las tablas
Lección 5: Cabeceras
Lección 6: Tablas anidadas
Subunidad 9: Ejercicio boletin de noticias:
Lección 1: Estructura principal
Lección 2: Secciones de contenido
Lección 3: Tabla anidada
Subunidad 10: Contenido multimedia:
Lección 1: Preparacion del material
Lección 2: Insercion de imagenes
Lección 3: Tamaño de las imagenes
Lección 4: Texto alternativo
Lección 5: Añadido de video
Lección 6: Tamaño del video y varias fuentes
Lección 7: Proporciones del video
Lección 8: Audio
Lección 9: Parametros de audio
Subunidad 11: Divs:
Lección 1: Divs e ID
Subunidad 12: Formularios:
Lección 1: Form, accion y metodo
Lección 2: Form input
Lección 3: Form contrasena
Lección 4: Boton enviar
Lección 5: Radio
Lección 6: Radio multiple
Lección 7: Checkbox
Lección 8: Select
Lección 9: Textarea
Unidad 2: CSS
Subunidad 1: Introduccion:
Lección 1: CSS en linea
Lección 2: CSS interno
Lección 3: CSS externo
Subunidad 2: Color:
Lección 1: Color nombrado y RGB
Lección 2: Color con transparencia
Lección 3: Color hexadecimal
Subunidad 3: Cajas:
Lección 1: Bordes
Lección 2: Radio en los bordes
Lección 3: Comentarios
Lección 4: Color de frente y de fondo
Lección 5: Fondo de imagen
Lección 6: Margenes
Subunidad 4: Texto:
Lección 1: Etiqueta de estilo
Lección 2: Tamaño de fuente
Lección 3: Familia de fuente
Lección 4: Fuentes personalizadas
Lección 5: Sombra de texto
Lección 6: Alinear y overflow
Lección 7: Estilizar enlaces
Lección 8: Codificacion de los archivos
Unidad 3: Proyecto del curso
Subunidad 1: Preparacion:
Lección 1: Copiado de materia de referencia
Subunidad 2: HTML:
Lección 1: Creacion de index
Lección 2: Titulo
Lección 3: Etiquetas meta
Lección 4: Menu en lista
Lección 5: Insercion de imagenes
Lección 6: Texto en el banner con headings
Lección 7: Creacion de noticias
Subunidad 3: CSS:
Lección 1: Maquetado del los bloques principales
Lección 2: Desactivado del margen
Lección 3: Maquetacion de las noticias
Lección 4: Rehecho de los margenes
Unidad 4: Edicion de imagenes
Subunidad 1: GIMP:
Lección 1: Estrucutura de las ventanas
Lección 2: Descarga e instalacion de los programas
Lección 3: Archivo nuevo y pintura
Lección 4: Propiedades del pincel
Lección 5: Goma y lapiz
Lección 6: Relleno y degradado
Lección 7: Direcciones del degradado
Lección 8: Selecciones
Lección 9: Mas selecciones
Lección 10: Transformaciones
Lección 11: Trabajo con capas
Lección 12: Texto
Lección 13: Gurardar
Lección 14: Abrir imagenes
Lección 15: Brillo y contraste
Lección 16: Tono y saturacion
Lección 17: Umbral
Lección 18: Filtros
Lección 19: Ampliar y reducir
Subunidad 2: Inkscape:
Lección 1: Rectangulos y circulos
Lección 2: Estrellas
Lección 3: Dibujo libre
Lección 4: Relleno y borde
Lección 5: Trazo
Lección 6: Nuevo documento
Lección 7: Circulos
Lección 8: Arcos
Lección 9: Exportacion del resultado
Unidad 5: Contenido extra
Subunidad 1: Filezilla:
Lección 1: Introduccion a Filezilla
Subunidad 2: Mapas de Google:
Lección 1: 1
Lección 2: 2
Subunidad 3: Maquetacion de menus:
Lección 1: 1
Lección 2: 2
Lección 3: 3
Lección 4: 4
Lección 5: 5
Lección 6: 6
Subunidad 4: Web estilizada:
Lección 1: 1
Lección 2: 2
Lección 3: 3
Subunidad 5: Transformaciones:
Lección 1: 1
Subunidad 6: Teansiciones:
Lección 1: 1
Subunidad 7: Creacion de una polaroid:
Lección 1: 1
Unidad 6: Proyecto del curso
Subunidad 1: Parte estatica:
Lección 1: Descarga de XAMPP
Lección 2: Instalacion
Lección 3: Creacion de contenido propio
Lección 4: Estructura de la aplicacion
Lección 5: Creacion del cuerpo y la cabecera
Lección 6: Titulos
Lección 7: Formularios - primera parte
Lección 8: Formularios - segunda parte
Lección 9: Formularios - tercera parte
Lección 10: Añadido de CSS
Lección 11: Maquetado del fondo y las fuentes
Lección 12: Textos
Lección 13: Animaciones - primera parte
Lección 14: Animaciones - segunda parte
Lección 15: Formularios y sus transiciones
Unidad 6: Edicion WYSIWYG con BlueGriffon
Subunidad 1: Instalacion:
Lección 1: Descarga de BlueGriffon
Lección 2: Instalacion de Bluegriffon
Lección 3: Interfaz de usuario
Subunidad 2: Estilos HTML:
Lección 1: Negrita
Lección 2: Italica
Lección 3: Subrayado
Lección 4: Enfasis
Lección 5: Codigo
Subunidad 3: Listas:
Lección 1: Listas no ordenadas
Lección 2: Listas ordenadas
Subunidad 4: Tablas:
Lección 1: 1
Lección 2: 2
Lección 3: 3
Lección 4: 4
Subunidad 5: Ejercicio resumen:
Lección 1: 1
Lección 2: 2
Lección 3: 3
Lección 4: 4
Lección 5: 5
Lección 6: 6
Subunidad 6: Diagramas de planificacion:
Lección 1: Descarga e instalacion de Dia
Lección 2: Creacion de nodos en Dia
Lección 3: Union de nodos
Lección 4: Exportacion del diagrama
Subunidad 7: Organizacion de la informacion:
Lección 1: Investigacion 1
Subunidad 8: Wireframe:
Lección 1: Descarga de Inkscape
Lección 2: Instalacion de Inkscape
Lección 3: Maquetacion con Inkscape
Subunidad 9: Conversion a HTML:
Lección 1: Titulo
Lección 2: Cabecera
Lección 3: Cuerpo y pie de pagina
Subunidad 10: Navegacion:
Lección 1: Enlace absoluto
Lección 2: Enlace de correo
Lección 3: Enlaces relativos
Lección 4: Comprobacion de la navegacion
Subunidad 11: Etiquetas del head:
Lección 1: Etiquetas del head y metaetiquetas
Lección 2: Propagacion de las metaetiquetas
Subunidad 12: Multimedia:
Lección 1: Insercion de video
Lección 2: Insercion de audio
Subunidad 13: Formularios:
Lección 1: Formulario y campos
Lección 2: Barra horizontal
Subunidad 14: CSS:
Lección 1: Insercion de un DIV
Lección 2: Asignacion de un ID
Lección 3: Color de fondo y de frente
Lección 4: Geometria y margenes
Lección 5: Estructura de CSS
Lección 6: Bordes
Lección 7: Sombras
Lección 8: Transformaciones
Lección 9: Listas
Lección 10: Columnas
Lección 11: Ids multiples
Lección 12: Propiedades de texto
Lección 1: Flotacion 1
Lección 2: Flotacion 2
Subunidad 15: Maquetacion tradicional:
Lección 1: Wrapper
Lección 2: Cabecera
Lección 3: Margen y padding
Lección 4: Fondos
Lección 5: Plantillas
Lección 6: Seccion
Lección 7: Maquetacion de la seccion
Lección 8: Frames
Unidad 7: Transiciones y animaciones
Subunidad 1: Instalando editores de texto:
Lección 1: Gedit y notepad
Lección 2: Configurando nuestro espacio de trabajo
Lección 3: Estilo en el texto
Lección 4: Configuracion de Gedit
Lección 5: Hover
Lección 6: Transiciones
Lección 7: Animaciones
Lección 8: Animaciones 2
Unidad 8: Edicion WYSIWYG con BlueGriffon
Subunidad 1: Maquetacion artistica:
Lección 1: Contenedor
Lección 2: Fondo y frente
Lección 3: Escala y fusion
Lección 4: Formularios
Lección 5: Degradados
Lección 6: Creacion de una nube
Lección 7: Finalizacion y posicion de la nube
Lección 8: Transiciones


Contacto