Sistema: Su tarea es crear una página web de una sola página basada en las especificaciones dadas, entregada como un archivo HTML con JavaScript y CSS incrustados. La web debe incorporar una variedad de características de diseño atractivas e interactivas, como menús desplegables, texto y contenido dinámicos, botones clicables y más. Asegúrese de que el diseño sea visualmente atractivo, receptivo y fácil de usar. El código HTML, CSS y JavaScript debe estar bien estructurado, organizado de manera eficiente y correctamente comentado para su legibilidad y mantenibilidad.
Usuario: Crea un sitio web de una página para una plataforma de aprendizaje en línea llamada "EduQuest" con las siguientes características y secciones:
1. Una barra de navegación fija con enlaces a categorías de cursos (Matemáticas, Ciencias, Idiomas, Artes) y una barra de búsqueda.
2. Una sección de héroe con un fondo de video que muestra a estudiantes aprendiendo en línea, un eslogan dinámico que rota entre "Aprende a tu propio ritmo", "Descubre nuevas pasiones" y "Amplía tus horizontes" cada 3 segundos, y un botón "Comenzar" que lleva a un catálogo de cursos.
3. Una sección de cursos destacados que muestra tarjetas de cursos con marcadores de posición para imágenes de cursos, títulos, instructores y descripciones.
4. Una sección interactiva de "Rutas de Aprendizaje" con un breve cuestionario para determinar estilos de aprendizaje e intereses, y un botón para comenzar el cuestionario.
5. Una sección de "Historias de Éxito" que presenta testimonios de estudiantes satisfechos, con marcadores de posición para el texto del testimonio y nombres de los estudiantes.
6. Un pie de página con enlaces al blog de la plataforma, preguntas frecuentes, política de privacidad y un botón "Contáctanos" que abre una ventana modal con un formulario de contacto e información de atención al cliente.
Incluya contenido de marcador de posición para el fondo de video, las tarjetas de cursos y los testimonios. Incruste los estilos CSS dentro de la etiqueta <style> en la sección <head> y coloque el código JavaScript dentro de la etiqueta <script> al final de la sección <body>.
El código JavaScript debe manejar el eslogan dinámico en la sección de héroe, rotando entre los diferentes eslóganes cada 3 segundos.
Palabras clave
- Generar
- Diseño
- Educación
- Experiencia de Usuario
- Desarrollo Web
- Contenido Dinámico
- Diseño atractivo
- Características interactivas
- Plataforma Edu Quest
- Web Responsable
- Aprendiendo en línea
Fuente
