Módulo I Unidad Didáctica 2 Introducción Tal como un periódico, por ejemplo, no es sólo una colección de artículos, un sitio Web no puede ser simplemente una colección de páginas. Qué se busca al diseñar un sitio Web? Veamos cuales son nuestros objetivos al diseñar un sitio. Observemos primero el hecho de que en la mayoría de las aplicaciones o programas, muchas cosas son similares entre sí. Distintos programas funcionan de manera muy similar. Generalmente el primer elemento de la barra de menú es "File..." o "Archivo...", y el último es "Help..." o "Ayuda...". Esto porque poco a poco los usuarios se han ido acostumbrando a trabajar en ambientes así, le es cómodo pasar de un programa a otro y aprender aprovechando las nuevas funcionalidades. En el World Wide Web, ocurre un proceso muy similar. Casi siempre hay botones "Home" o Inicio, un botón para enviar correo electrónico al diseñador o al que mantiene la página, una tabla de contenidos, etc. Lo que pasa es que cuando una persona llega por primera vez a un sitio, ocurre un proceso muy rápido en el cuál la persona aprende a navegar por él. Esto ocurre en los primeros 2 o 3 minutos, y es crucial que éste aprendizaje sea lo más rápido posible para la persona que llega. Muchos sitios incluso proveen de una página de ayuda que explica que tipo de ayudas de navegación se usan y cómo moverse adecuadamente. Es por ello que conviene adherirse al "estándar", por lo menos en cuanto a la estructuración de los contenidos y tratar de producir un sitio Web que responda a las características que el usuario promedio esperaría. El proceso de diseño Web debería contar con una serie de etapas que permitan transformar fragmentos de información dispersos, o en el mejor de los casos un conjunto de información estructurada de manera lineal o secuencial, en un sitio que haga sentirse cómodo al usuario y encontrar lo que busca de la manera más rápida posible. Etapas del diseño de un sitio Web El punto de vista desde el cual analizamos el proceso de diseño es el de pensar la Web no como la interrelación usuario-tecnología, sino como la interacción humana, mediatizada por la tecnología. Es decir, entender la Web como medio Prof. Ernesto Roclaw Página 1
de comunicación entre personas. Estas ideas deberían servirnos como brújula durante todo el proceso del diseño. Estas son algunas etapas que se sugieren para diseñar eficientemente un sitio; es conveniente no comenzar a utilizar el programa generador de páginas Web ni escribir ninguna línea de código HTML antes de completar las primeras etapas. 1) Definición del Tema (Etapa de conceptualización) Esta es la etapa crucial, se define de qué va a tratar el sitio Web, que cosas se incluirán y qué no. Si no se evalúa adecuadamente la cantidad de tiempo que se dispone contra la cantidad de tiempo requerida para elaborar un sitio de la magnitud deseada, el resultado puede ser desastroso. Muchos proyectos Web fracasan porque comienzan a crecer y crecer sus especificaciones, sin que haya detrás un trabajo ordenado de delimitación de contenidos. Como resultado de la etapa debemos tener claramente definidos los objetivos, el público al cual está dirigido y sus contenidos. Ejemplo: Usaremos como ejemplo el sitio web que servirá como referencia de FrontPage Express. Objetivo: El objetivo fundamental del sitio es que el usuario aprenda los conceptos básicos sobre el uso del FrontPage Express, como herramienta de creación de páginas web. 2) Recolección de la información En esta etapa se recolecta la información que se va a poner en el sitio Web, de acuerdo a la especificación hecha en la etapa anterior. Es recomendable dividirse la tarea de recolección de información entre los miembros del grupo de trabajo. 3) Incorporación de Contenidos Una vez que tenemos la información que irá en el sitio, comenzamos una clasificación apropiada. Aquí hay que encontrar un adecuado balance entre la linealidad y la jerarquización. Aplicamos una clasificación de tipo lineal a fragmentos de información que requieren que la persona que los lee vaya avanzando poco a poco en el conocimiento de algo, como en Prof. Ernesto Roclaw Página 2
un libro. Generalmente los pondremos en una misma página. Aplicamos una clasificación de tipo jerárquica a unidades de información que sean complementarias o que dependan una de otra, como secciones y subsecciones. Generalmente los pondremos en diferentes páginas. Como resultado de la etapa es necesario generar un mapa conceptual donde claramente quede reflejada la forma en que estructuraremos información. 4) Estructuración jerárquica En este punto se estructura la manera en que se unen las diferentes páginas, de acuerdo a la incorporación de contenidos realizada en la etapa anterior. Se provee de enlaces que permitan la jerarquización que diseñamos y de enlaces entre elementos de una misma jerarquía si se desea. Hay que tener en cuenta que la estructura debe responder a los criterios de búsqueda. Ejemplo: Esquema jerárquico del sitio. 5) Estructuración relacional Si dentro de nuestros objetivos planteamos la posibilidad de recorrer la información contenida en las distintas páginas del sitio utilizando diferentes caminos de navegación, ahora es el momento de establecer dichas relaciones que permitan referirse a una misma entidad (en este caso, una página HTML) en diferentes contextos. Quizás en alguna parte del sitio mencionamos a otra página y sería interesante que el usuario pudiera hacer click en esa referencia para ir a la página que estamos referenciando. Como resultado de la etapa debemos obtener un mapa navegacional donde claramente quede reflejada la forma en que se podrá navegar por el sitio, representando cada página como unidad de información y todos los enlaces existentes entre ellas. Prof. Ernesto Roclaw Página 3
Desde este punto en adelante se puede trabajar en la implementación. Ejemplo: Esquema relacional del sitio. 6) Diseño y estilo gráfico Un estilo gráfico adecuado puede ser algo importantísimo a la hora de hacer que el usuario que nos visita se sienta cómoda, y a la vez, atraída para recorrer el sitio Web. En cuanto a la cantidad y tamaño de las imágenes, hay que adoptar un equilibrio. Otro punto importante en la etapa de definición de los aspectos gráficos, es intentar en lo posible mantener una cierta coherencia gráfica, y atreverse a innovar en cuanto a las distribuciones de los botones, imágenes, etc. Un color de fondo, un fondo o una distribución interesante de los elementos dentro de una página es algo que no se olvida con facilidad. Los objetivos trazados y el perfil del usuario deberían ser los instrumentos para tomar decisiones de diseño gráfico y multimedia. Además de los criterios estéticos y comunicacionales del diseño, es importante respetar otros criterios técnicos específicos: Prof. Ernesto Roclaw Página 4
- Que cada página sea fácil de cargar: establecer para cada página un máximo de bytes. - Que las páginas sean fáciles de leer: tipografías, fondos, coherencia de estilos. - Establecer guías visuales que permitan saber que cada página pertenece al mismo sitio, coherencia visual. 7) Ensamble final En este punto concretamos el diseño, con los últimos enlaces que sean necesarios e incorporamos el estilo gráfico a las páginas, se ensambla el sitio con una portada que sea capaz de presentar en una sola página física al menos lo más relevante del sitio, se define el link hacia la página personal del autor y/o su dirección de correo electrónico. Es importante tener en cuenta los mecanismos de identificación y de recorrido del sitio, los mismos deberían permitir al usuario saber en todo momento el lugar o zona del sitio donde se encuentra, así como desplazarse hacia cualquier otra página sin necesidad de recorrer toda la cadena en sentido inverso. La tecnología de frame puede ayudar a estructurar sistemas de identificación y navegación eficaces. 8) Testeo Finalmente, es necesario revisar la coherencia general del sitio, que no hayan links "rotos" que no conduzcan a ninguna parte; revisar la redacción y ortografía de las páginas, hacer los ajustes necesarios para separar las páginas que sean demasiado extensas en páginas más pequeñas. Para esta etapa, lo mejor es tratar de ponerse en el lugar de las personas que verán el sitio, y seguir los pasos que suponemos que ellos seguirán. Si queremos evaluar el producto obtenido deberíamos tener en cuenta que un buen sitio web es aquel que cumple con eficacia los objetivos para los cuales fue creado, que logra atraer la atención y ser visitada por el público definido como destinatario, y por último que produce los efectos deseados en ese mismo público. Prof. Ernesto Roclaw Página 5