rubensarrio | blog de diseño web, diseño grafico y algo más

El objetivo de este artículo es resumir lo más rápido posible el proceso que se recomienda seguir a la hora de desarrollar un sitio web. Muchos de los pasos explicados aquí resultarán obvios para la mayoría de los diseñadores, sin embargo nunca viene mal repasarlos y si además sirven para que alguien descubra un detalle que había pasado por alto, entonces el artículo habrá sido todo un éxito, además su lectura también puede usarse como somnífero.

A – Diseño Web

1 – Estudio de la Web

Antes de empezar a diseñar nada debemos hacer un pequeño (o grande según se requiera) estudio del sitio web que nos han encargado. Es decir, tener muy claro quién es nuestro cliente, a quien va dirigida la web y como la vamos a realizar.

El resultado de este paso podría ser una lista de objetivos a cumplir durante el resto del desarrollo del sitio web.

2 – Estructura de la Web

Es extremadamente conveniente dedicar unos minutos a diseñar una estructura web eficaz y que cumpla los objetivos marcados en el estudio antes de empezar a definir el aspecto de la futura web, ya que éste estará completamente condicionado ésta estructura. No es lo mismo un diseño con cuatro secciones que con cuarenta y ocho.

Una estructura web es básicamente el contenido del sitio web ordenado jerárquicamente de manera que se vea claramente como están relacionadas o enlazadas las páginas y secciones.

3 – Aspecto de la Web

Muchos diseñadores principiantes suelen empezar a maquetar la web sin haber diseñado previamente el aspecto que va a tener. Esto aunque posible es un grave error ya que a no ser que se sea un genio capaz de visualizar mentalmente todo el aspecto de la web, seguramente provocará que el paso de maquetar la web se alargue considerablemente gracias a los continuos cambios y correcciones, cuando normalmente ese paso debería ser algo rápido y rutinario. Saludos a los apasionados maquetadores web.

Lo primero que deberíamos hacer plasmar nuestras ideas en forma de bocetos, por ejemplo con lápiz y papel. Una vez que el diseño empiece a coger forma es cuando tendríamos que abrir nuestro programa de diseño favorito (Photoshop, Fireworks, Illustrator…) y definir con precisión el aspecto que del sitio web. Es importante aclarar que Dreamweaver no es un programa de diseño web sino de maquetación web.

Cuando tengamos el diseño ya terminado podemos enseñárselo al cliente, realizar los cambios que nos pida rápidamente y pasar al siguiente paso.

B – Maquetación Web

Como ya he comentado éste paso debería ser rápido y rutinario, sin embargo gracias a la variedad de navegadores, sistemas operativos y configuraciones, resulta mucho más entretenido. ¡Tres hurras por ello!

El paso de maquetación es todo un universo y daría para miles de artículos, pero se puede resumir en abrir Dreamweaver , un programa similar o directamente un editor de texto plano y convertir el diseño que creamos anteriormente en un sitio web real que pueda ser renderizado por la mayoría de los navegadores.

C – Programación Web

A partir de este paso ya disponemos de un diseño y de la maquetación del mismo. Algunos sitios web no requerirán más esto, es decir unas cuantas páginas estáticas. Sin embargo en los tiempos que corren dejar así el sitio web resulta algo soso. Por suerte nuestros queridos programadores vienen a nuestra ayuda para darle un poco más de vida a la web. Si odia a los programadores o les dan asco, no es necesario mirarles a los ojos para hagan su trabajo, de hecho probablemente se lo agradecerán.

De manera que en este paso se escribirán todas las líneas de código JavaScript y/o de algún lenguaje de servidor como PHP necesarias para dinamizar la web. Hay que tener en cuenta que las grandes aplicaciones web que necesitan grandes cantidades de código requerirán de un proceso de diseño independiente, previo al diseño del aspecto de la web o en paralelo.

D – Pruebas

Aunque las pruebas para la correcta visualización y funcionamiento del sitio web comienzan desde la maquetación web, siempre es recomendable reservar un tiempo al final para dedicarlo exclusivamente a esta labor. Además siempre resultará mucho más eficaz si se encargan de él personas que no hayan estado implicadas en el proceso de desarrollo del sitio web, si no tiene presupuesto para contratar gente cualificada puede explotar a su familia y/o amigos.

Bueno, hasta aquí esta pequeña introducción al desarrollo web, espero que a algún alma descarriada le resulte útil. Más adelante profundizaré en cada tema y paso individualmente, por supuesto si no tiene paciencia siempre esta nuestro amigo Google esperando ayudarles.