Curso de Responsive Web Design con JQuery

Hoy en día Internet es una de las formas de comunicarnos más importantes. La red se ha extendido por todo el mundo y son millones los usuarios que navegan cada día por ella, existiendo miles de páginas web que dan servicio a estos usuarios.
Los sitios web ofrecen a los usuarios temáticas muy diferentes, sitios web de compra, páginas de juegos on-line, formación on-line, web de contenidos como videos, material, un sinfín de opciones con todo aquello que podamos imaginar.
Existiendo esta gran cantidad de páginas web es necesario para atraer a los posibles visitantes que sean lo más atractivas posibles.
Para diseñar páginas web atractivas debemos usar HTML que es el lenguaje de marcas diseñado para tal efecto, las hojas de estilo CSS nos permiten crear estilos específicos para nuestras páginas, que combinado con lenguajes como JavaScript nos permiten aplicar efectos especiales para interactuar con los usuarios.
Este curso está desarrollado de tal forma que el alumno pueda aprender de forma sencilla y muy práctica como diseñar páginas web avanzadas siguiendo las nuevas tendencias como Responsive Web Desing.

Módulo I: Fundamentos de programación
Unidad 1. Algoritmos y programas

•  Qué es un algoritmo?
•  Programas y Aplicaciones
•  Lenguajes de programación
•  Traductores e intérpretes
•  Compiladores
•  Videoejercicio 1
•  Autopráctica  Algoritmos y programas
•  Autopráctica  Algoritmos y programas II

Unidad 2. Tipos de programación

•  Fases del ciclo de vida de una aplicación
•  Programación desordenada
•  Programación estructurada
•  Programación modular
•  Programación orientada a objetos
•  Autopráctica  Ciclo de vida de una aplicación
•  Autopráctica  Tipos de programación

Unidad 3. Diagramas de flujo

•  Diagramas de flujo
•  Elementos de los diagramas de flujo
•  Realizando diagramas de flujo
•  Videoejercicio 1
•  Videoejercicio 2
•  Autopráctica  Diagramas de flujo

Unidad 4. Pseudocódigo

•  Pseudocódigo
•  Escritura en pseudocódigo
•  Creación de algoritmos
•  Variables
•  Constantes
•  Tipos de Datos
•  Operadores y expresiones
•  Videoejercicio 1
•  Autopráctica  Pseudocódigo

Unidad 5. Elementos de un programa

•  Instrucciones primitivas
•  Instrucciones de asignación
•  Instrucciones de entrada y salida
•  Palabras reservadas
•  Comentarios
•  Contadores
•  Acumuladores
•  Interruptores
•  Videoejercicio 1
•  Videoejercicio 2
•  Autopráctica  Elementos de un programa

Unidad 6. Estructuras de control

•  Estructuras de control
•  Alternativa simple
•  Alternativa doble
•  Alternativa múltiple
•  Estructura mientras
•  Estructura repetir
•  Estructura para o desde
•  Estructuras selectivas anidadas
•  Estructuras repetitivas anidadas
•  Videoejercicio 1
•  Videoejercicio 2
•  Autopráctica  Estructuras de control

Unidad 7. Estructuras de datos: Tablas

•  Tablas unidimensionales
•  Tablas bidimensionales
•  Tablas multidimensionales
•  Operaciones con tablas
•  Videoejercicio 1
•  Videoejercicio 2
•  Autopráctica  Tablas

Unidad 8. Programación modular

•  La programación modular
•  Funciones
•  Procedimientos
•  Parámetros
•  Paso de parámetros
•  Ámbito de las variables
•  Recursividad
•  Videoejercicio 1
•  Videoejercicio 2
•  Autopráctica  Programación modular

Unidad 9. Programación orientada a objetos

•  La programación orientada a objetos
•  Clases
•  Objetos
•  Relaciones entre clases
•  Abastracción
•  Encapsulamiento
•  Herencia
•  Polimorfismo
•  Videoejercicio 1
•  Autopráctica  Programación orientada a objetos

Módulo II: Responsive Web Design
Unidad 10. Reponsive Web Design

•  Qué es Responsive Web Design?
•  Características del Responsive Web Design
•  Ventajas e inconvenientes
•  Crear un diseño adaptable: CSS
•  Ejemplo de una página web con diseño Responsive Web Design
•  Ejemplo de una página web sin diseño Responsive Web Design
•  Cómo comprobar el diseño de tu página Web
•  CSS: Medias Queries
•  Mobile first
•  Patrones de diseño adaptivo
•  Diseñar para varios dispositivos en papel
•  Plantillas para diseñar
•  Navegadores que soportan Responsive Web Design
•  Video Ejercicio  Reponsive Web Design
•  Autopráctica  Opera mobile emulator
•  Autopráctica  Responsive web Design

Unidad 11. Creando un diseño adaptable

•  Cómo comenzar a diseñar
•  Cómo crear un diseño adaptable
•  El HTML de mi diseño adaptable
•  Meta tags
•  El CSS de mi diseño adaptable
•  Medias Queries
•  Diseño web fluido
•  Cálculo de porcentajes
•  Fuentes flexibles
•  Imágenes flexibles
•  Resize Windows
•  Video Ejercicio  Creando un diseño adaptable
•  Autopráctica  Creando un diseño adaptable

Unidad 12. Web con responsive design

•  Frameworks
•  Booststrap
•  Semantic
•  Skeleton
•  Less Framework
•  Columnal
•  Video ejercicio  Web con responsive design
•  Autopráctica  Patrón de diseño columnal
•  Autopráctica  Patrón de diseño bootstrap

Módulo III: Programación con HTML5
Unidad 13. HTML5

•  Qué es HTML5?
•  La plantilla de HTML5
•  DOCTYPE
•  El elemento HTML
•  El elemento HEAD
•  El elemento body
•  El elemento meta
•  El elemento title
•  El elemento link
•  Funciona HTML5 en navegadores antiguos
•  Cierre de etiquetas en HTML5
•  Video ejercicio  HTML5
•  Autopráctica  Código fuente
•  Autopráctica  Crea una página web

Unidad 14. Estructura de página HTML5

•  El esquema de documento
•  Elemento header
•  Elemento nav
•  Elemento section
•  Elemento aside
•  Elemento footer
•  Elemento article
•  Elemento Hgroup
•  Elemento figure
•  Elemento figcaption
•  Elemento mark
•  Elemento progress y meter
•  Elemento time
•  Elemento dialog
•  Elemento embed
•  Video ejercicio  Estructura de página HTML5
•  Autopráctica  Estructura de página HTML5
•  Autopráctica  Insertando contenido a la página

Unidad 15. Nuevas características

•  Elementos eliminados en HTML5
•  Atributos eliminados en HTML5
•  Elementos de bloque dentro de vínculos
•  Cambios en el texto
•  Negrita
•  Cursiva
•  Tamaño del texto
•  Elemento cite
•  Listas de descripción
•  Elemento details
•  Listas ordenadas personalizadas
•  Estilos con scoped
•  Video ejercicio  Nuevas características
•  Autopráctica  Realizando cambios
•  Autopráctica  Listas

Unidad 16. Vídeo y Audio con HTML5

•  El video con HTML5 en los navegadores
•  Elemento video
•  Atributos del elemento video
•  Formatos de video
•  El atributo autoplay
•  El atributo loop
•  El atributo preload
•  El atributo poster
•  Elemento audio
•  Crear controles personalizados
•  Video ejercicio  Vídeo y Audio con HTML5
•  Autopráctica  Video y audio
•  Autopráctica  Atributos de Video

Unidad 17. Formularios Web con HTML5: Atributos

•  El atributo required
•  El atributo autofocus
•  El atributo min
•  El atributo max
•  El atributo pattern
•  El atributo placeholder
•  El atributo step
•  El atributo accept
•  El atributo readonly
•  El atributo multiple
•  El atributo form
•  El atributo autocomplete
•  El atributo datalist
•  El atributo list
•  Video ejercicio  Formularios Web con HTML5: Atributos
•  Autopráctica  Formulario Web HTML5. Atributos

Unidad 18. Formularios Web con HTML5: Elementos

•  Nuevas entradas de datos en formularios
•  El elemento output
•  El elemento keygen
•  El elemento form
•  El elemento optgroup
•  El elemento textarea
•  Video ejercicio  Formularios Web con HTML5: Elementos
•  Autopráctica  Formulario Web HTML5. Elementos

Unidad 19. Canvas de HTML5

•  La etiqueta Canvas de HTML5
•  Para qué sirve Canvas
•  Preparando el lienzo
•  Canvas de HTML5 y JavaScript
•  Dibujo de figuras con Canvas de HTML5 I
•  Dibujo de líneas y combinación
•  Procesando imágenes
•  Video ejercicio  Canvas de HTML5
•  Autopráctica  elemento.rect
•  Autopráctica  Curvas bezier

Módulo IV: Hojas de Estilo CSS3
Unidad 20. Introducción a CSS3

•  Qué es CSS3?
•  Selectores CSS3
•  Selectores relacionales
•  Selectores de atributo
•  Pseudoclases
•  Pseudoclases estructurales
•  Pseudoelementos y contenido generado
•  Contenido generado
•  Video ejercicio  Introducción a CSS3
•  Autopráctica  Selectores
•  Autopráctica  Pseudoelementos

Unidad 21. Colores y texto en CSS3

•  Colores HSL
•  Colores HSLA
•  Colores RGBA
•  Opacidad
•  Textshadow
•  Textoverflow
•  Rotura de palabras largas
•  Web Fonts
•  BorderRadius
•  Sombras
•  Video ejercicio  Colores y texto en CSS3
•  Autopráctica  Página web formulario
•  Autopráctica  BorderRadius y sombras

Unidad 22. Degradados en CSS3

El objetivo general del curso es conseguir que el alumno sea capaz de realizar páginas web atractivas y cumpliendo con las premisas del Responsive Web Design utilizando HTML, hojas de estilo CSS, el lenguaje JavaScript y el framework JQuery.

Curso bonificable.