INSTITUTO DE EDUCACIÓN SUPERIOR CIBERTEC

DIRECCIÓN ACADÉMICA
CARRERA PROFESIONALES

CURSO : Arquitectura de Entornos Web (1802)

PROFESOR : Jorge Villavicencio Diaz
NOTA
SEMESTRE : 2022 - II
CICLO :I
SECCIÓN : Todas
DURACIÓN : 6 horas
FECHA DE INICIO : Miércoles, 26
FECHA DE FIN : Miércoles, 26

CASO DE LABORATORIO 2

Logro:
Tenga presente que el logro es que usted, implemente el diseño de una página web,
Aplicando contenedores, inserte imágenes e hipervínculos. Asimismo, aplique formatos
CSS3 externos en cada contenedor.

Consideraciones generales:
 Si dos o más alumnos presentan la misma solución, recibirán la nota 99 (cero anulado).
 Considerar el orden y la claridad de la sintaxis utilizada en el desarrollo.
 Resuelva los ejercicios propuestos y luego comprima la carpeta de trabajo. Asimismo, considere el
siguiente formato como nombre de carpeta:
CL2_ApellidoPaterno_Nombre
 No olvide subir su archivo a blackboard, dentro del plazo establecido por el Docente.
 No se aceptará el envío del examen por correo.
 No se aceptarán exámenes enviados posterior al plazo establecido.

ALUMNO (A) :

Consolidado

Puntaje Llenar solo en caso de Recalificación justificada

Pregunta
Máximo Obtenido Sustento Puntaje
1 05
2 05
3 05
4 05
Nota Recalificada

El Caso. La empresa Legend desea rediseñar su web oficial para adaptarla a diversos dispositivos
tanto de escritorio como móviles. Desarrolle el modelo web utilizando bloques de contenido y cajas
flexibles.

Importante: Puedes utilizar otro TEMA pero sigue las mismas indicaciones de maquetación y
estilos.

IESTP CIBERTEC 1
 Encabezado

Banner (una
sola imagen)

Sección Portafolio o
Productos con 3
imágenes

Sección de Servicios con 4

bloques y enlaces
(hipervínculos).

De acuerdo al modelo mostrado se le pide realizar una página web con los siguientes componentes:

1. Elaboración de Marcos contenedores (DIV)

Los contenedores almacenarán: logo y barra de navegación (lista) en la parte superior, una
imagen (banner), las 3 imágenes del portafolio, los 4 bloques de contenido para servicios con
subtitulos, párrafos y botones de enlace. Finalmente, la caja principal que encierra a todas las
anteriores.

Rúbrica
Puntos Excelente: 5 puntos Bueno: 4 puntos Regular: 2 puntos Deficiente: 0 puntos
Marcos Aplica los 5 Aplica tres Aplica 1 solo No cumple con

IESTP CIBERTEC 2
 contenedores contenedores de los
contenedor de los 5 ningún aspecto de lo
Contenedores solicitados en forma cinco solicitados en
solicitados solicitado.
eficiente forma eficiente.

2. Inserción de Imágenes
Inserta 3 imágenes en la sección portafolio y ordenalas horizontalmente (ROW). Al final, coloca
un botón (ver muestra)
Rúbrica
Puntos Excelente: 5 puntos Bueno: 4 puntos Regular: 2 puntos Deficiente: 0 puntos
Inserta solo 1
Inserta las 3 Inserta 2 de la No cumple con
Inserción de imagen de la
imágenes solicitadas imágenes solicitadas ningún aspecto de lo
Imágenes solicitadas en el
en el modelo en el modelo solicitado
modelo

3. Aplicación de Formatos CSS3

Se aplicara CSS externo en los siguientes elementos:

 Encabezado: Logo Legend y barra de navegación.

 Banner: Imagen única de fondo o sobre el DIV.
 Portafolio o Productos: El subtitulo h2 debe tener la fuente arial, tamaño 25px y
centrada.
 Servicios: Aplique fuente, color y alineación a los elementos de esta sección (ver
muestra).
 Enlaces: Los botones deben tener fondo de color verde esmeralda, padding y texto
blanco.

Rúbrica
Puntos Excelente: 5puntos Bueno: 4 puntos Regular: 2 puntos Deficiente: 0 puntos
Aplica 5 formatos Aplica 3 formatos Aplica 1 solo
CSS externos, uno CSS3 en dos formato CSS3 en un No cumple con
CSS3 en cada contenedor contenedores solo contenedor ningún aspecto de lo
solicitado en el solicitados en el solicitado en el solicitado
modelo modelo modelo

4. Manejo de Hipervínculos
Se insertaran 5 hipervínculos externos en cada uno de los botones del diseño, con opción de
apertura de ventana alterna. Los enlaces pueden ser a páginas externas de manera libre por el
alumno.

Rúbrica
Puntos Excelente: 5puntos Bueno: 4 puntos Regular: 2 puntos Deficiente: 0 puntos
Inserta los 5 Inserta 3 de los 5 Inserta 1 de los 5
No cumple con
hipervínculos hipervínculos hipervínculos
Hipervínculos ningún aspecto de lo
solicitados en el solicitados en el solicitados en el
solicitado
modelo modelo modelo

IESTP CIBERTEC 3
IESTP CIBERTEC 4