diseno-web-mini-06

Index (primera página) – diseño web básico 6

Index: la primera página

capítulo 6 - diseño del index

capítulo 6 – diseño del index

El index es tradicionalmente la primera página que se carga de nuestra web cuando el usuario visita la dirección base sin enlaces adicionales. Dependiendo de la forma en que estemos construyendo la web, el index podría ser directamente el documento que muestra la primera página o podría ser un documento que mediante algún lenguaje de programación (como PHP en esta serie) procesa la petición y muestra alguna vista. En este último caso, el index se cargaría absolutamente siempre, preparando la vista que debe devolver al usuario y lo que debe pasar con dicha vista (podemos pensar en este caso en este primer documento como si fuera un enorme cruce de trenes que, en función de lo que pasa, desvía el tráfico en un sentido o en otro).

Por ahora nos encontramos en las fases iniciales de este curso, así que trataremos el index como simplemente la primera vista que recibe el usuario al entrar en la web (más adelante lo convertiremos en un enrutador, tal y como se ha mencionado en el párrafo anterior).

Así pues, la tarea es realmente sencilla. Usando fragmentos y ejemplos de Bootstrap podemos construir una vista agradable y sencilla, adecuada para un blog. Ya de paso, en el vídeo se ve de forma práctica en qué modo se puede diseñar de forma eficaz con Bootstrap para lograr que la vista sea adaptativa (también conocido como responsive) en función del dispositivo usado para ver la web (o su tamaño de pantalla mejor dicho).

Colocaremos lo básico: una barra de navegación fijada en la parte superior y siempre visible, un enorme titular para nuestra web (en Bootstrap lo llaman Jumbotron), una serie de herramientas en el lateral izquierdo y reservaremos el resto del espacio para enumerar los últimos artículos (cosa que no haremos hasta más adelante, cuando tengamos más dominio de PHP y la base de datos MySQL o MariaDB).

Para que todo sea más uniforme, usaremos paneles y algunos iconos de glifo que también se incluyen por defecto con Bootstrap.

¿Te ha gustado? ¡Colabora en Patreon!

Leave a Reply

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *