Diseño modular

Generalmente un sitio Web es un conjunto grande de páginas que guardan una fuerte relación entre sí, expresando el conjunto de todas ellas la naturaleza y el objetivo del sitio, su espíritu.

Y normalmente dentro de este amplio número de páginas a crear existirán varios subgrupos de ellas que tendrán un aspecto y funcionalidad muy parecidos. Así, todas las páginas que contengan un formulario de entrada de datos serán muy similares, lo que ocurrirá también con todas aquellas destinadas a presentar los resultados de consultas, con las que encabecen una sección determinada, etc.

De esta forma, si tenemos que construir una a una y desde el principio todas las páginas del sitio, en cuanto este esté formado por un número elevado de estas, el trabajo se hará en seguida lento, arduo y pesado. Además, el tiempo es oro, vale dinero, y deberemos procurar crear nuestros sitios web en el menor número de días posible.

Puesto que las cosas son así, prima entonces la idea de la modularidad a la hora de construir nuestras páginas.

Se entiende por diseño Web modular aquel que parte de unas plantillas o páginas modelo, que van a definir el aspecto y el diseño interno de un completo grupo de páginas similares. Además, el diseño modular conlleva la reutilización, es decir, el uso repetido de mayor número de elementos de diseño, como pueden ser las imágenes de las páginas.

Siguiendo este diseño modular, empezamos a construir nuestro sitio Web, y lo primero que hacemos es crear la página principal, aquella que va a dar entrada al sitio, la primera página importante que se va a encontrar nuestro visitante. Esta debe ser sin duda la más elaborada y cuidada del proyecto, ya que es nuestra tarjeta de presentación, y de ella depende que el usuario siga navegando por el sitio o que por el contrario, nos abandone.
Para su elaboración usaremos todos los datos obtenidos en la primera fase (logotipos, imágenes preestablecidas, colores, etc.) siguiendo al pie de la letra el último modelo gráfico aprobado por el cliente.






De esta pasaremos a las páginas que dan acceso a las subsecciones. Deben tener todas ellas un diseño similar, siendo aconsejable que tan sólo cambien en algún color o signo representativo de la sección en concreto. Aplicando el diseño modular, creamos una plantilla válida para todas estas páginas de entrada a las subsecciones, debiendo mantener en ellas la línea estética de la página principal y reutilizando en las mismas los logotipos ya usados en esta. Inicialmente repetimos esta página tantas veces como subsecciones tengamos, y si no tenemos los textos de contenido perfectamente definidos por el cliente, las completaremos con los titulares que identifiquen la sección y con unos textos en latín, por ejemplo, que llenes las páginas y le den un aspecto similar al que tendrán al final.

Seguimos bajando de esta forma en el árbol jerárquico de la estructura de páginas, hasta llegar a las páginas individuales últimas en la cadena. Para ellas seguiremos aplicando el diseño modular, de tal forma que si vamos a tener varios formularios en el sitio, todos deben basarse en una plantilla padre para estos, en la que definiremos si van a estar encuadrados, los márgenes que van a tener, si llevan cabeceras, etc.

Ya creadas las plantillas, procederemos ahora a montar todo el sitio Web, creando una variante provisional del sitio completo, aunque todavía no estén personalizadas todas las páginas del mismo, y una vez montado todo el sitio, siendo totalmente navegable entre sus páginas y siguiendo todas ellas un esquema de diseño y estética común, es hora de citar de nuevo a nuestro cliente y enseñarle el resultado, para obtener una nueva opción de él.



Este es el momento de que nos diga qué le parece lo que van a ser sus páginas Web y si cree oportuno algún cambio, ya que una vez dada su aprobación empezaremos a individualizar cada una de las páginas hasta obtener el aspecto final de cada una de ellas y la del sitio completo.

Aprobado por el cliente, completamos los textos y los campos de formulario de cada una de las páginas, con la idea clara de que los diseñadores tendrán total libertad a la hora de completar las páginas que serán estáticas, sin código de programación interno que las afecte, pero que para aquellas páginas que vayan a llevar código ASP, JSP, etc., deberán antes contar con la opinión de los programadores, ya que tal vez necesiten ellos un tratamiento especial de la página que afecte al diseño o al código HTML de la misma.

Este es el último paso de la parte de diseño de las páginas del sitio Web. Una vez completadas todas, si nuestra aplicación precisa acceso a bases de datos o efectos dinámicos pasa a manos de los programadores, que se encargarán de dar vida a la misma. Estos tienen entonces entre manos un completo trabajo que realizar, que incluye la elección de los servidores Web y de bases de datos a usar (si no vienen impuestos de antemano), la selección de los lenguajes de programación a usar y la propia implementación del código en las páginas.