El esqueleto de la web

3
El esqueleto de la web Empezaremos definiendo la información que queremos ofrecer y la manera cómo la vamos a agrupar. Es decir, crearemos el árbol de contenidos: se trata de organizar los contenidos de una forma lógica e intuitiva para que el usuario sepa rápidamente donde hacer clic para encontrar la información que está buscando. Cuando tengamos el árbol de contenidos medianamente cerrado (los árboles, como pasa en la naturaleza, no paran de crecer y transformarse) decidiremos cómo se mostrará y distribuirá la información en nuestra web. Una manera muy práctica de hacerlo es “dibujar” cada pantalla: se trata de hacer esbozos (también llamados wireframes) con un papel y un lápiz o utilizando programas informáticos como Power Point, Visio, OmniGraffle, etc. Lo ideal es hacer un wireframe para cada página del árbol de contenidos, de esta manera tendremos una visión general de la futura web. Los wireframes nos ayudarán a reflexionar sobre la mejor manera de mostrar los contenidos, saber cuáles son las informaciones más importantes, cómo

Transcript of El esqueleto de la web

Page 1: El esqueleto de la web

El esqueleto de la web

Empezaremos definiendo la información que queremos ofrecer y la manera

cómo la vamos a agrupar. Es decir, crearemos el árbol de contenidos: se trata

de organizar los contenidos de una forma lógica e intuitiva para que el usuario

sepa rápidamente donde hacer clic para encontrar la información que está

buscando.

Cuando tengamos el árbol de contenidos medianamente cerrado (los árboles,

como pasa en la naturaleza, no paran de crecer y transformarse) decidiremos

cómo se mostrará y distribuirá la información en nuestra web. Una manera muy

práctica de hacerlo es “dibujar” cada pantalla: se trata de hacer esbozos

(también llamados wireframes) con un papel y un lápiz o utilizando programas

informáticos como Power Point, Visio, OmniGraffle, etc. Lo ideal es hacer

un wireframe para cada página del árbol de contenidos, de esta manera

tendremos una visión general de la futura web.

Los wireframes nos ayudarán a reflexionar sobre la mejor manera de mostrar

los contenidos, saber cuáles son las informaciones más importantes, cómo

Page 2: El esqueleto de la web

navegará el usuario por nuestra web… Los wireframes tienen que ser realistas

y viables tanto desde el punto de vista técnico como económico y deben servir

para solucionar dudas o temas pendientes antes de pasar a la fase de diseño,

maquetación y programación.

Diseño y maquetación

Y finalmente llega el momento de ponerle cara al proyecto mediante un diseño

adecuado. Y decimos adecuado porqué el diseño debe ir más allá de la mera

función estética: debe apoyar y complementar las decisiones tomadas y seguir

los objetivos definidos.

Una vez tenemos el diseño, es el momento de encajar las piezas mediante la

maquetación. El maquetador se encarga de que las piezas de diseño se

ajusten bien las unas con las otras y de que todo se vea como ha sido

planteado previamente por los diseñadores. Si el azul es celeste, deberá verse

celeste y no marino, por ejemplo, o si hay 5 píxeles de distancia entre dos

fotos, deberán ser 5 píxeles y no 7.

¿Lo estamos haciendo bien? La usabilidad

El proceso ideal incluye aquí un alto en el camino: hemos definido los objetivos,

conocemos las expectativas de nuestros usuarios y con ello hemos hecho un

planteamiento estructural y de diseño, pero… ¿Lo estamos haciendo bien? Es

un buen momento para plantear una nueva reunión, una nueva puesta en

común con nuestra audiencia para saber si hemos comprendido lo que nos

querían transmitir, si hemos acertado en el diseño, en la manera de plantear la

navegación, en la organización de la información… Todo ello afectará a la

usabilidad (la facilidad de uso).

Hay diferentes manereas de testear la usabilidad de una web: test de

usabilidad, entrevistas en profundidad, análisis heurísticos… El objetivo es

detectar qué aspectos deben mejorarse para adaptarlos a la lógica de los

usuarios y garantizar que cuando visiten nuestra web puedan cumplir

rápidamente los objetivos que les han llevado a visitarnos.

Programación, lanzamiento y seguimiento

Una vez finalizados los retoques pertinentes, se pasa a la fase de

programación, la parte más técnica del proyecto, y se prueba el funcionamiento

antes de su publicación en Internet. A partir de este momento, empezarán las

tareas de difusión y promoción.

Y la tarea de difusión y promoción, pasa, obligatoriamente por

el posicionamiento en los distintos buscadores, especialmente en Google. Para

existir en Internet tenemos que estar en Google, para ello debemos elegir con

sumo cuidado las palabras clave (keywords) con las que queremos que nos

Page 3: El esqueleto de la web

encuentren cuando algun usuario las teclee en un buscador y conseguir que

otras webs (blogs,Technorati, Del-ici-ous) enlacen a nuestra página. De esta

manera conseguiremos dos cosas:

Si estamos presentes en otras webs más, fácil será que nos conozcan y que

los usuarios que nunca llegarían directamente a nuestra web, lo hagan a partir

de una web que tenga nuestro enlace.

Cuántas más páginas enlacen a la nuestra, mejor será nuestro posicionamiento

en Google, y más fácil será hacernos visibles.

Una web nunca hay que “aparcarla” sin más: debemos estar pendientes de lo

que en ella acontece, observar el comportamiento de nuestros usuarios, ya sea

mediante una medición analítica (cómo se mueven los usuarios, qué páginas

visitan, cuánto tiempo están en cada página, qué contenidos no miran…) o

mediante el análisis de sus comentarios, intercambios, inquietudes,

sugerencias… y actuar en consecuencia: cambiando determinados elementos,

añadiendo contenidos, reorganizando la información, etc.

Hay que tener en cuenta que la vida de un una web no es eterna, necesita

evolucionar al mismo tiempo que lo hacen nuestros objetivos, las necesidades

de la audiencia, las herramientas y los comportamentos sociales. Por lo tanto,

es conveniente repetir periódicamente el proceso desglosado en este artículo

para no perder el impulso en este entorno tan dinámico y cambiante llamado

Internet.

Juan Carlos Ayala Medrano

http//www.estructuradearboles.com