Entiende y desarrolla completos sitios web basados en el Diseño Adaptativo.
El diseño web adaptativo (RWD) basa su filosofía en la adaptación de la apariencia de las páginas web al dispositivo (PC, móvil, tablet…) que se esté utilizando para visualizarla.
¿A quién va dirigido?
A todos los diseñadores web que quieran mejorar la calidad y la usabilidad de sus páginas web haciéndolas responsive para que se adapten a todos los dispositivos.
Objetivos
Con este curso, el alumno será capaz de entender y desarrollar completos sitios web basados en el Diseño Adaptativo. Se pondrá en conocimiento del alumno, de la misma forma, los frameworks más destacados para el diseño web adaptativo.
¿Cuáles son los requisitos?
Aunque los conceptos sobre Diseño Web Adaptativo y los diferentes frameworks serán desde un nivel básico, se recomienda tener ciertos conocimientos en desarrollo de sitios web con HTML y CSS.
Temario
Introducción
- ¿Qué es y qué no es Responsive Web Design?
- Pasado y Futuro del diseño web
- Ejemplos de Responsive Web Design
- Mobile First
- Diseño Gráfico vs Diseño Web
- Reglas de Estilos Multidispositivo
- Ventajas del Responsive Web Design
- Perfiles Profesionales involucrados en realizar RWD
- Breakpoints más comunes en RWD
- Uso de Menús en RWD
- Resumen: Mejores Prácticas para RWD
Imágenes en Diseño Adaptativo
- Introducción
- Adaptive Images
- Picturefill
- Imágenes Adaptativas en los CMS
- Vídeos Adaptativos
Texto en Diseño Adaptativo
- Introducción
- Unidades de Medida
- FitText
- TypeKit
- FontSpace Generators
- Google Fonts
- Tablas en Diseño Adaptativo
Cómo construir un sitio web con RWD
- Introducción
- Aspectos a tener en cuenta
- Viewport
- Densidad de Pantalla
- Diseños Líquidos
- Ritmo Vertical
- Media Queries
Frameworks
- Introducción
- Diferencias entre Grids y Frameworks
- ¿Por qué usar frameworks para diseño RWD?
- ¿Cómo escoger un Framework?
Bootstrap
- Introducción
- Características de Bootstrap
- Paso a paso para empezar con Bootstrap
- Los temas en Bootstrap
- Ejemplos oficiales de Bootstrap
- Compañías que usan Bootstrap
Boostrap CSS
- Introducción
- El container
- Responsive Breakpoints
- Z-Index
- La cuadrícula de Bootstrap
- La tipografía
- Código
- Listas
- Tablas
- Imágenes
- Figuras
- Utilidades de Bootstrap
Boostrap Components
- Introducción
- Alerts
- Etiquetas
- Navs
- Navbars
- Breadcrumbs
- Botones y grupos de botones
- Desplegables
- Cards
- Collapse
- Input Groups
- Formularios
- List Groups
- Ventanas Modales, Popovers y Tooltips
- Scrollspy
- Paginación
- Barras de progreso
- Jumbotron
Materialize
- Introducción
- Material Design
- Materialize
- Principios de Materialize
- Los temas en Materialize
- CSS Materialize
- Javascript
- Componentes
- Mobile
- Casos de éxito
- Instalación/Descarga de Materialize
- Bootstrap vs Materialize
Foundation
- Introducción
- Características
- Foro oficial
- Notable Code
- Los temas en Foundation
- Foundation Blocks
- Foundation Icons
- Tablas Responsive en Foundation
- Componentes
- Foundation Grid
- Empresas que usan Foundation
- Zurb Playground
- Instalación/Descarga de Foundation
- Bootstrap vs Foundation
- Foundation vs Materialize
Otros Frameworks interesantes
- Base
- Bulma
- Ulkit
- Skeleton
- Vuetify
Tutor personal
Proyecto final
Diploma de certificación
Plataforma online
Disponibilidad horaria
Bolsa de empleo
¿Quieres realizar esta formación sin coste para tu empresa?
¡Sin desplazamientos! Impartimos la formación en tu empresa.
Imagina Formación es una entidad organizadora de la Fundación Estatal de modo que puedes gestionar la formación bonificada de los cursos con nosotros. Nos encargamos de todos los trámites para conseguir la bonificación sin ningún coste adicional. Cumplimos con todos los requisitos para que nuestros cursos sean 100% bonificables.
Otros clientes que están aprendiendo con nosotros…
¿Tienes alguna duda? Puedes hablar con uno de nuestros profesores
¡Pregúntanos!