DIW01_Tarea Diseño de Interfaces Web (DAW-E)

Tarea a realizar:
Se trata de realizar una primera versión de interfaz gráfica, accesible y atractiva de cara al
público, para una agencia de viajes que necesita crear su página Web. Los requisitos que
pide el cliente son los siguientes:

 El titulo que debe aparecer visible en la parte de arriba es “Viajeros”.

 Puesto que queremos atraer clientes de varias nacionalidades, podrán elegirse

como idiomas para la página tanto el Castellano como en Inglés.

 Debajo del título irá una barra de navegación en la parte superior donde se
diferencien claramente 4 secciones: Hoteles, Apartamentos, Vuelos y Trenes.

 En la página principal aparecerá directamente la sección de hoteles, que al igual que

el resto, debe contener al menos 4 fotos con la información correspondiente (Para
hoteles y apartamentos debe aparecer el precio/día, ubicación, para cuántos
huéspedes es y si tiene wifi. En las secciones de vuelos y trenes debe aparecer el
origen, destino, precio y duración del trayecto)

 En la parte derecha de cada sección aparecerá un espacio reservado para un

anuncio relacionado con el contenido que estamos mostrando, pudiendo insertar
una imagen por ejemplo de alquiler de coches si estamos mirando Vuelos.

 Para poder ponerse en contacto con la empresa también deberemos mostrar la

información de contacto con la dirección, teléfono, correo electrónico y un par de
enlaces a redes sociales.

Apartado1

Realizar una clasificación de todos los elementos mencionados en el enunciado según

sean: elementos de identificación, navegación, contenido o interacción.
Apartado2

Indica cuál sería el tipo de estructura de navegación más adecuado y explica el motivo.
Apartado3

Elabora una guía de estilos indicando toda la información que debería figurar en función de
los elementos que se han mencionado en el enunciado.

Apartado4

Usando los elementos de seccionado de HTML5 codifica la estructura de tu página

principal. Puesto que aún no hemos visto como maquetar usando CSS Grid o Flexbox
puede hacerse de la forma que se quiera, incluso usando tablas aunque no es lo
recomendado.
DIW01_Tarea Diseño de Interfaces Web (DAW-E)

Evaluación

Rúbrica de la tarea
Apartado 1: Clasificación correcta de los elementos de la página. 1,5 puntos

Apartado 2: Se justifica de forma adecuada la estructura de navegación más adecuada. 1 punto

Apartado 3: Elaboración correcta de la guía de estilos. 4 puntos

Apartado 4: Codificación de la estructura de la página principal. 3,5 puntos

** Como entorno de desarrollo se aconseja usar Visual Studio Code, tiene extensiones que
nos facilitarán el desarrollo de sitios web

Al final debes comprimir todos los ficheros que hayas usado durante la tarea y subirlo con
el formato de nombre apellido1_apellido2_nombre_DIW01_Tarea