Crea una LANDING PAGE moderna con HTML CSS Y Javascript
por Jordan Alexander
Construye una landing page desde cero con HTML, CSS y JavaScript: efecto wave, degradados, animaciones CSS, flexbox básico, clip-path y menú responsive.
Recomendado, valoración editorial 4 de 5
verificado 2026-10-01 — sigue siendo gratis en Udemy
Empezar en UdemyRespuesta rápida
Curso gratis de Programación de nivel principiante en Udemy impartido por Jordan Alexander (51 min). Nuestra valoración: 4/5, recomendado. Comprobamos que sigue siendo gratis el 1 de octubre de 2026.
- Veredicto
- 4/5 · Recomendado
- Para quién
- Principiantes en desarrollo web que quieren un primer proyecto visual y completo en menos de una hora.
- Nivel
- Principiante
- Duración
- 51 min · 7 lecciones
- Precio
- Gratis en Udemy
- Autor
- Jordan Alexander
- Plan sugerido
- 1 sem. · 2 h/sem.
- Verificado
- el 1 de octubre de 2026
Nuestro veredicto
Recomendado, valoración editorial 4 de 5Curso breve y práctico para crear una landing page moderna con HTML, CSS y JavaScript, con técnicas visuales atractivas como wave, clip-path y animaciones. Es adecuado para principiantes que quieren un proyecto rápido; no ofrece gran profundidad teórica.
Puntos fuertes
- Proyecto práctico concreto: una landing page completa de principio a fin.
- Duración corta (51 minutos), fácil de terminar en pocas sesiones.
- Lista clara de técnicas CSS y JavaScript que se practican.
A tener en cuenta
- Solo hay un capítulo marcado, así que no es posible navegar por temas con precisión.
- No se indica el año de publicación; las técnicas pueden estar algo dated, aunque HTML y CSS cambian poco.
- Flexbox se trata solo en sus principios básicos y la duración limita la profundidad.
- La descripción no menciona ejercicios ni material descargable.
De qué trata
Curso en siete lecciones y 51 minutos que guía la creación de una landing page moderna con HTML5, CSS3 y JavaScript, partiendo de cero. El proyecto incorpora un efecto wave, degradados, ilustraciones y tipografías de Google Fonts.
Según la descripción, también se trabajan animaciones con CSS sin frameworks, los principios básicos de flexbox, la propiedad clip-path y un menú responsive hecho con JavaScript puro. Los datos solo marcan un capítulo, «Introducción».
- Landing page moderna con HTML, CSS y JavaScript
- Efecto wave y degradados
- Animaciones CSS sin frameworks
- Menú responsive con JavaScript puro
- Flexbox básico y propiedad clip-path
Para quién es este curso
- Principiantes en desarrollo web que quieren un primer proyecto visual y completo en menos de una hora.
- Personas que conocen lo básico de HTML y CSS y quieren practicar efectos como wave, degradados y clip-path.
- Quien busca aprender a hacer un menú responsive con JavaScript puro y animaciones CSS sin frameworks.
Mejor busca otro si…
- Quien ya maneja flexbox, clip-path y animaciones CSS y busca contenido avanzado.
- Quien busque un curso extenso de JavaScript o de diseño web en profundidad.
Antes de empezar
- La descripción indica que se crea la landing page desde cero, así que no exige conocimientos previos.
Qué sabrás hacer al terminar
- Crear una landing page moderna con HTML, CSS y JavaScript.
- Aplicar el efecto wave y usar degradados e ilustraciones en el diseño.
- Usar Google Fonts y animaciones CSS sin frameworks.
- Construir un menú responsive con JavaScript puro.
- Entender los principios básicos de flexbox y usar la propiedad clip-path.
Estructura del curso
- 01
Introducción
Único capítulo marcado en los datos. El curso tiene 7 lecciones y 51 minutos en total; la descripción enumera los temas: landing page, efecto wave, degradados, ilustraciones, Google Fonts, animaciones CSS, menú responsive, flexbox y clip-path.
Capítulos del vídeo
- 01Introducción
Plan de estudio sugerido
1 semana · unas 2 h por semana
- 1.Sesión 1: ve las primeras lecciones y reproduce la estructura HTML y los estilos base, con fuentes y degradados.
- 2.Sesión 2: practica el efecto wave, clip-path y las animaciones CSS pausando tras cada lección.
- 3.Sesión 3: construye el menú responsive con JavaScript y personaliza la página con tus propios textos e imágenes.
El plan cuenta con tiempo para pausar y practicar, no solo con la duración del vídeo. Si quieres adaptarlo a tu semana, lee cómo montar tu plan de estudio semanal.
Consejos para seguirlo
- Escribe el código a la vez que el vídeo en lugar de solo mirarlo; son solo 51 minutos y se presta a ello.
- Al terminar, cambia colores, fuentes e ilustraciones para comprobar que entiendes cada propiedad.
- Prueba el menú responsive redimensionando la ventana o usando las herramientas de desarrollo del navegador.
- Si flexbox te resulta poco claro, completa el aprendizaje con un curso específico de flexbox.
Antes y después de este curso
- Antes de este cursoDesarrollo Web con HMTL, CSS y Bootstrap 4! Curso desde ceroRefuerza las bases de HTML y CSS desde cero antes de montar la landing page.
- Después de este cursoCurso de FlexBox desde 0Profundiza en flexbox, que aquí solo se ve en sus principios básicos.
- Después de este cursoCURSO DE CSS COMPLETO: De Principiante a Front-EndAmplía el CSS con un recorrido más completo hacia el desarrollo front-end.
- Después de este cursoJavaScript - Curso COMPLETO desde 0 | Paso a paso y con Ejemplos 👨💻Permite profundizar en JavaScript más allá del menú responsive.
Cómo lo presenta Jordan Alexander
Aprende a crear una landing page moderna desde 0 con HTML5 CSS3 y JS (Javascript) con animaciones hechas en CSS3
En el curso "Crea una landing page desde 0" aprenderás : - Crear una Landing Page - Crear el efecto wave - Usar degradados - Usar ilustraciones - Usar Google Fonts - Animaciones con CSS (Sin frameworks) - Hacer un menu responsive con Javascript puro - Principios basicos de flexbox -…
Extracto de la descripción original en Udemy.
Preguntas frecuentes
+¿Necesito saber programar para empezar?
Según la descripción, la landing page se crea desde cero, por lo que no se piden conocimientos previos.
+¿Cuánto dura?
Son 51 minutos repartidos en 7 lecciones. Con pausas para practicar, puede completarse en unas 2 horas o poco más.
+¿Qué se construye?
Una landing page moderna con efecto wave, degradados, ilustraciones, Google Fonts, animaciones CSS y un menú responsive hecho con JavaScript puro.
+¿Usa frameworks?
No. La descripción indica que las animaciones con CSS se hacen sin frameworks y que el menú usa JavaScript puro.
Análisis editorial elaborado con ayuda de IA a partir de la descripción, los capítulos y la duración publicados en Udemy, y revisado según nuestro método. El contenido del curso es obra de Jordan Alexander; si ves algún error, avísanos.
Guías para sacarle partido
Más cursos de Programación
Agentic AI – Complete Course for Beginners
Curso de unas 24 horas para construir sistemas de agentes de IA con LangChain y LangGraph: Pydantic, flujos de trabajo, memoria, RAG y despliegue en AWS y Render.
Aprende Accesibilidad Web paso a paso
Introducción práctica a la accesibilidad web: pautas y leyes, contenido, navegación, diseño e interacción accesibles, relación con el SEO y evaluación de sitios.
Aprende Godot - Curso completo desde cero
Crea tu primer videojuego 3D en Godot 4 desde cero: escenas, nodos, GDScript, físicas, animaciones, sonido y exportación a .exe.
Aprende JavaScript Ahora! curso completo desde cero para principiantes
Curso de JavaScript desde cero: entorno, variables, tipos, operadores, control de flujo, diez ejercicios y objetos con funciones constructoras.