Visión y Valor Consulting

Responsive Web Design HTML5, CSS3, JavaScript, JQuery

Visión y Valor Consulting
  • Imparte:
  • Modalidad:
    Online
  • Precio:
    720 €
  • Comienzo:
    Consultar rellenando el formulario
  • Lugar:
    Se imparte Online
  • Duración:
    96 horas

Dirigido

Profesionales del diseño WEB y a todas aquellas personas que sienten interés por empezar a diseñar webs multidispositivo.

Objetivos

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. 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.

Programa

MÓDULO I: FUNDAMENTOS DE PROGRAMACIÓN   01.- 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 Test - Algoritmos y programas   02.- 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 Test - Tipos de programación   03.- 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 Autopráctica - Diagramas de flujo II Test - Diagrama de flujo   04.- 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 Autopráctica - Pseudocódigo II Test - Pseudocódigo   05.- 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 Autopráctica - Elementos de un programa II Test - Elementos de un programa   06.- 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 Autopráctica - Estructuras de control II Test - Estructuras de control   07.- Estructuras de datos: Tablas   Tablas unidimensionales Tablas bidimensionales Tablas multidimensionales Operaciones con tablas Videoejercicio 1 Videoejercicio 2 Autopráctica - Tablas Autopráctica - Tablas II Test - Estructuras de datos: Tablas   08.- 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 Autopráctica - Programación modular II Test - Programación modular   09.- 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 Autopráctica - Programación orientada a objetos II Test - Programación orientada a objetos   MÓDULO II: RESPONSIVE WEB DESIGN   01.- 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 Test - Responsive Web Design   02.- 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 Autopráctica - Creando un diseño adaptable II Test - Creando un diseño adaptable   03.- Web con responsive design   Frameworks Booststrap Booststrap II Semantic Semantic II Skeleton Skeleton II Less Framework Less Framework II Columnal Video ejercicio - Web con responsive design Autopráctica - Patrón de diseño columnal Autopráctica - Patrón de diseño bootstrap Test - Web con responsive design   MÓDULO III: PROGRAMACIÓN CON HTML5   01.- 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 Test - HTML5   02.- 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 Test - Estructura página HTML5   03.- 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 Test - Nuevas características   04.- 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 Test - Vídeo y Audio con HTML5   05.- Formularios Web con HTML5: Atributos   El atributo required El atributo autofocus El atributo min El atributo max

¡Infórmate ahora sin compromiso!

Publicidad

Cursos Relacionados

Ver otros cursos de...