El blog de la comunicación

febrero 28, 2009

Diseño centrado en la Experiencia del usuario

1. Datos de los medios analizados:

Cadena SER

Cadena SER

Denominación del medio: Cadena SER
Tipo de medio: Web de radio
URL: www.cadenaser.com

La Razon

La Razon

Denominación del medio:  La Razón
Tipo de medio: Prensa digital
URL: http://www.larazon.es

Telemadrid

Telemadrid

1.3. Denominación del medio: Telemadrid
Tipo de medio: Web de televisión
URL: http://www.telemadrid.es

2. Resumen valorativo

Después de realizar esta práctica, me queda más que claro que hay mucho camino por recorrer en el campo del acceso, el uso y la experiencia de los usuarios en las nuevas tecnologías. Los abrumadores resultados negativos obtenidos por los tres medios en su observación y análisis ponen de manifiesta la necesidad de hacer una Red usable y accesible verdaderamente. Es en este tipo de sitios, orientados a facilitar el acceso a la información y comunicación como máximo fin, es donde debe ponerse mayor ahínco para conseguir la meta que en este trabajo nos ocupa.

3. Análisis global de experiencia del usuario

Para realizar el análisis global de experiencia del usuario he tenido en cuenta si el sitio es útil, usable, deseable, encontrable, accesible, creíble y valioso.

Valoración del sitio de la Cadena SER

•    Útil: Se trata de un medio útil, ya que proporciona al usuario información sobre la actualidad nacional e internacional, en distintos formatos de manera actualizada, además de prestar otros servicios de interés. Es posible acceder a los programas de radio grabados y escuchar la radio online.
•    Usable: Es la Web más usable de las tres, ya que permite una mayor participación del usuario y tiene mayor facilidad de uso gracias a la estructura de la página y jerarquía de las noticias.
•    Deseable: El diseño no es deseable, ya que carece de elementos atractivos que llamen la atención del usuario, es un diseño muy sencillo. La ausencia de publicidad si que atrae al usuario sediento de contenidos.
•    Encontrable: La información es fácil de localizar, si simplemente estás echando un vistazo y viendo las noticias del día. El buscador permite localizar la información, aunque en ocasiones no es muy exacto en sus búsquedas. Es fácil localizar las secciones y existe la posibilidad de localizar las emisoras por provincias. Creo que es un portal bastante intuitivo en este aspecto.
•    Accesible: La accesibilidad es baja. La navegación obedece al uso de ratón y teclado, aunque los contenidos de la radio pueden ser reproducidos para ser escuchados, estos no están transcritos para las personas con dificultades auditivas. Es posible aumentar el tamaño de los elementos para personas con problemas de visión.
•    Creíble: Se trata de un medo creíble, sobre todo por la reputación del grupo al que pertenece (PRISA) y a su trayectoria histórica. Cita a sus fuentes en ocasiones, lo que en las otras ocasiones puede restarle credibilidad. Ofrece contacto y muestra la estructura, tanto de la Cadena SER como del grupo PRISA, lo que fortalece la credibilidad. Se muestra la hora en la que se producen las actualizaciones, por lo que aumenta la confianza que se pueda tener en el medio. Carece de errores tipográficos y ortográficos.
•    Valioso: Al ser el portal de un medio de comunicación, es valioso para el conjunto de la sociedad, ya que permite que los individuos están informados de lo que pasa en sus provincias, comunidades, país y de las noticias internacionales. Es valioso también como estructura empresarial, ya que da trabajo a muchos individuos, permite un flujo económico y sirve de plataforma para la inserción de publicidad por parte de otras empresas.

Valoración del sitio de La Razón

•    Útil: Es un medio útil porque aporta información de actualidad provincial, autonómica, nacional e internacional que se actualiza con frecuencia. Además ofrece servicios adicionales a sus usuarios.
•    Usable: No es una Web muy compleja en su uso y la participación de los usuarios es grande. Permite modificar la ordenación de la interfaz al gusto personal de los usuarios.
•    Deseable: Su diseño es, como en el caso anterior, bastante clásico. No resulta especialmente atractivo y está basado en la sencillez, pero, en este caso, las imágenes cobran una importancia exacerbada. Creo que la ordenación a tres columnas y el tratamiento de la información, aunque ordenada, presenta demasiados estímulos al usuario.
•    Encontrable: Para el usuario que busca informarse de las noticias del día, el acceso a la información es fácil. El uso de las secciones y subsecciones también lo es. Tiene un buscador que puede resultar impreciso, ya que no cuenta con búsquedas avanzadas. Se permite el acceso a ediciones provinciales.
•     Accesible: El sitio requiere del uso de teclado y ratón para la navegación. Contiene vídeos y audios en algunas noticias, pero no son transcritos para personas con fallos auditivos. El acceso de personas con problemas de visión puede realizarse mediante el aumento de tamaño de los elementos.
•    Creíble: Es un medio creíble debido a su trayectoria. Cita las fuentes generalmente y se trata de un medio con buena reputación. Da acceso a la estructura interna del medio y ofrece información sobre su actualización de contenidos.
•    Valioso: Es un portal valioso en cuanto que ofrece información sobre los acontecimientos a distintos niveles. También se trata de una empresa con flujo económico y que sirve como soporte de publicidad.

Valoración del sitio de Telemadrid

•    Útil: Es un medio muy útil para los usuarios autonómicos. Ofrece información a todos los niveles, pero especialmente a nivel autonómico. Ofrece información textual y audiovisual. También ofrece servicios alternativos.
•    Usable: El uso de esta Web está limitado al acceso a los contenidos informativos. Apenas ofrece la posibilidad de participación del usuario. Sólo ofrece la posibilidad de contactar.
•    Deseable: El diseño no es atractivo ya que contiene demasiados estímulos que complican la navegación y pueden aturdir al usuario. El tamaño de la tipografía es excesivamente pequeño.
•    Encontrable: Para los usuarios que busquen información del día, es fácil el acceso a las noticias. Tiene pestañas que permiten el acceso a las noticias según tipología, pero el buscador redirecciona a búsquedas en la red, no dentro del propio sitio. Sin embargo, el acceso a los servicios es claro y funcional.
•    Accesible: Es posible aumentar el tamaño de la Web para facilitar el acceso de personas con visibilidad reducida, pero los audios y vídeos carecen de transcripción para aquellas personas con limitaciones auditivas.
•    Creíble: En mi opinión, no es una Web muy creíble ya que he encontrado pocas citas de fuentes, el link a la información corporativa no está dirigido a la estructura del medio y los contenidos son realmente escuetos. Creo que se trata más bien de un medio de servicios.
•    Valioso: Este sitio es valioso para la sociedad madrileña, pues ofrece sobre todo información de la comunidad. La interactuación del usuario es reducida, por lo que resta valiosidad al medio. Como empresa cumple su función valiosa, pero en este caso la inserción de publicidad está limitada a la del propio medio.

4.      Análisis de Usabilidad

Para llevar a cabo el análisis de usabilidad de los tres medios, he tenido en cuenta las recomendaciones más importantes recogidas por Jakob Nielsen. Estos parámetros son: Estado de los enlaces,  uso del botón ¨Atrás¨, uso de nuevas ventanas de navegación,  ventanas emergentes, elementos de diseño confusos, contenido, contacto,  elementos en movimiento, etiquetado, actualización y páginas huérfanas.

Análisis del sitio de la Cadena SER

La usabilidad de este medio es buena, aunque existen algunas características no recomendadas, como el uso de ventanas nuevas de navegación o el texto en movimiento, pero que pueden ser justificadas por la finalidad para la que son usadas. Los parámetros observados para el análisis, son los siguientes:
•    Enlaces: Los enlaces no cambian de color después de ser visitados, por lo que puede llevar a error en el caso de intentar acceder a varias informaciones sobre un mismo tema. .
•    Botón ¨Atrás¨: Permanece activo durante toda la navegación.
•    Nuevas ventanas de navegación: Toda la navegación se produce en la misma ventana, a excepción de la opción de escuchar la emisora online, que hace uso de una nueva ventana de navegación, el acceso a las noticias de última hora y el acceso a través de banners a contenidos de los programas.
•    Ventanas emergentes: No he encontrado ninguna durante todo el proceso de navegación.
•    Elementos de diseño: No he encontrado elementos de diseño que puedan confundirse con la publicidad, pero sí elementos de publicidad que pretendían hacerse pasar por informaciones.
•    Contenido: Los contenidos son amplios y se ofrecen en diversos formatos.
•    Contacto: Se ofrece la información pertinente y la opción de contactar fácilmente.
•    Elementos en movimiento: Cuenta con varios elementos en movimiento, la publicidad, los vídeos de informaciones concretas y las noticias de última hora. En este último caso, aparecen en la parte superior de la pantalla y se ofrecen así creando una relación con la presentación de noticias de última hora en televisión.
•    Etiquetado: El etiquetado se produce según secciones, subsecciones y epígrafes. Creo que la información en este aspecto está bastante organizada.
•    Actualización: Página muy actualizada, se observan varias actualizaciones a lo largo del estudio del sitio.
•    Páginas huérfanas: No se han localizado páginas huérfanas, ni enlaces rotos, en casi todas las páginas del sitio se tiene acceso al menú principal.
Tras el análisis a través de la Web developer toolbar, se observa que con la activación o desactivación de determinados elementos, sobre todo es el diseño el que se ve afectado, ya que el acceso a los contenidos sigue siendo posible. La desactivación de los estilos ofrece una navegación lineal y algo caótica, la desactivación de imágenes evita el acceso a la información a través de ellas, pero pueden ser llevadas a cabo por elementos textuales.

Análisis del sitio de La Razón

La usabilidad de este medio es buena, aunque existen algunas características no recomendadas, como el uso de ventanas nuevas de navegación o el texto en movimiento, pero que pueden ser justificadas por la finalidad para la que son usadas. Los parámetros observados para el análisis, son los siguientes:
•    Enlaces: Los enlaces no cambian de color después de ser visitados, por lo que puede llevar a error en el caso de intentar acceder a varias informaciones sobre un mismo tema. .
•    Botón ¨Atrás¨: Permanece activo durante toda la navegación.
•    Nuevas ventanas de navegación: Toda la navegación se produce en la misma ventana, a excepción del acceso a la publicidad, acceso a algunos vídeos, a determinados servicios y a la hemeroteca.
•    Ventanas emergentes: He encontrado alguna ventana emergente de publicidad.
•    Elementos de diseño: No he encontrado elementos de diseño que puedan confundirse con la publicidad.
•    Contenido: Los contenidos son amplios y se ofrecen en diversos formatos.
•    Contacto: Se ofrece la información pertinente y la opción de contactar fácilmente.
•    Elementos en movimiento: No he encontrado más elementos en movimiento que los relativos a la publicidad y los vídeos expuestos como noticias.
•    Etiquetado: El etiquetado se produce según secciones, subsecciones y epígrafes. La información queda bien etiquetada para facilitar el acceso del usuario.
•    Actualización: Página con frecuente actualización. He observado varias actualizaciones a lo largo del estudio del sitio.
•    Páginas huérfanas: No se han localizado páginas huérfanas, ni enlaces rotos, en casi todas las páginas del sitio se tiene acceso al menú principal.
Con la desactivación de las imágenes, el sitio tiene una presentación poco atractiva, ya que tiene un diseño muy centrado en las imágenes, aunque el acceso a los contenidos sigue siendo posible. Los vídeos siguen siendo operativos.

Análisis del sitio de Telemadrid

La usabilidad de este medio no resulta suficiente, ya que en el caso de posibles incidencias, el sitio puede no ser operativo. Los elementos básicos están bien gestionados, pero el análisis a través de la Web developer toolbar muestra carencias llamativas.
•    Enlaces: Los enlaces no cambian de color después de ser visitados, por lo que puede llevar a error en el caso de intentar acceder a varias informaciones sobre un mismo tema. .
•    Botón ¨Atrás¨: Permanece activo durante toda la navegación.
•    Nuevas ventanas de navegación: La navegación se produce, generalmente, en la misma ventana, a excepción del acceso emisiones de determinados eventos, televisión en directo y acceso a servicios útiles. Me ha llamado la atención que el acceso a la tienda virtual se produce a través de la misma ventana de navegación.
•    Ventanas emergentes: He encontrado alguna ventana emergente de publicidad.
•   Elementos de diseño: Al ser una Web sin publicidad, no se encuentran objetos del diseño con posibilidad de confusión.
•   Contenido: Los contenidos son escasos aunque con temática variada.
•  Contacto: Se ofrece la información pertinente y la opción de contactar fácilmente, aunque la información corporativa es restringida.
•    Elementos en movimiento: No he encontrado más elementos en movimiento que los relativos a la publicidad y los vídeos expuestos como noticias.
•    Etiquetado: El etiquetado es reducido y produce sensación de desorganización.
•    Actualización: Página con frecuente actualización. Se observan varias actualizaciones a lo largo del estudio del sitio.
•    Páginas huérfanas: No se han localizado páginas huérfanas, ni enlaces rotos, aunque en determinadas página se pierde el acceso al menú principal.
La desactivación de imágenes no ofrece información alternativa a esta, aunque permite la posibilidad de acceder al enlace. En el caso de epígrafes sustituidos por imágenes, se elimina la posibilidad de acceso a ellos.

5. Análisis de accesibilidad

Para realizar este análisis he tenido en cuenta las siguientes herramientas:
Information, Images y WAI
Las tres páginas demuestran muchos fallos en este aspecto y suspenden categóricamente en el parámetro de la accesibilidad. La página de Telemadrid se muestra peor estructurada y planificada que las otras, pero la de la Cadena SER, aunque muestre mejor estructuración que el resto, no llega a los mínimos de accesibilidad razonable.

Análisis del sitio de Cadena SER

Information: Según este parámetro, no he conseguido observar ninguna tabla, por lo que no he podido comprobar su transformación. No posee atajos de teclado, pero sí anclajes de los que puede obtenerse múltiples informaciones. También cuenta con Block Size y Div Order, que aparecen de forma desordenada y mezclada. Es posible ver el documento “outline” y funciona correctamente como JavaScript y Link. Como característica positiva, las características de los títulos están correctamente señalizadas.
Images: En este atributo aparecen varios errores en la planificación del diseño, ya que al desactivar las imágenes, se desactivan algunas cabeceras, banners…Las imágenes están optimizadas para Web, lo que hace que la página funcione correctamente.
WAI: La validación WAI vierte como resultados en el verification checklist.  4 aprobados, 7 suspensos y 11 “others” de los cuales 2 son Warning. Esto muestra una accesibilidad negativa.
Cuando se intenta pasar la Web a escala de grises, estos desaparecen, lo que muestra la poca accesibilidad planificada en esta Web. Las imágenes, subidas con alt, dan errores graves. Para mejorar la programación de la página se recomienda crear un orden lógico a través de los links, controles y objetos.

Análisis del sito de La Razón

Information: En esta página aparece información sobre la profundidad de las tablas. <Tampoco tiene atajos de teclado pero tiene más anclajes que en las otras webs. Los Block Size y Div Order son numerosos y más ordenados que en la Web anterior. Lo más negativo a destacar es que la información de los títulos no es accesible ya que se presenta en lenguaje de programación. Es posible visualizar la página “outline” con una configuración personal de la página principal. Funciona en las opciones tanto JavaScript como Link.
Images: Las imágenes están optimizadas para la Web y no producen errores. Al desactivar las imágenes desaparecen banners y algunas cabeceras. Sería recomendable que, sobre todo las cabeceras no desaparecieran En caso de errores técnicos, esta Web perdería fuerza debido a la gran importancia que tienen las imágenes en ella.
•    WAI: No es posible validar esta página. Se produce un error y aparece la siguiente información:
Verified File Name: http://www.larazon.es/pagina/home Failed Automated Verification

Análisis del sitio de Telemadrid

Information: En este caso tampoco he conseguido información sobre tablas, no ofrece atajos de teclado y tampoco anclajes. En contraposición, los Block Size y Div aparecen de manera ordena y estructurada. Puede visualizarse la página “outline”, aunque aparece información muy escasa. Funciona bien en JavaScript y Link.
Images: Al deshabilitar las imágenes no he encontrado errores. Al desplegar todos los atributos, las dimensiones de las imágenes, el peso de las mismas y los paths todo funciona correctamente, pero cabe mencionar la gran cantidad de imágenes que tiene este portal y que podrían ser convertidas en texto. Las imágenes de fondo, es decir, las background no existen en este portal.
WAI: La validación WAI muestra un resultado de 3 aprobados, 10 suspensos y 14 “other” de los cuales 2 son “warning”. Un resultado terrible para una página destinada a la comunicación e información. Demasiados errores para una página con tan poco contenido. Los colores no admitan ser pasados a escala de grises aparecen huecos en las columnas…Para mejorar el sitio, se recomienda, entre otras cosas dividir los grandes bloques de información en grupos más manejables de forma natural y apropiada e identificar de forma clara los targets de cada link.

6. Análisis de composición y validación de los estándares

Análisis del sitio de la Cadena SER

1. Outline
Frames: En esta página aparecen varios frames. Dos superiores que contienen sendos banners publicitarios y otros que contienen información audiovisual que se reproduce sin acudir a nuevas ventanas de navegación.
Headings: Son utilizados en el encabezamiento y en los titulares con hipervínculo.
External Links: La navegación requiere de estos tipos de links en la publicidad, pero también se utiliza en la opción de escuchar la emisión en directo, el acceso a banners de la cadena y en secciones como Anecdotario u  Hora 25 Global.
La organización de la página se basa en una estructura jerárquica a través de bloques contenedores de otras informaciones.
2. Sometiendo a análisis de CSS el sitio observamos que aparecen 40 errores. Error de análisis sintáctico 404 */ #ser404 #col_container, La propiedad rel no existe : nofollow o La propiedad order-left-width no existe : 0, lo cual no dice mucho a favor del sitio.
3. Validate Feed
Muestra dos errores graves, el formato de la dirección de correo electrónico no es el recomendado y un error en el lenguaje de programación. Dos errores importantes. La posibilidad de utilización de RSS es una facilidad para el usuario y para el acceso a la información de manera rápida y eficaz.
4. Validate HTML
Este sitio tiene 529 errores y 87 alertas. Muchos de esos errores son los mismos en las diferentes partes de la Web.

Análisis del sitio de La Razón
1. Outline
Headings: Solo aparece uno en la sección Especial elecciones.
External Links: Como en el anterior caso, la publicidad siempre utiliza este tipo de links, pero la Hemeroteca también lo usa y otras secciones, como la publicidad corporativa.
La organización está basada en tres columnas y jerárquicamente por bloques. Aparecen multitud de frames sin utilidad aparente.
2. El análisis de CSS de larazon.es muestra 8 errores, un número bastante inferior que el de la cadena SER. Error de análisis sintáctico opacity=85), La propiedad opacity no existe en CSS versión 2.1 pero existe en [css3] : 0.85 son algunos de sus ejemplos. Lo ideal sería que no existieran errores, pero este resultado no es tan escandaloso como el anterior.
3. Validate Feed:
La Razón también sufre un error en el lenguaje de programación y también ofrece la posibilidad de uso del RSS, por lo tanto con las mismas ventajas.
4. Validate HTML
Al validar este sitio con la Web developer toolbar  siguiendo el criterio HTML, encontramos 61 errores y una alerta. Este número parece ser aceptable en comparación con el análisis de su antecesora. Los errores de esta página no son recurrentes.

Análisis del sitio de Telemadrid

1. Outline
No encuentro  Frames ni Headings.
External Links: Sólo utiliza los links externos para el buscador y la sección de servicios.
La organización carece de jerarquías y se estructura en 4 columnas. La organización deja mucho que desear en este aspecto.
2. Tras analizar el resultado del CSS observamos, como en el caso de larazon.es, que tiene 8 errores. Un número aceptable tras ver los resultados de otros sitios. Error de análisis sintáctico : hover, La propiedad bgcolor no existe : #ffffff son algunos de los ejemplos de estos errores.
3. Validate Feed:
Al intentar validar esta página con la Web developer toolbar  se produce el siguiente error:“It looks like this is a Web page, not a feed. I looked for a feed associated with this page, but couldn’t find one. Please enter the address of your feed to validate.” Esta página no puede ser validada.
Validate HTML
En el momento de la validación de esta Web aparecen 159 errores y 2 alertas. No es un resultado tan escandaloso como el de la Cadena SER, pero queda a la zaga de La Razón. No se producen errores recurrentes como en el caso de la Web de La Razón.

Crea un blog o un sitio web gratuitos con WordPress.com.