Asignatura: Desarrollo Web Semestre: IX
Docente: Larry Pacheco Ayazo Tema: HTML + CSS
Aspectos a tener en cuenta
Debe subir el sitio a hosting y enviar URL del proyecto
Las páginas deben ser orientada al proyecto que va a realizar
En el diseño de las páginas web no puede utilizar JavaScript
Realizar las actividades en grupos de 2 personas
Cada página al momento de ser compartida a través de cualquier rede social debe poder
compartir sus metadatos y generar las miniaturas correspondientes. Incluyendo sistemas de
mensajería como whatsapp. Utilice Open Graph.
Defina en cada página un header, nav, aside, section, article y footer.
No se deben utilizar plantillas css predefinidas, ni descargadas.
Actividad 1
Diseñe una página que contenga un formulario con las siguientes especificaciones:
Campo para ingresar números con máximo 10 caracteres
Dos campos para ingresar texto con máximo 40 caracteres
Un campo para ingresar texto multi línea con máximo 200 caracteres. El elemento debe tener
tres filas.
Campo para ingresar fecha
Campo para ingresar hora
Campo que permita seleccionar una casilla
Campo que permita seleccionar de tres opciones, una (radio).
Campo para seleccionar colores
Campo para ingresar email.
Campos lista desplegable
Campos lista desplegable que pueda seleccionar varias opciones
Campo entrada de texto que permita que a medida que vaya digitando las iniciales,
seleccionar de una lista las coincidencias
El formulario debe estar centrado y debe posicionar sus elementos utilizando table layout
Asignatura: Desarrollo Web Semestre: IX
Docente: Larry Pacheco Ayazo Tema: HTML + CSS
Actividad 2
Incluya en su sitio web una página con la siguiente estructura. Los botones deben ser enlaces a otras
páginas.
El recuadro azul debe contener imágenes y ser enlaces a otras páginas.
Menú Menú Menú menu Menú Menú
header
TITULO
TITULO
Imágen Parrafo Parrafo Parrafo Parrafo
Parrafo Parrafo Parrafo Parrafo
TITULO
Parrafo Parrafo Parrafo Parrafo
Parrafo Parrafo Parrafo Parrafo
TITULO
Parrafo Parrafo Parrafo Parrafo
Parrafo Parrafo Parrafo Parrafo
Actividad 3
La universidad ofrece cursos gratis a sus estudiantes. De cada curso se debe conocer: categoría,
nombre, descripción, docente, horario, fecha de inicio y una imagen de cada curso.
Debe diseñar una página que muestre el catálogo de los cursos que se están ofertando (mínimo 5).
Asignatura: Desarrollo Web Semestre: IX
Docente: Larry Pacheco Ayazo Tema: HTML + CSS
Se debe diseñar una página de categorías de cursos, la cual se debe mostrar así:
Al seleccionar la categoría, ésta debe mostrar el listado de cursos así:
Al seleccionar el curso, debe mostrar lo siguiente:
Título del curso
La fecha de inicio y fecha de finalización
Descripción del curso
Video sobre el curso
Objetivos del curso
Un formulario de contacto para solicitar información
Los temas del curso
Enlaces para compartir a redes sociales
Asignatura: Desarrollo Web Semestre: IX
Docente: Larry Pacheco Ayazo Tema: HTML + CSS
Diseñe la información para tres cursos diferentes
Debajo de la información del curso, se debe mostrar información sobre tres adicionales a ofertar
próximamente. Puede tomar como referencia la siguiente imagen.
Asignatura: Desarrollo Web Semestre: IX
Docente: Larry Pacheco Ayazo Tema: HTML + CSS
Actividad 4
Diseñe una página web con las siguientes estructuras:
header
Texto
footer
Asignatura: Desarrollo Web Semestre: IX
Docente: Larry Pacheco Ayazo Tema: HTML + CSS
Header
TITULO TITULO TITULO
Descripción Descripción Descripción
Texto Texto Texto
Texto Texto Texto
Texto Texto Texto
Actividad 5
Diseñe en su sitio un sistema de mensajería que permita visualizar los mensajes de la siguiente
forma:
La página debe tener un título asunto,
Una descripción de la temática, fecha inicial.
Debe tener un botón fijo en la parte inferior derecha
Asignatura: Desarrollo Web Semestre: IX
Docente: Larry Pacheco Ayazo Tema: HTML + CSS
Actividad 6
Complete en total 10 páginas web diseñadas con CSS en su sitio.
La actividad 3 contabiliza una solo página.