herramientas web - practica 1

6
Prácticá 1 – Buscándo inspirácion Objetivo Aprender a imprimir en una página web un diseño específico bien hecho usando los tags esenciales de HTML y CSS. Instrucciones Lee toda esta primera página. En este documento se incluye una serie de ejemplos de sitios web con un buen diseño. Escoge dos de ellos y utiliza tus conocimientos adquiridos en clase para igualar lo más que puedas su diseño en un archivo HTML. Incluye en tus archivos HTML un comentario con tu nombre y número de estudiante en la parte superior. Mantén los colores lo más cercano posibles al diseño original. Mantén la organización y tamaño de los elementos igual a la página original. Si la página tiene imágenes, puedes buscar algunas en internet que, aunque no sea iguales, sirvan como referencia. Considera el tamaño de las imágenes que usas. Si en el diseño es una imagen grande, busca una grande también. Puedes usar la propiedades CSS para que encajen a la perfección El diseño no necesita ser responsivo a cambios de tamaño de la ventana, basta con que se vea lo más parecido posible en la computadora en que lo diseñas. Junto con este documento se entrega una herramienta llamada ScreenRuler. Es recomendable usarla para medir el tamaño de los elementos en la pantalla. Puedes transcribir los textos que contienen las páginas o rellenar usando Lorem Ipsum. Las fuentes más comunes son Verdana y Tahoma. Si aparece una muy distinta, puedes escoger una instalada en la computadora que se vea similar. Cualquier pregunta que tengas, hazla. La intención es aprender lo que aún no sabemos y no atorarnos. Al terminar tu diseño, haz capturas de pantalla de los dos diseños y guárdalos como JPG. Finalmente envía tus capturas de pantalla, los archivos HTML y las imágenes usadas en un archivo comprimido (zip o rar) al correo: [email protected] usando como asunto “Práctica 1 Herramientas Web”. Todo se debe entregar al final de la clase. Suerte!

Upload: tochimani

Post on 12-Dec-2015

214 views

Category:

Documents


0 download

DESCRIPTION

diseño web

TRANSCRIPT

Page 1: Herramientas Web - Practica 1

Prá cticá 1 – Buscándo inspirácio n

Objetivo Aprender a imprimir en una página web un diseño específico bien hecho usando los tags esenciales de HTML y CSS. Instrucciones Lee toda esta primera página. En este documento se incluye una serie de ejemplos de sitios web con un buen diseño. Escoge dos de ellos y utiliza tus conocimientos adquiridos en clase para igualar lo más que puedas su diseño en un archivo HTML.

Incluye en tus archivos HTML un comentario con tu nombre y número de estudiante en la parte superior.

Mantén los colores lo más cercano posibles al diseño original.

Mantén la organización y tamaño de los elementos igual a la página original.

Si la página tiene imágenes, puedes buscar algunas en internet que, aunque no sea iguales, sirvan como referencia. Considera el tamaño de las imágenes que usas. Si en el diseño es una imagen grande, busca una grande también. Puedes usar la propiedades CSS para que encajen a la perfección

El diseño no necesita ser responsivo a cambios de tamaño de la ventana, basta con que se vea lo más parecido posible en la computadora en que lo diseñas.

Junto con este documento se entrega una herramienta llamada ScreenRuler. Es recomendable usarla para medir el tamaño de los elementos en la pantalla.

Puedes transcribir los textos que contienen las páginas o rellenar usando Lorem Ipsum.

Las fuentes más comunes son Verdana y Tahoma. Si aparece una muy distinta, puedes escoger una instalada en la computadora que se vea similar.

Cualquier pregunta que tengas, hazla. La intención es aprender lo que aún no sabemos y no atorarnos.

Al terminar tu diseño, haz capturas de pantalla de los dos diseños y guárdalos como JPG. Finalmente envía tus capturas de pantalla, los archivos HTML y las imágenes usadas en un archivo comprimido (zip o rar) al correo: [email protected] usando como asunto “Práctica 1 Herramientas Web”. Todo se debe entregar al final de la clase.

Suerte!

Page 2: Herramientas Web - Practica 1
Page 3: Herramientas Web - Practica 1
Page 4: Herramientas Web - Practica 1
Page 5: Herramientas Web - Practica 1
Page 6: Herramientas Web - Practica 1