Curso Web Responsive Design. Ejemplos prácticos

Web Responsive Design. Ejemplos pr%C3%A1cticos v2b
DESCRIPCIÓN

Siguiendo los conceptos fundamentales de responsive design, este curso demostrará su utilización práctica y te enseñará a enriquecer la apariencia y las posibilidades de uso de nuestros sitos web a través de diversos dispositivos. Aprenderás a diseñar para sacarle partido a las media queries y luego verás cómo adaptar la navegación por los contenidos (también imágenes o vídeo) a los diferentes cambios de tamaño de pantalla usando CSS y jQuery, sacando partido a las características de los distintos tipos de dispositivo móvil.

DATOS TÉCNICOS

Web Responsive Design. Ejemplos prácticos
Fecha de publicación: 29-agosto-2014 | Peso: 1.37 GB | Idioma: Español | Formadores: Jorge González Villanueva, James Williamson | Duración: 4:30 horas

CONTENIDO

Introducción a Responsive Design Aplicado

Introducción al diseño web responsive 01:06
Los ejercicios del curso de Responsive Design Aplicado 01:22
Compatibilidad con versiones antiguas de Explorer 01:40
El proyecto de diseño responsive terminado 02:12

Planificación de responsive designs

Planificación de los contenidos del sitio web 10:43
Creación de mockups 08:60
Planeamos la experiencia de usuario para nuestro responsive design 05:20
Estructuramos las regiones de la página 05:29
Estructuramos el contenido pensando en múltiples dispositivos 08:40

Construcción de Responsive Layouts

Controlamos el viewport 03:05
Definimos los estilos por defecto 07:46
Determinamos los breakpoints del contenido 05:11
Definimos media queries 05:49
Construcción del layout básico para ordenador 06:17
Construcción del layout básico para tablet 05:28
Construcción del layout básico para móviles 04:23
Depuración del layout de ordenador 10:17
Depuración del layout de tablet 08:11
Depuración del layout de móvil 07:12

Navegación responsive

Definimos la estrategia de navegación responsive 04:09
Creación de la estructura básica de los menús 05:30
Aplicamos los estilos básicos a los menús 09:35
Utilización de sprites CSS en los menús 05:47
Creación de estructuras complejas de menús 06:03
Utilización de jQuery para el comportamiento de los menús 07:28
Respuesta a los cambios de tamaño de pantalla 03:32
Minimizamos menús para tamaños pequeños de pantalla 06:28
Expandimos submenús mediante eventos touch 04:29
Reemplazamos los estilos hover con touch 08:05
Reseteamos los menús en pantallas grandes 06:10
Prevención de conflictos 03:18
Añadimos fallbacks 04:20
Reemplazamos dinámicamente los menús 04:20
Convertimos menús en selects 08:12
Convertimos selects en menús 03:19

Creación de responsive media

Creación de imágenes fluidas 09:01
Generamos un vídeo fluido 05:10
Uso de CSS en lugar de imágenes 06:20
Visión de conjunto de la galería de imágenes 02:49
Estructuramos una galería de imágenes responsive 03:10
Controlamos los estilos de la galería 07:37
Añadimos la funcionalidad a la galería de imágenes 07:13

Mejoramos sitios para móviles

Campos de formulario HTML5 03:58
Añadimos funcionalidad para móviles 04:22
Añadimos iconos para la pantalla de entrada 03:43

Gestión de recursos para diseño responsive

Visión general de Modernizr y Respond.js 03:14
Cargamos recursos con Modernizr 04:28
Carga condicional de recursos 04:36
Testeamos sitios responsive 02:47

Conclusión de Responsive Design Aplicado

Recursos adicionales de diseño responsive 02:11

CAPTURAS
Web%2BResponsive%2BDesign.%2BEjemplos%2Bpr%C3%A1cticos 2014.10.www.bacterias%2B(1)
Web%2BResponsive%2BDesign.%2BEjemplos%2Bpr%C3%A1cticos 2014.10.www.bacterias%2B(2)
Web%2BResponsive%2BDesign.%2BEjemplos%2Bpr%C3%A1cticos 2014.10.www.bacterias%2B(3)
Web%2BResponsive%2BDesign.%2BEjemplos%2Bpr%C3%A1cticos 2014.10.www.bacterias%2B(4)
Web%2BResponsive%2BDesign.%2BEjemplos%2Bpr%C3%A1cticos 2014.10.www.bacterias%2B(5)
Web%2BResponsive%2BDesign.%2BEjemplos%2Bpr%C3%A1cticos 2014.10.www.bacterias%2B(6)
Web%2BResponsive%2BDesign.%2BEjemplos%2Bpr%C3%A1cticos 2014.10.www.bacterias%2B(7)
Web%2BResponsive%2BDesign.%2BEjemplos%2Bpr%C3%A1cticos 2014.10.www.bacterias%2B(8)
ENLACES PRIVADOS SIN PUBLICIDAD

ENLACES PÚBLICOS CON PUBLICIDAD

MEGA | MYUPLOAD | INCLOUDDRIVE | 1FICHIER

CONTRASEÑA/PASSWORD PARA DESCOMPRIMIR

www.bacterias.mx

WEB DEL AUTOR

Add a Comment

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *