Saltar al contenido
Diploma

Diseño y Desarrollo Web Visual con Webflow

Aprenderás el modelo de caja y el sistema de clases de Webflow, a organizar layouts con flexbox y grid, adaptar el diseño a distintos dispositivos y modelar contenido dinámico con…

Iniciar sesión para acceder

Contenido revisado: septiembre 2026

Lecciones 25
Formación Diploma
Tu progreso —

Qué aprenderás

  • Construir la estructura de una página con el modelo de caja y un sistema de clases mantenible, sin duplicar estilos.
  • Organizar layouts con flexbox y grid, y adaptar el diseño de forma responsive a distintos breakpoints y dispositivos.
  • Modelar una colección CMS y crear plantillas dinámicas que muestran, filtran y ordenan el mismo contenido de formas distintas.
  • Planificar, construir y revisar un sitio completo propio, listo para publicar con SEO básico y rendimiento comprobados.

Contenido del curso

5 módulos · 25 lecciones

Módulo 01 Módulo 1 5
  1. 01 Por qué Webflow no es “un WordPress visual”
  2. 02 El modelo de caja: márgenes, relleno y bordes
  3. 03 El canvas, el panel de estilos y el navegador de elementos
  4. 04 Jerarquía de elementos: contenedores, secciones y bloques
  5. 05 Construir tu primera estructura de página
Módulo 02 Módulo 2 5
  1. 06 El sistema de clases: la base de un diseño mantenible
  2. 07 Clases combinadas: variaciones sin duplicar estilos
  3. 08 Estados: hover, focus y su impacto en la experiencia
  4. 09 Tipografía: escala y jerarquía visual del texto
  5. 10 Estilos globales: coherencia en todo el sitio
Módulo 03 Módulo 3 5
  1. 11 Flexbox: organizar elementos en una dirección
  2. 12 Grid: organizar elementos en dos dimensiones
  3. 13 Breakpoints: qué son y cómo Webflow los gestiona
  4. 14 Diseño responsive: adaptar el layout sin rehacerlo desde cero
  5. 15 Depurar problemas de layout entre distintos dispositivos
Módulo 04 Módulo 4 5
  1. 16 Qué es una colección CMS y cuándo la necesitas
  2. 17 Campos de colección: modelar el contenido antes de diseñarlo
  3. 18 Plantillas dinámicas: una plantilla, muchos contenidos
  4. 19 Filtrar y ordenar contenido dinámico en una lista
  5. 20 Interacciones básicas: animaciones que aportan, no que distraen
Módulo 05 Módulo 5 5
  1. 21 Planificar tu sitio: estructura, contenido y páginas necesarias
  2. 22 Construir la estructura y el sistema de estilos del sitio
  3. 23 Ajustar el layout responsive en todos los dispositivos relevantes
  4. 24 Integrar una colección CMS real en el sitio
  5. 25 Revisión final antes de publicar: SEO básico, rendimiento y comprobación completa