{"id":1118,"date":"2021-11-18T09:54:01","date_gmt":"2021-11-18T08:54:01","guid":{"rendered":"https:\/\/blogs.ugr.es\/tecweb\/?p=1118"},"modified":"2021-11-18T09:54:01","modified_gmt":"2021-11-18T08:54:01","slug":"analisis-de-una-home-page-el-sitio-web-de-la-ugr","status":"publish","type":"post","link":"https:\/\/blogs.ugr.es\/tecweb\/analisis-de-una-home-page-el-sitio-web-de-la-ugr\/","title":{"rendered":"An\u00e1lisis de una home page: el sitio web de la UGR"},"content":{"rendered":"

\u00bfPor qu\u00e9 no es aconsejable dejar en manos de un inform\u00e1tico la gesti\u00f3n de contenidos de un sitio web y muy necesario que se encargue de eso un arquitecto de la informaci\u00f3n? Con una frase parecida a esta suelo comenzar las clases cuando analizamos la estructura y contenido de cualquier sitio web. Habitualmente, a continuaci\u00f3n, sol\u00eda escoger la web de compras online de Mercadona<\/a>, que era un aut\u00e9ntico desastre, y empezaba a listar todo lo que estaba mal hecho. Por suerte para esta empresa, y para sus usuarios, hace unos a\u00f1os cambiaron su dise\u00f1o y organizaron la informaci\u00f3n tan bien que ya no la puedo usar en mis clases como ejemplo de algo mal hecho. As\u00ed que necesitaba otro conejillo de indias. Y, la verdad, es que no tuve que irme demasiado lejos.<\/p>\n

A mediados de 2017 mi universidad lanz\u00f3 su nueva web<\/a>, con un aspecto muy mejorado -al menos en lo visual- con respecto a lo que hab\u00eda anteriormente. Lo cierto es que la presencia de la Universidad de Granada en la web siempre hab\u00eda destacado, pero para mal. La evoluci\u00f3n est\u00e9tica es realmente evidente, pasando de una primera versi\u00f3n bastante sobria:<\/p>\n

\"Web<\/a>
Web de la UGR en el curso 1999-00<\/figcaption><\/figure>\n

A otra un poco m\u00e1s elaborada, con un primer intento de organizar la informaci\u00f3n de forma m\u00e1s racional, pero sin un estudio demasiado profundo de las necesidades de los usuarios. De hecho, en esa \u00e9poca la mayor\u00eda de sitios web de organizaciones educativas contaban con poco contenido, por lo que la organizaci\u00f3n de la informaci\u00f3n siempre se ve\u00eda afectada por este motivo.<\/p>\n

\"web<\/a>
Web de la UGR en el curso 2001-02<\/figcaption><\/figure>\n

En 2004 alguien de mi universidad descubri\u00f3 la opci\u00f3n de refrescar p\u00e1gina y se le ocurri\u00f3 la brillante idea de usarlo en la p\u00e1gina principal. De esa forma, se pod\u00eda \u00abdisfrutar\u00bb de una primera imagen que estaba formada por un collage de fotos de edificios de la UGR para, tras tres segundos de deleite, poder ver la p\u00e1gina principal. En ella se pod\u00eda observar el uso de un men\u00fa principal y otro secundario. Varios bloques con noticias, enlaces y logos de inter\u00e9s y un pie de p\u00e1gina un tanto peculiar.<\/p>\n

\"Web<\/a>
Web de la UGR en 2004<\/figcaption><\/figure>\n

Aunque al poco tiempo le quitaron el collage, con esta web estuvimos hasta finales de 2007. Es en ese a\u00f1o cuando aparece una nueva versi\u00f3n donde prima m\u00e1s la legibilidad. Se gana en espacio (por fin adaptan la resoluci\u00f3n a la realidad), claridad y comienzan a verse los primeros atisbos de accesibilidad. No obstante, las opciones de navegaci\u00f3n son pr\u00e1cticamente las mismas y sigue organiz\u00e1ndose la informaci\u00f3n de forma excesivamente subjetiva.<\/p>\n

\"Web<\/a>
Web de la UGR en 2007<\/figcaption><\/figure>\n

En 2008 aparecer\u00e1 la web que nos acompa\u00f1ar\u00e1 durante los siguientes 9 a\u00f1os. Un sitio bastante encajonado, excesivamente sobrio y con una ingente cantidad de defectos que tuvimos que sufrir todos sus usuarios durante demasiado tiempo.<\/p>\n

\"Web<\/a>
Web de la UGR en 2009<\/figcaption><\/figure>\n

Sirva este r\u00e1pido recorrido, que no pretende ser exhaustivo, para poner en antecedentes al lector. Si se entiende de d\u00f3nde venimos es m\u00e1s sencillo entender no solo d\u00f3nde estamos, sino tambi\u00e9n la alegr\u00eda que supuso para muchos de nosotros ver, en 2017, la nueva versi\u00f3n de nuestra web corporativa. Este tipo de webs, para los usuarios externos, son herramientas muy valiosas para obtener informaci\u00f3n, tener una primera toma de contacto con la instituci\u00f3n, saber qu\u00e9 ofrece… en definitiva, si encandila o no, como decimos por aqu\u00ed. Para los que somos de la casa es un elemento de orgullo, algo de lo que poder presumir. Es, evidentemente, una banalizaci\u00f3n, pero no es menos cierto que a todos nos gusta presumir del sitio donde trabajamos. Entre otras cosas porque de esa manera, y de forma indirecta, tambi\u00e9n presumimos de nosotros mismos.<\/p>\n

\"Aspecto<\/a>
Aspecto actual de la web de la UGR<\/figcaption><\/figure>\n

Pero m\u00e1s all\u00e1 del primer impacto visual que, reconozc\u00e1moslo, es bastante positivo, lo cierto es que un simple an\u00e1lisis de la estructura, organizaci\u00f3n del contenido, navegabilidad y usabilidad del sitio nos genera una buena cantidad de dudas. Al final, y si comparamos el an\u00e1lisis de este sitio con sus predecesores, podemos llegar a la misma conclusi\u00f3n: \u00bfD\u00f3nde est\u00e1 el arquitecto de la informaci\u00f3n?<\/p>\n

A continuaci\u00f3n realizar\u00e9 un breve an\u00e1lisis de la p\u00e1gina principal. Para realizar un an\u00e1lisis m\u00e1s exhaustivo (del sitio web entero) suelo emplear diferentes t\u00e9cnicas y m\u00e9todos, entre los que destaca de manera especial el m\u00e9todo Sirius<\/a> de Olga Carreras<\/a>, pero eso me llevar\u00eda un tiempo del que no dispongo. Creo, por otra parte, que en este caso en concreto un an\u00e1lisis solo de la p\u00e1gina principal justifica sobradamente la hip\u00f3tesis inicial de mi entrada: para tus contenidos, usa un arquitecto de la informaci\u00f3n.<\/p>\n

Lo mejor: las cuestiones t\u00e9cnicas<\/h2>\n

Cuando analizo un sitio web suelo comenzar por ver c\u00f3mo se ha hecho la instalaci\u00f3n, el software empleado, la tecnolog\u00eda usada… En muchas ocasiones la tecnolog\u00eda justifica por s\u00ed misma unos pobres resultados, dejando quiz\u00e1 en un segundo plano otros aspectos a los que no se puede llegar porque la base sobre la que se ha construido no es buena. En este caso no es as\u00ed. Este sitio web est\u00e1 construido en un Drupal en su versi\u00f3n 8.9.19, a d\u00eda de hoy, sobre un servidor web Nginx en una m\u00e1quina con Debian. Es una buena combinaci\u00f3n, que garantiza la conexi\u00f3n simult\u00e1nea de gran cantidad de usuarios sin que el sistema se vea comprometido. Se usa UTF-8 tanto en el texto, codificado en HTML 5, como en las tablas de la base de datos. El idioma declarado es el espa\u00f1ol y emplea un certificado seguro de Terena. Env\u00eda pocas cookies (4), por lo que el nivel de invasi\u00f3n en el cliente es m\u00ednimo.<\/p>\n

Entre las librer\u00edas y funciones que emplea destaca el uso de Modernizr<\/a>, lo que asegura una mayor compatibilidad entre navegadores y matchMedia(), que es el mejor mecanismo para usar @media query con el fin de ajustar los par\u00e1metros de resoluci\u00f3n de pantalla.<\/p>\n

En lo que respecto a los metadatos, la p\u00e1gina tiene declarados los espacios de nombre para Dublin Core, FOAF, Open Graph, Schema, Skos y Sioc, entre otros, sin embargo solo emplea etiquetas meta del HTML (geo.region, geo.placename, description, generator, MobileOptimized, HandheldFriendly y viewport) y todas las de Open Graph. Es una l\u00e1stima que no se emplee Json-ld con Schema para mejorar el posicionamiento.<\/p>\n

El fichero robots.txt<\/a> no incluye referencia a sitemap.xml<\/a> y ha sido creado espec\u00edficamente para este sitio, es decir, que no es el est\u00e1ndar que viene con la instalaci\u00f3n de Drupal.<\/p>\n

De todo esto se deduce que, aunque hay algunos peque\u00f1os fallos, es una instalaci\u00f3n impecable desde el punto de vista t\u00e9cnico, a falta de poder analizar la configuraci\u00f3n de los m\u00f3dulos de Drupal. Algo a lo que, como es evidente, no podremos acceder. Tan solo quedar\u00eda por analizar las velocidades de carga de la p\u00e1gina y el comportamiento del sitio en dispositivos m\u00f3viles. Ambos factores los obviar\u00e9 en este primer an\u00e1lisis.<\/p>\n

Empiezan los problemas: la organizaci\u00f3n del contenido, la navegaci\u00f3n y las etiquetas<\/h2>\n

En este sitio se ha optado por hacer dos tipos de organizaci\u00f3n del contenido. Por un lado, en el men\u00fa principal, se ha escogido una organizaci\u00f3n subjetiva basada en los perfiles de usuario, aunque lo mezcla con otros elementos extra\u00f1os. Por otro lado, en el cuerpo del sitio, se ha optado por una organizaci\u00f3n subjetiva basada en titulares. Emplear este tipo de t\u00e9cnicas duales tiene su sentido en aquellos sitios que cuentan con gran cantidad de contenido. Sin embargo, si no se gestionan de forma apropiada suele existir cierta tendencia a duplicar contenido y\/o enlaces, provocando cierta confusi\u00f3n en los usuarios noveles y malos h\u00e1bitos en los recurrentes.<\/p>\n

A continuaci\u00f3n, vamos a analizar cada uno de los componentes que forman parte de la p\u00e1gina principal.<\/p>\n

Cabecera<\/h3>\n

Est\u00e1 formada por un bloque compacto, orientado a la derecha de la p\u00e1gina, donde se pueden observar cuatro elementos, claramente diferenciados.<\/p>\n

\"Cabecera<\/a>
Cabecera de la p\u00e1gina principal de la UGR<\/figcaption><\/figure>\n

Es todo un acierto que el idioma no se identifique por medio de una bandera, sino empleando el nombre del idioma completo. Existe mucha pol\u00e9mica dentro del mundo de la usabilidad al respecto. En ese sentido, yo soy de los que me posiciono en la idea de que una bandera no representa un idioma, por lo que emplear este sistema, o el nombre ISO<\/a>, me parece muy correcto desde el punto de vista de la usabilidad. [Lo que voy a aportar ahora no est\u00e1 relacionado con el an\u00e1lisis del sitio, sino que es m\u00e1s bien una opini\u00f3n muy personal y subjetiva: creo que una universidad como esta, que presumen de internacionalizaci\u00f3n y que recibe al a\u00f1o tantos miles de estudiantes de intercambio de much\u00edsimos pa\u00edses diferentes, deber\u00eda ofrecer el contenido \u00edntegro de su sitio web en, como m\u00ednimo, 5 idiomas.]<\/p>\n

A continuaci\u00f3n encontramos las redes sociales (Facebook, Twitter y el canal de Youtube -parece que se han quedado algo rezagados en esto) representado por sus iconos correspondientes. Luego tenemos la opci\u00f3n de b\u00fasqueda y un grupo formado por los iconos que representan el correo electr\u00f3nico (aqu\u00ed hay un peque\u00f1o error de concepto ya que, en condiciones normales, cualquier usuario puede identificar dicho icono con \u00abenviar un mensaje\u00bb) que lleva a la p\u00e1gina web del webmail corporativo, el directorio de la ugr y, por \u00faltimo, un icono que se asemeja al tradicional para identificarse. Pero, y aqu\u00ed viene otra confusi\u00f3n, no te identificas como usuario dentro de la web de la UGR, ya que este proceso te lleva a otro sitio web que no tiene nada que ver con el de la UGR.<\/p>\n

En definitiva, parece que hay varios elementos que no est\u00e1n excesivamente bien dispuestos en esta cabecera. Lo peor es que alguno de las los elementos que se muestran en esta zona (especialmente enlaces) se repiten hasta la saciedad en diversos puntos de la misma web. Ahora lo veremos.<\/p>\n

El men\u00fa principal<\/h3>\n

Los men\u00fas de cualquier sitio web, ya sean principales, secundarios o locales, son herramientas valios\u00edsimas para que los usuarios puedan navegar f\u00e1cilmente dentro de cualquier web. Tienen un sin fin de ventajas que no voy a enumerar ahora pero adem\u00e1s, desde el punto de vista del an\u00e1lisis de la usabilidad, se pueden emplear como mecanismo para comprender c\u00f3mo se ha estructurado la informaci\u00f3n en esa web. En el caso que nos ocupa se observa que no existe una taxonom\u00eda clara. No hay categor\u00edas ni subcategor\u00edas evidentes, constituyendo la web entera una recopilaci\u00f3n de enlaces sin demasiado orden. Este tipo de situaciones se suelen dar en aquellas organizaciones que cuentan con muchas ramificaciones y, por lo tanto, la mayor parte de la informaci\u00f3n depende m\u00e1s de cada una de las partes que del todo. Sin embargo, siempre en necesario hacer un esfuerzo por tratar de organizarlo todo en funci\u00f3n de una serie de categor\u00edas principales que aqu\u00ed no terminan de verse se forma clara.<\/p>\n

Lo primero que llama la atenci\u00f3n del men\u00fa principal es la mezcla de conceptos que existen en \u00e9l. La base principal, se supone, son los usuarios (estudiantes, personal y visitantes). Sin embargo, encontramos tres elementos que son, como m\u00ednimo, de dif\u00edcil justificaci\u00f3n: Universidad, Empresas y contacto.<\/p>\n

\"Sub-categor\u00edas<\/a>
Subcategor\u00edas dentro de la opci\u00f3n de men\u00fa Universidad<\/figcaption><\/figure>\n

El apartado de Universidad se puede entender como el \u00absitio de recogida\u00bb. Ser\u00eda una especia de landing page entendida como un lugar de encuentro donde el usuario puede acceder a informaci\u00f3n fundamental sobre la organizaci\u00f3n. Visto de esa manera, tiene mucho sentido que existan enlaces como \u00aborganizaci\u00f3n\u00bb, \u00abhistoria\u00bb, \u00abnoticias\u00bb, \u00abservicios\u00bb, \u00abnormativa\u00bb y \u00abestudiar en la UGR\u00bb. Todos estos enlaces informan de d\u00f3nde est\u00e1s, la historia del centro, lo que ofrece a la comunidad y c\u00f3mo se rige (curiosamente est\u00e1 la normativa pero no los estatutos, que los han puesto en un sitio \u00absingular\u00bb). Sin embargo chirr\u00eda mucho la aparici\u00f3n de dos enlaces a sitios que rompen con la idea de p\u00e1gina de acogida. Ese enlace a la \u00aboficina virtual\u00bb, que es el mismo que aparece en el icono de la cabecera que se confunde con el de loguearse, y\u00a0 el de \u00absede electr\u00f3nica\u00bb, que da acceso al portal de administraci\u00f3n electr\u00f3nica de la Universidad. Para poder acceder a ambos es obligatorio formar parte de la comunidad universitaria (por medio del pago de matr\u00edcula, si se es alumno, o de un contrato si se es PDI o PAS). Por lo tanto, no afectan ni incumben en absoluto al potencial usuario que est\u00e9 interesado en esta secci\u00f3n.<\/p>\n

\"Sub-categor\u00edas<\/a>
Subcategor\u00edas asociadas a la entrada de men\u00fa \u00abEmpresas\u00bb<\/figcaption><\/figure>\n

Desde siempre me sorprendi\u00f3 mucho que apareciera el apartado \u00abEmpresas\u00bb en el men\u00fa principal de la web de mi universidad. Tanto es as\u00ed que me ha llevado a mirar si el resto de sitios web de universidades de nuestro entorno contempla una opci\u00f3n parecida. Y, tal y como pensaba, la respuesta es negativa. Tampoco contemplan una opci\u00f3n similar las webs de las 5 mejores universidades espa\u00f1olas ni las 5 de Estados Unidos. Lo \u00fanico que se le parece est\u00e1 relacionado con transferencia de investigaci\u00f3n. Algo l\u00f3gico en una universidad y que, adem\u00e1s, est\u00e1 como subcategor\u00eda dentro de esta principal. No parece que tenga mucho sentido que este tipo de entradas mercantiles tengan una presencia tan evidente en una web universitaria. No estoy diciendo que no aparezca esta informaci\u00f3n pero, tal y como est\u00e1 ubicada ahora mismo, y con las subcategor\u00edas que tiene asociadas, parece que la usabilidad y la experiencia de usuario no han sido el motivo principal para dicha ubicaci\u00f3n. \u00bfDe verdad alguien interesado en conocer la investigaci\u00f3n de esta universidad buscar\u00e1 en enlace dentro de \u00abEmpresas\u00bb? Si la transferencia es un eje fundamental en la Universidad, \u00bfno deber\u00eda ser \u00abInvestigaci\u00f3n\u00bb la que lleve a \u00abEmpresas\u00bb?<\/p>\n

\"Sub-categor\u00edas<\/a>
Subcategor\u00edas dentro del men\u00fa \u00abcontacto\u00bb<\/figcaption><\/figure>\n

Como colof\u00f3n al apartado de \u00abentradas desubicadas\u00bb nos encontramos con la opci\u00f3n de \u00abcontacto\u00bb en el men\u00fa principal. Es cierto que no existe una norma al respecto, pero la convenci\u00f3n hace que en la mayor\u00eda de ocasiones este tipo de informaci\u00f3n se coloque en el pie de la p\u00e1gina. No suele ser muy habitual encontrar esa informaci\u00f3n en un sitio tan destacado. Por si fuera poco, uno de los enlaces, \u00abbuscar personas\/entidades\u00bb, lleva exactamente al mismo sitio que el icono con forma de agenda que se coment\u00f3 al hablar de las secciones de la cabecera, el directorio de la UGR.<\/p>\n

Vamos a analizar ahora las otras secciones de este men\u00fa.<\/p>\n

Cuando se organiza un men\u00fa teniendo en cuenta los usuarios es fundamental que estos tengan caracter\u00edsticas propias, que los hagan completamente diferentes del resto y, por lo tanto, tengan enlaces propios que no compartan. Esto no sucede del todo aqu\u00ed y es en las tres secciones siguientes donde es m\u00e1s evidente la mezcla de categor\u00edas y la repetici\u00f3n de enlaces.<\/p>\n

\"Sub-categor\u00edas<\/a>
Subcategor\u00edas asociadas a la opci\u00f3n \u00abestudiantes\u00bb del men\u00fa principal<\/figcaption><\/figure>\n

En el apartado dedicado a los estudiantes hay opciones que son propias de ellos y que tienen mucho sentido. Todos los que est\u00e1n relacionados con la vida universitaria (alojamiento, movilidad e intercambio, becas y ayudas) y con los estudios que se pueden cursar (grados, m\u00e1ster y doctorados, \u00bfqu\u00e9 estudiar?, acceso a la universidad, pr\u00e1cticas). Y luego aparece el cl\u00e1sico \u00abm\u00e9telo ah\u00ed mismo\u00bb (plataforma docente, accesibilidad y correo estudiantes). Aqu\u00ed se observan varios problemas, a saber:<\/p>\n