Página web en menos de siete minutos…

… o en alguno más si tienes que repetir el video varias veces. Pero la idea es esa, sin demorarme mucho y siendo conciso trato de mostrarte como hacer una estructura sencilla para una página web.

Puedes descargar el ejercicio resuelto en este enlace.

Este ejercicio es bastante sencillo, quizás para muchos no suponga un gran reto. ¿Dónde puede estar el reto? En intentar hacerlo en menos tiempo que yo. Recuerda: si has terminado el ejercicio con ayuda no sabes hacer el ejercicio. Sólo lo has terminado. La diferencia entre eso y no haber hecho el ejericio es muy poca. Debes poder hacer el ejercicio desde cero y sin ayuda. Sólo entonces tiene algún sentido decir que has terminado el ejercicio.

Si has terminado el ejercicio, siempre puedes tratar de afianzarlo. Cogete un crono. Yo tardé siete minutos en hacer este ejercicio explicando paso a paso lo que iba haciendo. Intenta hacerlo en menos tiempo.

Cómo vamos a resolver este ejercicio

Debemos poder mirar al ejercicio propuesto y divdirlo en capas o rectángulos. Las páginas web se estrucuran en capas. ¿Cuantas capas tiene este ejercicio?.

Empezaremos a contar de fuera a dentro y de arriba a abajo y de izquierda a derecha.

Primero tenemos una capa contenedora. Dentro tiene dos columnas apiladas horizontalmente (para ello podemos usar float:left o display:inline-block).

Dentro de la primera columna, tenemos una foto y una lista de enlaces.

Dentro de la segunda columna, está el contenido de la web.

Tener la habilidad para ver la fotografía de una web y poder descomponerla en ractángulos de información es algo fundamental para poder hacer páginas web. Es el paso uno. A partir de ahí podemos empezar a maquetar. Un maquetador no empieza a maquetar por dónde sabe. Empieza a maquetar por el principio. Y el primer paso es saber hacer esta descomposición del diseño que nos han pasado.

Aviso Legal | Política de privacidad