Usabilidad de WWW

Los sitios web usables resultan de una combinación de arte e ingeniería El buen diseño gráfico provee mayor claridad a las páginas individuales, y puede facilitar la experiencia del visitante en el sitio Las estructuras de información bien diseñadas facilitan a los visitantes la navegación del sitio Diseñar Páginas vs. Diseñar sitios.

Usabilidad de WWW Cómo diseñar un sitio de WWW? Determinar objetivo del sitio Información, promoción, comercio Conocer los potenciales usuarios Edad, género, tecnología usada, experiencia, etc. Aplicar alguna metodología de diseño iterativo Prototipos en papel Principios de diseño específicos para WWW Evaluación con usuarios reales

Principales propósitos de los sitios WWW Promoción Información Comercio Gran tamaño Generados o mantenidos automáticamente Requieren facilidades de navegación Generalmente tienen un diseño muy cuidadoso Participación de diseñadores gráficos Es conveniente asegurar que los usuarios retornen al sitio (concursos, discusiones, etc) Procesamiento de órdenes Generación de páginas en forma dinámica, a partir de una base de datos

Diseño de WWW Conocer a los usuarios Usuarios de la Web en general GVU Survey of WWW users ( Usuarios del sitio particular ej. Usuarios del sitio de Sun ( Pantalla gráfica de tamaño grande: 78% Pantalla gráfica pequeña: 13% Conexión rápida: 82 % Módem: 9% Acceso en sólo texto: 8%

Criterios de diseño de WWW Criterios locales Layout Navegación Links Gráficos Calidad Subjetividad Criterios globales Navegación Calidad Subjetividad

Criterios de diseño de WWW Criterios locales: layout Largo de página Los usuarios no desean efectuar scrolling El largo de cada página no debe exceder 1½ pantallas La Home Page no debe superar el largo de una pantalla Colocar elementos de navegación al comienzo de cada página Barras de scroll horizontales Su uso dificulta la interacción a los usuarios

Criterios de diseño de WWW Criterios Locales: layout Porcentaje de texto Por claridad, el % de texto de una página no debiera superar el 30% (resto: imágenes, blancos, etc.) Párrafos cortos El usuario prefiere escanear la página, no leer Deben utilizarse párrafos cortos La longitud de los párrafos debiera ser menor a 80/120 palabras

Criterios de diseño de WWW Criterios locales: navegación Cantidad de links en una página La cantidad de links de un párrafo depende de la longitud del párrafo 10 % (párrafos cortos) 5 % (párrafos largos) Links textuales En lo posible, todos los links debieran tener una representación textual Los links gráficos (imágenes) deben tener un link textual alternativo

Criterios de diseño de WWW Criterios locales: navegación Links inadecuados En lo posible debe evitarse la presencia de links tales como “volver”, “regresar”, “adelante”, “atrás” El texto debe ser más significativo La navegación del sitio por el visitante no necesariamente sigue la estructura del sitio Tabla de links (barras de navegación) La presencia de los links de navegación en una barra o tabla facilita la navegación del visitante Links al comienzo de la página La presencia de un link al comienzo de la página es importante, especialmente en páginas largas

Criterios de diseño de WWW Criterios locales: links Links con sustantivos Los links deben contener al menos un sustantivo (significativo) Longitud de los links Los links deben ser cortos para posibilitar la lectura rápida Hasta 3/4 palabras Link “click here” No proporciona información acerca de la página destino

Criterios de diseño de WWW Criterios locales: gráficos Imágenes con texto alternativo El usuario puede desactivar la carga de imágenes (por motivos de performance) Tamaño de las imágenes en una página Debe acotarse el tamaño total destinado a imágenes en una página Mayor cantidad de imágenes producen mayor tiempo de descarga La Home Page puede tener una mayor cantidad de imágenes

Criterios de diseño de WWW Criterios locales: gráficos Utilizar recursos para reducir el tiempo de descarga de imágenes Ej. Imágenes interlazadas Indicador del tamaño de la imagen La provisión del tamaño de la imagen permite al browser determinar exactamente su localización El texto de la página aparece rápidamente en su posición final El usuario puede leer el texto mientras se carga la página

Criterios de diseño de WWW Criterios locales: calidad Link a la Home Page Permite al visitante regresar al comienzo del sitio Intenta evitar la desorientación Nunca se conoce de donde proceden los visitantes Dirección del sitio al cual pertenece la página Similar al criterio anterior: Desorientación Desconocimiento del origen de los visitantes

Criterios de diseño de WWW Dirección del Webmaster Recolección de comentarios, quejas, sugerencias, etc. de los visitantes Copyright Indicar a los visitantes los derechos de propiedad de las páginas Fecha de última actualización Indicador de la actualidad y calidad de los datos contenidos

Criterios de diseño de WWW Tamaño de la página La velocidad es el problema más importante en el diseño de páginas Conocer la tecnología disponible por los usuarios potenciales Determinar el tamaño de las páginas de acuerdo a dicha tecnología

Criterios de diseño de WWW Criterios locales: subjetividad Home Page representativa del contenido del sitio El visitante debe obtener una idea rápida del objetivo y contenido del sitio Claridad en los conceptos contenidos en la página Facilitar la comprensión del visitante Distribución de los elementos visuales y textuales Balance entre los elementos contenidos en la página

Criterios de diseño de WWW Criterios locales: subjetividad Combinación adecuada de caracteres No producir fatiga visual al visitante No dificultar la comprensión de la información Tipo y forma de los caracteres Utilizar caracteres fáciles de leer Ej. las letras cursivas son más dificiles de leer Animaciones Evitar la presencia de animaciones que distraigan al visitante

Criterios de diseño de WWW Criterios locales: subjetividad Estilo de escritura de “pirámide invertida” (Sitios de Información) Forma tradicional: Enunciado del problema, trabajo relacionado, metodología, resultados, conclusiones Los reporteros utilizan un estilo de “pirámide invertida”, comenzando con la conclusión principal y tornándose más detallado progresivamente Conclusión, Información base, ‘background’ Debido a que los usuarios de WWW no desean realizar scroll, es importante colocar el punto principal primero

Criterios de diseño de WWW Criterios globales: navegación Numero promedio de links desde la Home Page a cada página 2 a 4 Links Links desactualizados Evitar la presencia de links “cortados” Páginas sueltas Evitar la existencia de páginas aisladas (o semi-aisladas)

Criterios de diseño de WWW Criterios globales: navegación Consistencia en los links principales Asegurar la misma colocación y presentación de los links de navegación, en todas las páginas del sitio Indicador del camino Es conveniente mostrar al usuario el camino desde la home page a su página actual Evitar desorientación

Criterios de diseño de WWW Criterios globales: calidad Mapa del sitio Brinda un modelo mental muy claro al visitante acerca de la estructura del sitio Acelerador para la navegación del sitio Motor de búsqueda interno Facilita la localización de información específica Fecha de ultima actualización del sitio Permite al visitante determinar si la información es de su interés o no

Criterios de diseño de WWW Criterios globales: calidad Formulario de cuestiones y/o sugerencias Comunicación con los visitantes del sitio Provisión de FAQs Ayuda de importancia para los visitantes

Criterios de diseño de WWW Criterios globales: subjetividad Arquitectura lógica de la información Proveer una organización clara de los contenidos del sitio Facilita la elaboración del modelo mental del visitante No un “baúl” de datos Información no relacionada con el sitio Evitar la presencia de este tipo de información Da menor cohesión al sitio Desorienta al usuario acerca de la información contenida

Criterios de diseño de WWW Criterios globales: subjetividad Proveer un diseño gráfico unificado Utilizar metáforas adecuadas El diseño gráfico puede dar guías al visitante acerca de su ubicación actual en el sitio Garantizar calidad de la información Los usuarios buscan información! La información debe ser confiable e interesante Una alta calidad facilita la lealtad de los visitantes

Criterios de diseño de WWW La estructura de los sitios promocionales debería basarse en la metáfora de un restaurant Página de entrada: puerta de entrada, para indicar a los visitantes donde están Túnel de entrada: ofrece la posibilidad de un pequeño recorrido del sitio, para obtener una comprensión global Página principal. Guia a los visitantes a través del contenido Túnel de salida: muestra a los visitantes la salida Página de salida: el lugar para hacerles preguntas a los visitantes