Página web y posicionamiento web: así afecta el diseño a las técnicas SEO
Las palabras clave, los enlaces externos o las famosas DA y PA del dominio web se citan frecuentemente como los únicos ingredientes del posicionamiento orgánico en buscadores o SEO. Por relevantes que sean estos elementos, tienden a opacar otros de igual trascendencia en la ‘receta’ de un marketing exitoso, como el diseño de la página web.
Página web y posicionamiento SEO, ¿realmente existe una relación? La respuesta es un sí mayúsculo. Un diseño eficaz incrementa las posibilidades de obtener una buena clasificación en motores de búsqueda como Google, Bing, DuckDuckGo o Yahoo!, mientras que un diseño deficiente consigue el efecto opuesto: perjudica el ranking del sitio web y de cualquier contenido o archivo dependiente del mismo.
Una máxima extendida entre los diseñadores web es la siguiente: designing for humans, not robots. Con ella, se preconizan las estrategias y planteamientos de diseño adaptados a los visitantes de carne y hueso, frente a aquellos que únicamente persiguen atraer y seducir a los diversos bots (googlebot, bingbot, etcétera) que evalúan y clasifican el contenido existente en Internet. La eficacia de este enfoque reside en la creciente ‘humanización’ de los algoritmos de búsqueda, capaces de procesar y analizar la información de forma similar al ser humano, como ha demostrado Bert.
La relación del posicionamiento SEO con la arquitectura web se aprecia y resulta crítica en tres aspectos fundamentales: la velocidad de carga, la responsividad de la web y la usabilidad o UX que los usuarios disfrutan durante la navegación. ¡Veámoslas por separado!
Velocidad de carga: un segundo puede marcar la diferencia
La velocidad de carga y su correlación con las clasificaciones de búsqueda es la prueba más evidente de la relación existente entre diseño web y posicionamiento SEO. ¿Sabías que cada segundo de carga acrecienta el porcentaje de usuarios que abandonan el sitio web? Las webs que demoran de 1 a 3 segundos en cargar aumentan el riesgo de sufrir tasas de rebote en un 32%, según un estudio de Google en colaboración con SOASTA publicado en 2017.
El gigante de las búsquedas de Internet es uno de los buscadores más preocupados por el efecto negativo de la lentitud de carga en la experiencia de navegación. Citando un artículo del Centro de la Búsqueda de Google, «estamos obsesionados con la velocidad. Ya hace tiempo que sabemos que los aumentos en la velocidad, por insignificantes que parezcan, pueden tener un impacto sorprendentemente importante en la satisfacción e implicación de los usuarios».
Por tanto, acelerar los tiempos de carga en versiones móvil y desktop es una decisión inteligente. Un primer paso para conseguirlo consiste en comprimir y optimizar los archivos más pesados para la carga: las imágenes. Este proceso puede realizarse con ayuda de herramientas externas (JPEG Optimizer, Optimizilla, ImageRecycle, CompressNow, Tiny PNG) o con plugins y addons internos (WP Smush o EWWW Image Optimizer para WordPress, OptiPic para Joomla, etcétera). De este modo, la mayoría de imágenes JPG, PNG, SVG o GIF puede reducir su peso hasta un 400%, y ese ‘adelgazamiento’ redunda positivamente en la velocidad de carga.
La calidad del servicio de alojamiento web también agiliza o lastra los tiempos de carga. Generalmente, los hosting más económicos presentan velocidades de transferencia paupérrimas en comparación con servicios de gama media y alta. Por otra parte, habilitar el almacenamiento en caché contribuye a que los visitantes asiduos vean agilizada la visualización del contenido de la web. Su funcionamiento es simple: el ordenador del usuario guarda una ‘copia’ con los datos temporales del sitio web en cuestión, de forma que cada vez que accede a ella, utiliza esa copia almacenada para cargar la página con mayor inmediatez. Diferentes plugins para WordPress posibilitan el almacenamiento en caché, como WP Rocket, WP Super Cache, WP Fastest Cache, Zen Cache o Cachify.
El exceso de redirecciones es un problema común en sitios web (el 8,5% de las webs lo sufren, según un estudio de Semrush) que lastra los tiempos de carga y perjudica el SEO de gravedad. En muchos casos, la raíz de este problema es una redirección desde el servidor entre viejas direcciones HTTP hacia nuevas HTTPs, más seguras y aceptadas por los navegadores web.
Otra forma de acelerar la visualización de una página web es minificar el código CSS, JavaScript y HTML, es decir, suprimir los espacios y abreviar los nombres y las variables, hasta reducirlas a su mínima expresión. Minify, Grunt, Javascript-minifier.com o Javascript-minifier.com son herramientas útiles para agilizar esta tarea, molesta por ser repetitiva. Igualmente, debe configurarse estos archivos para cargarse de manera asíncrona y retrasar la aparición de los elementos menos necesarios.
Por último, el uso de redes de distribución de contenidos o CDN, por sus siglas en inglés, es un paso más hacia unos rápidos tiempos de carga. En esencia, una CDN consiste en un conjunto de servidores web distribuidos por distintos puntos de la Tierra y cuyo uso mejora los tiempos de respuesta del servidor. Por ejemplo, si un internauta se conecta desde Quebec, la página web con CDN realizará la transferencia de datos desde un servidor en Canadá.
Para evaluar la eficacia de estos cambios, se recomienda medir previamente la velocidad de carga y comparar este primer registro con los sucesivos cambios efectuados. Google Insights PageSpeed, Pingdom o GTMetrix son excelentes herramientas de medición de velocidad de carga. Por otra parte, estos consejos para agilizar los tiempos de carga te serán de gran utilidad.
Responsividad web: diseñando para los ‘mobile users’
La adaptabilidad de la página web es otro punto clave de la relación del posicionamiento SEO con el diseño web. Cabría pensar que si la web es la misma, visitarla desde un móvil, tablet u ordenador de sobremesa no debería presentar grandes diferencias, ¿verdad? La respuesta es sí. Las limitaciones de la pantalla, la reducida RAM de smartphones y otros condicionantes complican la navegación en estos dispositivos, mientras que los portátiles y los ordenadores de sobremesa no experimenta estas dificultades.
Según datos de BankMyCell, existen 6.648 millones de teléfonos móviles en el mundo, y más de la mitad de los usuarios se conectan a internet desde estos dispositivos. Por consiguiente, disponer de un diseño web responsivo es indispensable para satisfacer esta creciente demanda con una experiencia adaptada a sus necesidades.
El diseño responsivo, o adaptativo, es conocido a su vez con las siglas RWD (responsive web design) y fue propuesto en 2010 por el diseñador gráfico Ethan Marcotte. Consiste en reajustar los elementos del sitio web —los títulos, las imágenes, el sidebar, etcétera— por medio de módulos media queries que añadan condiciones de visualización al archivo CSS. Por ejemplo, reducir las fuentes a 12 puntos en pantallas de 360 por 720 píxeles, aumentar a 14 puntos en pantallas de 411 por 731, etcétera. Renunciar al diseño no responsivo es uno de esos errores de páginas web que deben evitarse.
Considerando la superioridad del tráfico móvil, ¿cómo afecta el diseño web al SEO? Tres palabras: Mobile-First Indexing. Google anunció en 2016 que tomaría en cuenta la calidad de la navegación y experiencia del mobile user frente al desktop user. En otras palabras, el buscador propiedad de Alphabet estudia la calidad de la navegación en dispositivos por separado, en lugar de evaluarlas de manera conjunta y de presuponer, equivocadamente en muchos casos, que la rapidez de la versión de escritorio de una web será la misma en su versión para móviles.
Además de la herramienta Mobile-Friendly Test, Google desarrolló en 2015 la tecnología AMP (accelerated mobile pages), una solución fácil de implementar que permite a los webmasters agilizar los tiempos de carga y la adaptabilidad web para los internautas que se conectan desde móviles y tablets. En esencia, las páginas AMP ven restringidas las etiquetas HTML a una selección predeterminada, y lo mismo sucede con los recursos JavaScript. Además, se utilizan cachés de CDNs exclusivas del proyecto AMP.
UX: simplificando la complejidad del diseño web
La experiencia del usuario, o UX (user experience), es un valor que la mayoría de sitios de comercio electrónico y empresas en internet acierten en perfeccionar. Y es que si la experiencia fuera deficiente, métricas como la tasa de botes, las conversiones o el tiempo de permanencia empeorarían sensiblemente, lo que conduciría a una pérdida de posicionamiento SEO, habida cuenta de la importancia que Google concede a la satisfacción de los internautas.
Esta es una nueva prueba de la estrechísima relación entre el diseño de una página web y el posicionamiento en buscadores. «Más allá de la configuración básica», aseveran desde el buscador de Mountain View, «una experiencia de usuario de móvil excelente depende de tres factores: diseño, contenido y velocidad. La mejor forma de atraer y mantener a los usuarios es asegurarte de que estos tres pilares son sólidos».
Además de estos consejos —algunos de los cuales, como la velocidad de carga, han sido tratados en anteriores párrafos—, se recomienda suprimir aquellos elementos y códigos que puedan estar saboteando la experiencia del usuario, sin que el webmaster lo aprecie. Es el caso de los archivos flash, de determinados códigos JavaScripts y de los famosos pop ups, un tipo de publicidad o notificación que deteriora gravemente la navegabilidad, en especial en dispositivos móviles.
Tabla de contenidos