GuadeEvaluacinHeursticadeSitiosWeb

Resumen: Guaenformadechecklistparalaevaluacinheursticaenbaseadimesionescomo:identidad, lenguajeyredaccin,accesibilidad,layout,elementosmultimedia...

Categora: Mtodos de Evaluacin

Introduccin
Este documento tiene por objeto servir de gua general para la evaluacin de la usabilidad de sitios web. Es una versin resumida de la gua que nosotros utilizamos en nuestra actividad profesional, aunque lo suficientemente extensa y especfica como para resultar de utilidad a aquellos profesionales que requieran de un documento base (que poder extender segn sus propias necesidades) con el que empezar a trabajar en evaluacin heurstica. La Gua est estructurada en forma de checklist, para facilitar la prctica de la evaluacin. Como se puede observar, todas las puntos estn formulados como preguntas, dnde la respuesta afirmativa implica que que no existe un problema de usabilidad, y la negativa que si. Los diferentes criterios en los que estn clasificados todos los puntos a evaluar son: GENERALES IDENTIDAD E INFORMACIN LENGUAJE Y REDACCIN ROTULADO ESTRUCTURA Y NAVEGACIN LAY-OUT DE LA PGINA BSQUEDA ELEMENTOS MULTIMEDIA AYUDA ACCESIBILIDAD CONTROL y RETROALIMENTACIN

Generales

Culessonlosobjetivosdelsitioweb?Sonconcretosybiendefinidos?Loscontenidosy serviciosqueofrecesecorrespondenconesosobjetivos? TieneunaURLcorrecta,clarayfcilderecordar?YlasURLdesuspginasinternas? Sonclarasypermanentes? Muestradeformaprecisaycompletaqucontenidososerviciosofrecerealmenteelsitio web?

Esto est relacionado directamente con el diseo de la pgina de inicio, que debe ser diferente al resto de pginas y cumplir la funcin de 'escaparate' del sitio.

Laestructurageneraldelsitiowebestorientadaalusuario?

Los sitios web deben estructurarse pensando en el usuario, sus objetivos y necesidades. No se debe calcar la estructura interna de la empresa u organizacin, al usuario no le interesa cmo funciona o se organiza la empresa.

Ellook&feelgeneralsecorrespondeconlosobjetivos,caractersticas,contenidosy serviciosdelsitioweb?

Por ejemplo, los colores empleados. Aunque el significado que comunica un determinado color es muy subjetivo y dependiente de la cultura y el entorno, y por lo tanto diferente para cada usuario, ciertas combinaciones de colores ofrecen una imagen ms o menos formal, seria o profesional, como pueden ser los tonos de azules con el blanco, que trasmiten una imagen corporativista.

Escoherenteeldiseogeneraldelsitioweb?

Se debe mantener una coherencia y uniformidad en las estructuras y colores de todas las pginas. Esto sirve para que el usuario no se desoriente en su navegacin.

Esreconocibleeldiseogeneraldelsitioweb?

Cunto ms se parezca el sitio web al resto de sitios web, ms fcil ser de usar.

Elsitiowebseactualizaperidicamente?Indicacundoseactualiza?

Las fechas que se muestren en la pgina deben corresponderse con actualizaciones, noticias, eventos...no con la fecha del sistema del usuario.

Identidad e Informacin

Semuestraclaramentelaidentidaddelaempresasitioatravsdetodaslaspginas? ElLogotipo,essignificativo,identificableysuficientementevisible? Elesloganotagline,expresarealmentequeslaempresayquserviciosofrece?

Seofrecealgnenlaceconinformacinsobrelaempresa,sitioweb,'webmaster',...? Seproporcionamecanismosparaponerseencontactoconlaempresa?

(email, telfono, direccin postal, fax...)

Seproporcionainformacinsobrelaproteccindedatosdecarcterpersonaldelos clientesolosderechosdeautordeloscontenidosdelsitioweb? Enartculos,noticias,informes...Semuestraclaramenteinformacinsobreelautor, fuentesyfechasdecreacinyrevisindeldocumento?

Lenguaje y Redaccin

Elsitiowebhablaelmismolenguajequesususuarios?

Se debe evitar usar un lenguaje corporativista. As mismo, hay que prestarle especial atencin al idioma, y ofrecer versiones del sitio en diferentes idiomas cuando sea necesario.

Empleaunlenguajeclaroyconciso? Esamigable,familiarycercano?

Es decir, lo contrario a utilizar un lenguaje constantemente imperativo, mensajes crpticos, o tratar con "desprecio" al usuario.

1prrafo=1idea?

Cada prrafo es un objeto informativo. Trasmita ideas, mensajes...Se deben evitar prrafos vacos o varios mensajes en un mismo prrafo.

Rotulado

Losrtulos,sonsignificativos?

Ejemplo: evitar rtulos del tipo "haga clic aqu".

Usartulosestndar?

Siempre que exista un "estndar" comnmente aceptado para el caso concreto, como "Mapa del Sitio" o "Acerca de...".

Usaunnicosistemadeorganizacin,biendefinidoyclaro?

No se deben mezclar sistemas de organizacin diferentes. Los diferentes sistemas de organizacin son bsicamente: alfabtico, geogrfico, cronolgico, temtico, orientado a tareas, orientado al pblico y orientado a metforas.

Utilizaunsistemaderotuladocontroladoypreciso?

Por ejemplo, si un enlace tiene el rtulo "Quines somos", no puede dirigir a una pgina cuyo encabezamiento sea "Acerca de", o un enlace con el rtulo "Ayuda" no puede dirigir a una pgina encabezada con "FAQs".

Elttulodelaspginas,Escorrecto?Hasidoplanificado?

Relacionado con la 'findability' del sitio web.

Estructura y Navegacin

Laestructuradeorganizacinynavegacin,Eslamsadecuada?

Hay varios tipos de estructuras: jerrquicas, hipertextual, facetada,...

Enelcasodeestructurajerrquica,MantieneunequilibrioentreProfundidadyAnchura? Enelcasodeserpuramentehipertextual,Estntodoslosclustersdenodos comunicados?

Aqu se mide la distancia entre nodos.

Losenlacessonfcilmentereconociblescomotales?sucaracterizacinindicasuestado (visitados,activos,...)?

Los enlaces no slo deben reconocerse como tales, sino que su caracterizacin debe indicar su estado (para orientar al usuario), y ser reconocidos como una unidad (enlaces que ocupan ms de una lnea).

Enmensdenavegacin,Sehacontroladoelnmerodeelementosydetrminospor elementoparanoproducirsobrecargamemorstica?

No se deben superar los 72 elementos, ni los 2 o, como mucho, 3 trminos por elemento.

Espredeciblelarespuestadelsistemaantesdehacerclicsobreelenlace?

Esto est relacionado con el nivel de significacin del rtulo del enlace, aunque tambin con: el uso de globos de texto, informacin contextual (indicar formato y tamao del documento o recurso con el que vincula el enlace), la barra de estado del navegador,...

Sehacontroladoquenohayaenlacesquenollevananingnsitio?

Enlaces que no llevan a ningn sitio: Los enlaces rotos, y los que enlazan con la misma pgina que se est visualizando (por ejemplo enlaces a la "home" desde la misma pgina de inicio)

Existenelementosdenavegacinqueorientenalusuarioacercadedndeestycmo deshacersunavegacin?

...como breadcrumbs, enlaces a la pgina de inicio,...recuerde que el logo tambin es recomendable que enlace con la pgina de inicio.

Lasimgenesenlace,sereconocencomoclicables?incluyenunatributo'title' describiendolapginadedestino?

En este sentido, tambin hay que cuidar que no haya imgenes que parezcan enlaces y en realidad no lo sean.

Sehaevitadolaredundanciadeenlaces? Sehacontroladoquenohayapginas"hurfanas"?

Pginas hurfanas: que an siendo enlazadas desde otras pginas, stas no enlacen con ninguna.

Lay-Out de la Pgina

Seaprovechanlaszonasdealtajerarquainformativadelapginaparacontenidosde mayorrelevancia?

(como por ejemplo la zona central)

Sehaevitadolasobrecargainformativa?

Esto se consigue haciendo un uso correcto de colores, efectos tipogrficos y agrupaciones para discriminar informacin. Al igual que en los elementos de un men de navegacin, los grupos diferentes de objetos informativos de una pgina, no debern superar el nmero 72.

Esunainterfazlimpia,sinruidovisual? Existenzonasen"blanco"entrelosobjetosinformativosdelapginaparapoder descansarlavista? Sehaceunusocorrectodelespaciovisualdelapgina?

Es decir, que no se desaproveche demasiado espacio con elementos de decoracin, o grandes zonas en "blanco", y que no se adjudique demasiado espacio a elementos de menor importancia.

Seutilizacorrectamentelajerarquavisualparaexpresarlasrelacionesdeltipo"parte de"entreloselementosdelapgina?

(La jerarqua visual se utiliza para orientar al usuario)

Sehacontroladolalongituddepgina?

Se debe evitar en la medida de lo posible el scrolling. Si la pgina es muy extensa, se debe fraccionar.

Bsqueda
(siempre que fuera necesario, por la extensin del sitio web, la incorporacin de un buscador interno)

Seencuentrafcilmenteaccesible?

Es decir: directamente desde la home, y a ser posible desde todas las pginas del sitio, y colocado en la zona superior de la pgina.

Esfcilmentereconociblecomotal? Permitelabsquedaavanzada?

(siempre y cuando, por las caractersticas del sitio web, fuera de utilidad que la ofreciera)

Muestralosresultadosdelabsquedadeformacomprensibleparaelusuario? Lacajadetextoeslosuficientementeancha? Asistealusuarioencasodenopoderofrecerresultadosparaunaconsultadadada?

Elementos Multimedia

Lasfotografasestnbienrecortadas?soncomprensibles?sehacuidadosu resolucin? Lasmetforasvisualessonreconociblesycomprensiblesporcualquierusuario?

(prestar especial atencin a usuarios de otros pases y culturas)

Elusodeimgenesoanimacionesproporcionaalgntipodevaloraadido? Sehaevitadoelusodeanimacionescclicas?

Ayuda

SiposeeunaseccindeAyuda,Esverdaderamentenecesaria?

Siempre que se pueda prescindir de ella simplificando los elementos de navegacin e interaccin, debe omitirse esta seccin.

EnenlacealaseccindeAyuda,Estcolocadoenunazonavisibley"estndar"?

La zona de la pgina ms normal para incluir el enlace a la seccin de Ayuda, es la superior derecha.

Seofreceayudacontextualentareascomplejas?

(transferencias bancarias, formularios de registro...)

SiposeeFAQs,escorrectatantolaeleccincomolaredaccindelaspreguntas?ylas respuestas?

Accesibilidad

Eltamaodefuentesehadefinidodeformarelativa,oporlomenos,lafuenteeslo suficientementegrandecomoparanodificultarlalegibilidaddeltexto? Eltipodefuente,efectostipogrficos,anchodelneayalineacinempleadosfacilitanla lectura? Existeunaltocontrasteentreelcolordefuenteyelfondo? Incluyenlasimgenesatributos'alt'quedescribansucontenido? Escompatibleelsitiowebconlosdiferentesnavegadores?Sevisualizacorrectamente condiferentesresolucionesdepantalla?

Se debe prestar atencin a: JScript, CSS, tablas, fuentes...

Puedeelusuariodisfrutardetodosloscontenidosdelsitiowebsinnecesidaddetener quedescargareinstalarpluginsadicionales? Sehacontroladoelpesodelapgina?

Se deben optimizar las imgenes, controlar el tamao del cdigo JScript...

Sepuedeimprimirlapginasinproblemas?

Leer en pantalla es molesto, por lo que muchos usuarios preferirn imprimir las pginas para leerlas. Se debe asegurar que se puede imprimir la pgina (no salen partes cortadas), y que el resultado es legible.

Control y Retroalimentacin

Tieneelusuariotodoelcontrolsobreelinterfaz?

Se debe evitar el uso de ventanas pop-up, ventanas que se abren a pantalla completa, banners intrusivos...

Seinformaconstantementealusuarioacercadeloqueestpasando?

Por ejemplo, si el usuario tiene que esperar hasta que se termine una operacin, la pgina debe mostrar un mensaje indicndole lo que est ocurriendo y que debe esperar. Aadir en el mensaje el tiempo estimado que tendr que esperar el usuario, o una barra de progreso, ayudar al usuario en este sentido.

Seinformaalusuariodeloquehapasado?

Por ejemplo, cuando un usuario valora un artculo o responde a una encuesta, se le debe informar de que su voto ha sido procesado correctamente.

Cuandoseproduceunerror,seinformadeformaclaraynoalarmistaalusuariodelo ocurridoydecmosolucionarelproblema?

Siempre es mejor intentar evitar que se produzcan errores a tener que informar al usuario del error.

Poseeelusuariolibertadparaactuar?

Se debe evitar restringir la libertad del usuario: Evite el uso de animaciones que no pueden ser "saltadas", pginas en las que desaparecen los botones de navegacin del browser, no impida al usuario poder usar el botn derecho de su ratn...

Sehacontroladoeltiempoderespuesta?

Aunque esto tiene que ver con el peso de cada pgina (accesibilidad) tambin tiene relacin con el tiempo que tarda el servidor en finalizar una tarea y responder al usuario. El tiempo mximo que esperar un usuario son 10 segundos.

Aclaraciones
La orientacin del usuario (dnde estoy, cmo volver, qu he visitado, qu va a pasar...) se puede evaluar a travs de varios criterios: elementos de navegacin orientativos, caracterizacin de los enlaces e informacin contextual en elementos de interaccin (estructura y navegacin); distribucin visual de la pgina (lay-out); coherencia del diseo (generales); nivel de significacin de los rtulos (rotulado) y retroalimentacin del usuarios (control y retroalimentacin). Respecto a la publicidad (normalmente en forma de banners), si bien no se le hace una mencin explcita en la Gua, se puede evaluar desde varios criterios: lenguaje (lenguaje y redaccin), nivel de significacin de los rtulos (rotulado), jerarqua informativa y ruido visual (lay-out de la pgina), pop-ups y banners intrusivos (control y retroalimentacin)...