Curso de Diseño Web Responsivo (HTML5 + CSS3 + Bootstrap)

Categories: Desarrollo Web
Lista de deseos Share
Share Course
Page Link
Share On Social Media

Acerca de este curso

> Módulo 1: INTRODUCCIÓN AL DISEÑO WEB RESPONSIVO 

Explorando cómo funciona RWD

Entendiendo los elementos de RWD

Apreciando la importancia de RWD

Comparando RWD con diseño adaptativo

Preparando nuestro entorno de desarrollo.

Teniendo en cuenta una estrategia adecuada.

Explorando las mejores prácticas

Configuración de un flujo de trabajo de desarrollo

Explorando errores comunes

 

> Módulo 2: HTML5 PARA DISEÑOS WEB RESPONSIVOS

Comenzando una página HTML5 de la manera correcta para RWD

Nuevos elementos semánticos en HTML5.

Características HTML obsoletas e inutilizables en RWD

Incrustar medios en HTML5

Introducción a multimedia responsivo y iframes

Una técnica importante: ‘offline primero’

 

> MÓDULO 3: CSS3, NUEVAS CARACTERÍSTICAS Y RWD

Conceptos básicos de CSS (posición, márgenes, padding y más)

Sombras, bordes redondeados y tipografía personalizada

Animaciones y Transformaciones

Manipulación de gradientes, backgrounds múltiples y parallax

Cuáles características CSS3 sí y cuáles no recomendable usar en RWD 

 

> Módulo 4: CREANDO DISEÑOS FLUIDOS

Presentación de diseños de grids flexibles

Entendiendo los diferentes tipos de diseño

Configuración de la ventana gráfica disponible para su uso

Explorando los beneficios de los diseños de grid flexibles

Entendiendo la mecánica de los diseños de grids.

Implementando un diseño de grid pre-construido

Explorando el uso de flexbox

 

> Módulo 5: AGREGAR ELEMENTOS MULTIMEDIA RESPONSIVOS

Hacer que los medios respondan

Hacer que el video sea responsivo

Hacer que el texto se ajuste a la pantalla

 

> Módulo 6: EXPLORANDO MEDIA QUERIES CON CSS3

Entendiendo los media queries

Identificando puntos de ruptura comunes

Creando algunos ejemplos prácticos.

Examinando algunos errores comunes

Explorando las mejores prácticas

 

> Módulo 7: PRUEBAS Y OPTIMIZACIÓN DEL RENDIMIENTO

Entendiendo la importancia de la velocidad.

Comprender por qué las páginas se cargan lentamente

Optimizando el rendimiento

Probando el rendimiento de nuestro sitio.

Mejores prácticas

Proporcionar soporte para navegadores antiguos

Teniendo en cuenta la compatibilidad entre navegadores

 

> Módulo 8: TRABAJANDO CON CANVAS, SVG, GEOLOCALIZACIÓN Y ALMACENAMIENTO LOCAL

Conociendo el API de Canvas

Conociendo cómo trabaja SVG

Animación con Canvas y SVG

Uso de API para geolocalización

Uso de LocalStorage y SessionStorage

 

> Módulo 9: ENRIQUECIENDO TUS DISEÑOS WEB RESPONSIVOS CON BOOTSTRAP

Lo que Bootstrap 4 tiene para ofrecer

Configurando un nuevo proyecto

El sistema de grid de Bootstrap

Elementos de imagen

Utilidades responsivas

 

> Módulo 10: CONSTRUYENDO UN DISEÑO WEB RESPONSIVO CON BOOTSTRAP

Creando secciones

Añadiendo componentes de Bootstrap

Navegación, encabezados de página, pies de página, alertas y contenido

Iconos

Creando y personalizando formularios.

Validación de formularios

Indicadores de progreso

Añadiendo contenido usando objetos multimedia

Group Lists, Accordeons y elementos colapsables

 

> Módulo 11: ACELERAR EL DESARROLLO UTILIZANDO COMPLEMENTOS DE TERCEROS y BOOTSTRAP

Paginación mejorada usando bootpag

Viendo imágenes usando Bootstrap Lightbox

Mejorando una lista con DataTables

Typeahead

Popovers

 

> Módulo 12: PERSONALIZANDO TUS COMPLEMENTOS BOOTSTRAP

Anatomía de un plugin

Personalizando complementos

Escribiendo un plugin personalizado de Bootstrap

What Will You Learn?

  • Crear proyectos Web Responsivos, con todo el poder de HTML5, CSS3 y Bootstrap.
  • Explorar varias opciones y técnicas disponibles en diseño web responsivo
  • Comprender lo que se puede lograr en el navegador, sin el uso de herramientas de terceros
  • Ejecutar media queries que respondan a condiciones distintas del browser del usuario.
  • Mejorar el rendimiento del diseño web responsivo
  • Mantener la compatibilidad de sus diseños web responsivos en los navegadores
  • Comprender los fundamentos de Bootstrap e implementarlo enriqueciendo proyectos Web

Student Ratings & Reviews

No Review Yet
No Review Yet