MODELAMIENTO Y ARQUITECTURA WEB

MODELAMIENTO Y ARQUITECTURA WEB.

INTRODUCCIÓN

Anteriormente las Páginas Web se realizaban de manera estática, a través de

un editor de html, usando herramientas practicas que facilitaran su desarrollo.

Pero el crecimiento continuo del Internet y de los medios de comunicación

exigían a su vez que ciertas paginas Web requirieran de otro tipo de desarrollo

que pudieran soportar de manera dinámica. Con esto apareció el término

aplicaciones Web, donde eran desarrollos que fueran robustos, escalables y

fácilmente adaptables. Pero debido al gran éxito que obtuvo el desarrollo de

estas aplicaciones Web en diferentes tecnologías (jsp, asp, javascript, etc)

surgió la necesidad de que este trabajo necesitaba de más técnicas formales

de diseño y recuperar ciertas metodologías de diseño que se realizan hoy en

día para el desarrollo de un sistema de escritorio. Así fue como Jim Conallen

presento sobre los diseños de UML modificados con estereotipos para las

aplicaciones Web. A partir de allí, muchos investigadores se vieron en la tarea

de buscar la manera de poder hacer un diseño de software orientado a Web.

1. QUE ES EL DISEÑO WEB?

El diseño web es una actividad que consiste en la planificación, diseño e

implementación de sitios web y páginas web. No es simplemente una

aplicación del diseño convencional sobre Internet ya que requiere tener en

cuenta cuestiones tales como navegabilidad, interactividad, usabilidad,

arquitectura de la información y la interacción de medios como el audio, texto,

imagen y vídeo.

El diseño no es sólo la comunicación textual (contenidos) existentes en Internet

de una manera visual, sino que obliga a pensar en una mejor estructuración de

los mismos en este soporte. La unión de un buen diseño con una jerarquía bien

elaborada de contenidos aumenta la eficiencia de la web como canal de

comunicación e intercambio de datos, que brinda posibilidades como el

contacto directo entre el productor y el consumidor de contenidos,

característica destacable del medio Internet.

El diseño de páginas Web es una amplia área de aplicación del diseño gráfico

en la cual se integran conocimientos propios del diseño como son la

composición, el uso de color y la tipografía con conocimientos técnicos del

medio como son los lenguajes HTML (HiperText Markup Language) y CSS

(Cascading Style Sheets), así como conocimientos sobre usabilidad,

accesibilidad y organización de un sitio web.

1.2 Generaciones de Diseño Web:

Primera generación de diseño web: El primer diseño web de una página se

realiza en 1993, la página web tenía el nombre Mosaic, y en menos de un año

había recibido 2 millones de visitantes. El navegador web era capaz de mostrar

tanto imágenes como textos, aunque con una limitación muy alta a la hora de

diagramar la información de la página web. El diseño web de estas páginas era

lineal y estaba orientado para científicos que eran los usuarios que compartían

su información alrededor de todo el mundo mediante estas páginas web. La

tecnología de los navegadores web era limitada y no disponía de la capacidad

de transmitir información grafica para la comunicación visual.

Las principales características de esta primera generación de diseño web eran

las velocidades de transmisión de datos, ya que era conexión vía MODEM, lo

que limitaba el peso de las páginas web. Otro detalle era el uso de monitores

monocromos. Respecto al diseño web en particular, la estructuración era

bastante desordenada con imágenes dispuestas horizontalmente y líneas de

texto separadoras.

Debido a este caos en el diseño web, un año más tarde se estableció un

consorcio para establecer unas normas y pautas para el futuro desarrollo de la

web, el W3C. Se comenzaron entonces a desarrollar unos estándares de

lenguaje html para una unificación del diseño web que trajo consigo la aparición

de una serie de navegadores web con el constante desarrollo de nuevas

funcionalidades y progresos en este ámbito.

Segunda generación de diseño web: El diseño web de esta generación está

basado en los conceptos de la primera salvo por que empieza a utilizar iconos

en lugar de algunas palabras, las páginas web comienzan a poseer imágenes

de fondo, aparece el diseño y uso de botones con relieve para

la navegabilidad, el uso de banners en lugar de cabeceras, la

estructuración de texto de forma jerárquica mediante menús

o listados, propiedades del código html Standard definido.

La aparición de estos elementos gráficos en el diseño web

generó un deseo de todos los diseñadores de añadir estos

archivos en sus páginas web, pero sin control, lo que generó

una saturación en las páginas web, sin tener en cuenta la

accesibilidad ni la usabilidad. Aun así seguían habiendo

algunos diseñadores que utilizaban estos elementos de manera

correcta para generar unos diseños innovadores y elegantes,

llenos de elegancia, usando correctamente tanto etiquetas como

el resto del código html. Se comenzaron a usar tablas para la

organización de los contenidos, posicionamiento de los elementos y generación

de diseño y maquetación similar a libros o revistas.

En esta generación está la aparición de monitores y tarjetas gráficas con

mayores resoluciones y definición de color, lo cual generó la consecuente

mejora en la calidad del diseño web. Pero apareció un problema, la diferencia

en la adaptación de estándares de los 2 principales navegadores: Internet

Explorer y Netscape Navigator.

Tercera generación de diseño web: En la tercera generación, el diseño web

sigue teniendo muchas restricciones con el uso del lenguaje para los dos

navegadores web. El diseño web se orienta en esta generación a los

diseñadores, los cuales tienen mucho más dinamismo al aparecer el plugin de

Macromedia Flash, el cual revolucionaría la concepción de diseño web. Es una

era de enfocar las páginas web según el objetivo de las mismas: vender

productos o servicios, comunidades, información, noticias. Para esta

especialización del diseño web de acuerdo al objetivo

de las páginas se necesita ayudar al usuario a

encontrar la información, generando una navegabilidad

estructurada e intuitiva.

La gran mayoría de páginas web que aparecen en esta

generación son de publicidad y venta de productos y

servicios, con lo que es este el diseño más utilizado.

Conseguir acercarles al producto, que deseen ver más

páginas del sitio web.

Cuarta generación de diseño web: En la cuarta generación, el diseño web ya

está enfocado totalmente a la multimedia, integrando en las páginas web los

elementos multimedia de última generación. Con usuarios de todos los tipos,

cualquiera tiene una página web a día de hoy y la variedad de diseño es

enorme debido a todas las posibilididades que ofrecen las últimas tecnologías

para los programadores. A esto le podemos añadir que las últimas versiones de

los navegadores soportan muchas más prestaciones y elementos en las

páginas web.

Quinta generación de diseño web: Se podría añadir una última generación

de diseño web que representaría el auge de las páginas de televisión ip o

televisión online. La integración de televisión en la web para empresas,

ayuntamientos o asociaciones representa el movimiento más notable del

diseño web en la actualidad. Un ejemplo de empresas de diseño que ya

ofrecen la posibilidad de integración de televisión en web es Hooping.net

mediante su plataforma de televisión IP Hooping.tv.

2. DISEÑO DE SITIOS WEB.

Según Forrester (1998), los costos de un mal diseño son extremadamente altos

para una empresa, las perdidas mas importantes que se registran son:

· Perdidas de aproximadamente el 50% de las ventas potenciales,

porque los usuarios no pueden encontra el producto adecuado.

· Perdidas del 40% de segundas visitas de usuarios por la mala

experiencia de la primera visita.

2.1 Principios generales para el diseño de sitios web (Tognazini, 1999).

1. Anticipación: el sitio web debe anticiparse a las necesidades del usuario.

2. Autonomía: los usuarios deben tener el control sobre la aplicación (entorno

abarcable y finito)

3. Los colores: con precaución.

4. Consistencia: aplicaciones consistentes con las expectativas de los usuarios.

5. Eficiencia del usuario: las aplicaciones deben focalizarse en la productividad

del usuario, no de la máquina.

6. Permitir la reversibilidad de la acciones.

7. Ley de Fitts, el tiempo para alcanzar un objetivo está en función de la

distancia y el tamaño del objetivo. Por tanto, usando botones más grandes y

situando los elementos en las esquinas de la pantalla reduciremos el tiempo.

8. Reducción del tiempo de latencia, es posible optimizar el tiempo disponible

permitiendo la realización de otras

...