SEO y usabilidad en móviles

MAR K ETI N G Y G E STIÓN

SEO y usabilidad en móviles Juan Luis Mora • Consultor SEO/SEM

P

ara entender la influencia de la usabilidad móvil en los resultados de Google, lo mejor es remontarse a sus comienzos. ¿Recuerdan cuando Google tenía un botón llamado «voy a tener suerte» que llevaba directamente al primer resultado? En el fondo esa sigue siendo su filosofía, o al menos lo intenta aparentar, puesto que para ellos lo importante es que cuando un usuario busque en Google los resultados vayan de mayor a menor relevancia, de tal forma que su interés es que el primero sea el que más se adapte a la consulta del usuario. A lo anterior se le conoce como «relevancia». Con base en la relevancia, Google ha considerado que cuando alguien busca con un móvil va a preferir entrar en una web optimizada para móviles y, por tanto, en su algoritmo de ranking desde dispositivos móviles va a tomar peso el factor de optimización móvil. A pesar de ello, «tomar peso» no quiere decir que vaya a pasar a ser el factor más relevante en el posicionamiento para móviles. Por esto, desde el día 21 de abril está activa y funcionando la actualización mobile-friendly de Google. http://googlewebmastercentral.blogspot.com.es/2 015/04/rolling-out-mobile-friendly-update.html

OPTIMIZAR PARA MÓVILES Lo primero que hay que hacer es testear el estado de la web a optimizar y para hacerlo Google pone a disposición de todo el mundo esta herramienta:

XXVI

errores enumerados cuando la página contenga errores. En la propia página del test está disponible toda la documentación necesaria para ir solucionando los errores o para realizar un diseño sin errores desde el principio. Además, si la web tiene errores estos vendrán enlazados directamente en la página de informe de fallos.

ERRORES EN USABILIDAD MÓVIL Elementos táctiles muy próximos o muy pequeños Cuando un usuario móvil tiene que pulsar un botón demasiado pequeño se encuentra con serios problemas y puede llegar a frustrarse. Y si se ponen dos elementos táctiles muy próximos entre sí es posible que sea difícil pulsar en el correcto. Por ello, ningún elemento táctil debe ser de menos de 48x48 píxeles. En caso de ser una imagen y si es un enlace de texto sería muy recomendable que también fuera de fácil pulsación, haciendo un ancho suficientemente largo, utilizando un tamaño de fuente suficiente o dejándolo bien separado del resto del texto.

Contenido más ancho que la ventana gráfica

https://www.google.com/webmasters/tools/mobile-friendly/

No hay que usar contenidos que puedan ser más anchos que la ventana gráfica porque de hacerlo se obliga al usuario a hacer scroll lateral, algo que gusta muy poco porque no estamos acostumbrados a ello.

Después de usarla se puede observar que aparece un mensaje con texto resaltado en verde cuando todo esté bien o por el contrario un mensaje con texto resaltado en rojo y

Por tanto, hay que hacer contenidos que se ajusten a la ventana no usando elementos CSS de ancho fijo. En su lugar es mucho mejor usar anchos relativos basados en el

ESINE CENTRO DE ESTUDIOS TÉCNICOS EMPRESARIALES

MAR K ETI N G Y G E STIÓN

tamaño de la pantalla teniendo cuidado con los valores de posicionamiento absolutos de gran tamaño porque pueden hacer que parte del elemento quede fuera de la pantalla visible. En definitiva, hay que conseguir que los elementos de contenido sean los que se adapten a la pantalla para ofrecer una buena experiencia en cualquier tipo de dispositivo.

predeterminada del navegador, que es de 1,2 em. • Limita la cantidad de fuentes y la escala tipográfica. Si usas muchas fuentes y tamaños de fuente, el diseño de la página puede parecer descuidado y excesivamente complejo. • Uso de Flash.

Ventana gráfica no configurada Es un aspecto muy importante y sin él nunca se podría tener bien el punto uno sobre elementos táctiles. Una página optimizada para dispositivos móviles debería incluir en su cabecera lo siguiente: Esto significa que el ancho de la ventana será igual al ancho del dispositivo y que la escala inicial es 1. De esta forma, los dispositivos móviles serán capaces de mostrar el contenido según el tamaño de su pantalla. Si no se coloca esta instrucción en la cabecera, las páginas se mostrarán igual en un dispositivo móvil que en un PC, lo que provocará que el usuario no pueda ver bien el contenido y tenga que hacer zoom.

Tamaño de las fuentes muy pequeño Se debe usar un tamaño de fuente suficiente para que el usuario móvil lo pueda leer sin hacer zoom. Para unas recomendaciones más concretas, esto es lo que dice Google: • Utiliza un tamaño de fuente base de 16 píxeles CSS. Ajusta el tamaño según sea necesario basándose en las propiedades de la fuente usada. • Usa tamaños en relación con el tamaño base para definir la escala tipográfica. • El texto necesita espacio vertical entre los caracteres y puede ser necesario ajustarlo para cada fuente. La recomendación general es utilizar la altura de línea

Parece mentira pero todavía queda «mucho Internet» proveniente de aquellos años en los que se usaba Flash. Si la web es así, o usa elementos Flash, hay que ir cambiándolo porque no lo quieren ni los buscadores ni los dispositivos móviles.

CONCLUSIONES Y RECOMENDACIONES Es una suerte que Google haya modificado sus algoritmos para favorecer a los sitios optimizados para móvil porque de lo contrario gran parte de Internet jamás se plantearía hacer versiones móviles. No obstante, el test que proporciona Google mide algunos parámetros fundamentales en usabilidad móvil que no son suficientes. Por ello, una vez implementadas las versiones móviles debe de ser el usuario en primera persona quien navegue y utilice todas las características de la web; y, en segundo lugar, se recomienda reforzar los test de usabilidad móvil con datos estadísticos provenientes, por ejemplo, de Analytics. Nunca se debe hacer una versión móvil «chapucera» simplemente por tenerla, pues aunque esa versión probablemente supere los test de usabilidad, dejará mucho que desear al visitante y se va a notar en términos de conversión. También hay que tener cuidado con el responsive. En muchos medios se habla del diseño responsive como la panacea de usabilidad móvil y de escritorio cuando realmente puede hacer que cualquier web se vuelva menos usable de lo que era anteriormente si no se hace un diseño responsive cuidado y personalizado. ❚

ESINE CENTRO DE ESTUDIOS TÉCNICOS EMPRESARIALES

XXVII