Análisis de la web de LaLiga

Experiencia de usuario
22/8/2016
|
Samuel Gimeno Artigas
Escritorio redondo con laptop, gafas, planta, celular, lápices y unas manos de mujer tecleando.

Ya ha comenzado el Campeonato de Liga 2016-17, y hoy vamos a analizar la página web oficial de LaLiga. Esta web fue presentada hace pocos meses y en su comunicado oficial  la propia Liga de Fútbol Profesional hacía énfasis en algunos aspectos del rediseño:

Con un aspecto muy remodelado y un interfaz mucho más intuitivo, la nueva web de LaLiga expone innovación y vanguardismo a partes iguales. La categorización del contenido estará clasificada en distintas pestañas que te ayudarán a encontrar la información que estás buscando. Las noticias, los reportajes y las entrevistas ahora los observarás organizados en diferentes niveles y las imágenes tomarán un papel mucho más protagonista del que tenían hasta el momento. Además, podrás disfrutar con todos los datos de los jugadores y los equipos con las estadísticas oficiales de LaLiga.

Así que hoy vamos a analizarla para ver si cumple las expectativas que el comunicado transmitía de hacer una mejor web para los aficionados, analizando la página principal del sitio.

Captura de pantalla 2016-08-18 a las 11.40.21

Página principal

El primer vistazo descubre una web compleja, con un diseño moderno y muy ambiciosa en cuanto a contenidos. Incluye tanto información institucional y relacionada con la Liga de Fútbol Profesional (LFP) como información de actualidad de equipos de Primera División (noticias, horarios de partidos, resultados, clasificaciones, etc), Segunda División y la competición de Liga Femenina, así como otras competiciones no organizadas por la LFP como Champions League, Europa League, Supercopa de España y Europa o Mundial de Clubes.

Este alcance de contenidos encaja muy bien con su objetivo de convertirse en referente en todo lo relacionado con fútbol profesional en España, incluyendo estadísticas de las competiciones. Sin embargo, quizá se echa de menos una arquitectura de información y organización de páginas más segmentadas, puesto que se ponen al mismo nivel la competición de Primera División (que ahora se denomina LaLiga Santander, por su patrocinador), que acapara la mayor parte de la atención del aficionado, con otras competiciones de menor alcance mediático.

Precisamente esta gran amplitud de contenidos sin mayor segmentación que el menú de navegación resulta en una estructura general de página principal algo caótica, puesto que el visitante que accede por primera vez puede ver menús que se repiten (ver apartado Navegación), además de un carrusel de grandes dimensiones que ocupa buena parte del espacio visible sin hacer scroll.

El logotipo de la página incluye un tagline en inglés “The Best Together” (“Lo mejor, juntos”), lo que, sin duda, ayuda a crear imagen de marca internacional. El diseño pivota sobre tarjetas que funcionan como contenedores. Se trata de un método muy flexible, que aligera lo estético y a la vez permite ordenar bien el contenido, con la intención de comunicar la información al usuario de una manera muy tranquila, sin estridencias y de forma clara.

Algo que creemos que es mejorable es que las redes sociales no aparecen en este espacio visible, y es necesario buscarlas en el pie de página, con iconos en blanco y negro que tampoco ayudan a destacarlas. Un aspecto que, en una web de la dimensión mediática de LaLiga, debería haberse tenido en cuenta. Todo ello, por supuesto, suponiendo que sea un elemento nuclear de su estrategia online, que no lo sabemos.

El widget con información en tiempo real de LaLiga está bien diseñado y resulta de gran utilidad para seguir en directo la actualidad de los partidos. Quizá echamos en falta la posibilidad de embeberlo en otras webs para que ese contenido se viralice con más facilidad.

Desde el punto de vista de accesibilidad, podemos ver a simple vista que el uso del color puede resultar confuso para personas con deficiencias en la percepción visual. Por ejemplo, en los colores de los gráficos de estadísticas. Por ese motivo, hemos usado una herramienta como Examinator, que nos ofrece una puntuación de accesibilidad. La web de LaLiga saca un aprobado justo (5,3 sobre 10), lo que resulta sorprendente en una página de este alcance global y en una competición tan seguida por millones de aficionados.

Barra de noticias destacadas

En la parte superior, la web incluye una barra de noticias destacadas, que van pasando de forma similar a un teletipo de un canal de noticias. Esta solución de diseño puede resultar muy útil para seguir en tiempo real la actualidad de los partidos. En el estudio vemos preferible adoptar una solución similar que evite la animación, dando la opción al usuario de navegar por la noticias si así lo desea. Esto ahorraría recursos y, además, evitaría distracciones innecesarias.

Además, en el momento de redactar este post sólo hay una noticia destacada, que aparece repetida múltiples veces, algo que ayuda a generar confusión.

Navegación

La web tiene varios menús de navegación, en concreto cuatro menús diferentes. Hay un preheader que incluye información relacionada con LaLiga, un menú principal (sticky cuando hacemos scroll), un menú de navegación para las noticias (debajo del carrusel de imágenes) y, finalmente, un menú en el pie de página. Los tres primeros son visibles sin hacer scroll.

Sobre todo, es confuso para un visitante entender que LaLiga Santander es la Primera División española, mientras que LaLiga 1|2|3 es la Segunda División. Además, en el caso del menú de navegación de noticias, se utilizan los mismos rotulados y logotipos para hacer el filtrado de noticias por competición, lo que genera cierta confusión en la navegación.

Carrusel

La web de LaLiga utiliza un carrusel para mostrar las noticias más destacadas. La utilización de carruseles tienen muchas implicaciones desde el punto de la usabilidad. En el caso de LaLiga, no pasa automáticamente (algo poco recomendable) pero incorpora demasiados elementos (recomendable un máximo de cinco), lo que esconde buena parte de la información que contiene.

En lo relativo al diseño visual, el contenido de la imagen activa del carrusel es estrecho y no ocupa todo el espacio disponible, por lo que a simple vista parece un espacio desaprovechado.

Localización

Aparte del idioma por defecto (castellano), la web de LaLiga muestra contenido en inglés. Apostar por una página web internacionalizada es una buena decisión para reforzar la estrategia de posicionamiento de una competición con este alcance..

Por alcance, también podría haberse abordado otros idiomas con gran afición a los equipos españoles, como el árabe o el chino. La cantidad de anunciantes de estas zonas en camisetas de los equipos da una idea del alcance que tiene LaLiga en lugares como Oriente Medio o Asia. Por lo tanto, una localización en chino y árabe sería recomendable para un mejor posicionamiento al público de esos países. Suponemos que será un desarrollo a medio plazo que, sin duda, redundará en mejorar su imagen en todo el mundo.

Web móvil

También hemos analizado la versión móvil de este sitio web. Algo que resulta desconcertante es que, usando el mismo móvil pero diferentes navegadores, el menú hamburguesa desplegable se comporta de maneras completamente diferentes. En un caso (Chrome), se desplaza con el contenido y en otro caso (navegador basado en Webkit), debes llegar al final del contenido de la página para conseguir el desplazamiento vertical del menú desplegable. Además, el menú no se superpone sobre el contenido sino que lo desplaza a la derecha, lo que obliga a volver arriba al icono del menú hamburguesa para ocultar el menú y seguir navegando.

En este caso, el contenido se adapta mejor que en la versión escritorio a la disposición de pantalla del dispositivo móvil. Las imágenes del carrusel se adaptan perfectamente a la disposición de página, tanto en horizontal como en vertical. Las redes sociales aparecen destacadas en el menú principal, más visibles que en el caso de escritorio.

Conclusiones

En definitiva, un buen trabajo de gestión de rediseño y contenidos pero con algunos aspectos mejorables en usabilidad y accesibilidad que, sin duda, mejorarían sensiblemente la experiencia de un aficionado que busca información de actualidad de LaLiga española.

En una web como esta hay que cuidar tanto la calidad de la información que se muestra como el acceso a ella. Si cuidamos ambas, el usuario tendrá una experiencia agradable que al final creará un hábito en él, lo que permitirá que un sitio web como éste se posicione como referencia de los aficionados, tanto españoles como extranjeros.

¿Quieres darnos tu impresión sobre este post?

Deja una respuesta

Aquí va tu texto personalizado.

Blog

Nos encanta compartir lo que sabemos sobre diseño de producto y experiencia de usuario.
Ver todo el blog
Puedes consultarnos lo que necesites
Envíanos un mensaje
Nombre
Email
Mensaje
Gracias por escribirnos. Nuestro equipo se pondrá en contacto contigo tan pronto como sea posible.
Ha ocurrido un error. Estamos trabajando para resolverlo. Puedes escribirnos al chat.