En este post vamos a hablar de Web Performance Optimization (WPO), todo un conjunto de técnicas que nos permiten optimizar el funcionamiento de los sitios web, mejorando la experiencia de nuestros usuarios y también el posicionamiento SEO de nuestra página.
¿Qué es WPO?
WPO son las siglas de Web Performance Optimization, una disciplina relacionada con el desarrollo de sitios, que toma como objetivo la mejora del rendimiento de las páginas web.
La optimización ha sido siempre una necesidad en el mundo de la web, porque impacta sensiblemente en la experiencia de los usuarios que nos visitan. Sin embargo, a lo largo de los últimos años WPO ha tomado una mayor relevancia todavía debido a que es uno de los factores que Google toma para deducir qué páginas posiciona más arriba en el buscador.
¿Qué factores hacen que mejore el WPO de tu web?
La optimización objetivo de las técnicas de WPO está orientada básicamente a ofrecer el máximo rendimiento de los servidores y los sitios web, mejorando la velocidad de descarga de los usuarios que los consultan. Algunos de los factores más importantes para conseguir una buena optimización son los siguientes:
Elegir un buen hosting web
El hosting es de vital importancia para la optimización, dado que afecta directamente a la velocidad de respuesta de las solicitudes. Puedes invertir mucho tiempo o dinero en otros factores pero, si descuidas la calidad del hosting, harás que todo ese esfuerzo sirva de poco.
Por supuesto, en los hosting de Piensa Solutions somos muy conscientes de ello y nos preocupamos siempre por ofrecer a nuestros clientes las mejores configuraciones en los servidores web, monitorizando continuamente las máquinas para asegurar una calidad siempre elevada.
Comprimir la web utilizando la compresión Gzip
Los servidores son capaces de enviar a los clientes el contenido de la mayoría de los archivos comprimido, lo que hace que el tamaño de las transferencias sea sensiblemente menor y aumente la velocidad de las páginas. Esto es algo que debe configurarse a nivel de servidor, por lo que no necesitas preocuparte si tienes el hosting con nosotros.
Optimizar los recursos de la web (imágenes, vídeos…)
Las imágenes o los vídeos son los tipos de archivos que más pesan a la hora de descargar un sitio web. Por lo tanto, realizar una buena optimización de éstos es fundamental.
Podemos optimizar los archivos por medio del ajuste de la calidad de las imágenes o la paleta de colores, así como el bitrate o los frames por segundo en el caso de los videos. Para ello, puedes usar tus propios programas de diseño o edición de vídeo. También existen numerosos servicios online para la optimización de los archivos multimedia.
Utilizar temas más ligeros
Si usamos un CMS como WordPress es importante que nuestro tema de diseño tenga una buena optimización. Esta depende directamente de las prácticas que hayan seguido los creadores del tema, por lo que cabría analizar el peso de la página, la cantidad de archivos externos que necesita para funcionar, etc.
Optimizar el código frontend
La minimización del código frontend es una buena práctica para alcanzar una mejor WPO. Nos referimos a las técnicas que hacen que el código fuente de archivos JavaScript y CSS, lo que se conoce habitualmente como minimización. Tener el código minimizado hará que los archivos CSS y JavaScript ocupen sensiblemente menos espacio y se descarguen más rápidamente.
Usar un CDN
A menudo algunos tipos de archivos se pueden distribuir mediante un CDN (Content Delivery Network). Por ejemplo, cuando usamos código de una librería JavaScript se puede descargar de un CDN. Pero además, proyectos más avanzados pueden usar algún servicio de CDN para otros archivos como las imágenes, que son los que más impacto tienen en la velocidad de descarga.
Activar la memoria caché web (Web Caching)
El cacheado de los archivos en el navegador también ayuda a mejorar la velocidad de descarga, no tanto de la primera página consultada, sino sobre todo de las páginas siguientes que el usuario acceda en el sitio web, ya que algunos contenidos se habrán cacheado y se mostrarán sus copias locales. El cacheo de archivos también debe activarse con las correspondientes cabeceras del servidor web, por lo que es importante que tengas esta configuración o confíes en el hosting de Piensa Solutions.
Bloquear el Hotlinking
El hotlinking es una práctica que hacen algunas páginas web, que muestran contenidos de otros dominios. Por ejemplo, si tenemos una guía de turismo de Madrid es posible que tengamos en el servidor muchas fotos de la ciudad. Otros usuarios podrían estar usando esas mismas imágenes para mostrar fotos de Madrid en sus sitios web, usando la ruta absoluta a nuestras fotos en nuestro propio dominio.
Obviamente, si esto se lleva a un extremo y muchas personas enlazan archivos de nuestro sitio web directamente, estarán aumentando la carga del servidor de manera artificial, haciendo que los usuarios reales que nosotros tenemos tengan mayores dificultades para acceder al contenido. Por eso es una buena práctica bloquear el hotlinking.
Optimizar la base de datos y el CMS
En el backend también existen muchas posibilidades de optimización. Una de las más sencillas es la mejora de la optimización de la base de datos, por ejemplo creando los índices correctos. Si estamos publicando el proyecto con un CMS podemos dedicar un tiempo a optimizar el servidor para este CMS, como hacemos en nuestros hosting para WordPress.
Reducir el volumen de las redirecciones 301
Cuando se consulta una página en ocasiones ésta redirige a otra. Estas redirecciones se realizan mediante unas cabeceras de respuesta que se envían a los navegadores y que hacen que éstos realicen la conexión con nuevas URL.
Por supuesto, las redirecciones muchas veces son necesarias para que un sitio funcione correctamente y enviar a los usuarios a las rutas correctas de los recursos que han solicitado, pero el uso innecesario de redirecciones penaliza la velocidad de los sitios web, porque requiere más idas y venidas de comunicaciones entre el navegador y el servidor.
Herramientas para medir y analizar el WPO
Ahora queremos proponerte algunas herramientas que podrías usar para medir el grado de optimización de tu sitio web, a la vez de encontrar medidas que podrían aumentar el WPO.
Measure de Web.dev
En este servicio web de Google podemos encontrar reglas de optimización y mejoras que Google detecta que serían adecuadas para realizar en nuestro sitio web. https://web.dev/measure/
PageSpeed Insights de Google
Es el nuevo nombre que han usado en los servicios de Google para reunir todas las herramientas de optimización. https://pagespeed.web.dev/
GTMetrix
Es una herramienta independiente para la medida de la optimización de una web. Una de las más famosas y utilizadas. https://gtmetrix.com/
Google Lighthouse
Otra de las herramientas de Google es Lighthouse, que se integra directamente en las herramientas para desarrolladores del navegador Google Chrome. Para abrir esta herramienta encontrarás una solapa llamada Lighthouse donde puedes verificar distintos criterios y valores de optimización.
Pingdom tools
Esta herramienta permite el análisis de un sitio web y el reconocimiento de los posibles cuellos de botella que tenga en términos de optimización. https://tools.pingdom.com/
¿Cómo mejorar el WPO en WordPress?
Si tenemos un sitio web en WordPress podemos conseguir un mejor WPO con todos los consejos indicados anteriormente. Adicionalmente, es recomendable usar algunos plugins que nos permiten mejorar la optimización del sitio, siendo unos de los más importantes los plugins de configuración de una caché. En este sentido uno de los plugins más recomendables es WP OPcache.
¿Cómo mejorar el WPO en PrestaShop?
El WPO en los sitios de comercio electrónico es también muy importante debido a que la lentitud de un sitio web hace descender sensiblemente la conversión en las ventas. Si estás usando un CMS como PrestaShop es importante que tengas un buen hosting, con versiones modernas del lenguaje PHP y además tu servidor lo tengas correctamente configurado. Puedes para ello usar nuestros hosting, ya que te ofrecen la calidad necesaria para tener una tienda rápida y solicitar ayuda a nuestro departamento de soporte para conseguir mejoras en la optimización.
Paralelamente debes usar todos los consejos y herramientas explicadas anteriormente, prestando especial atención a factores como la optimización de las imágenes de tus productos. Existen diversos plugins recomendables para asegurarnos que las imágenes se encuentran optimizadas que usan por debajo una herramienta llamada ReSmushm, que te pueden interesar. Además es importante tener en cuenta, y usar, el sistema de cacheo nativo incorporado en PrestaShop.
¿Por qué es importante tener un buen WPO para el SEO de la web?
Por último queremos mencionar la importancia de tener un buen WPO para conseguir un mejor SEO, el posicionamiento orgánico de la web. Google, en su afán de mejorar la experiencia de sus usuarios, ha tomado desde hace tiempo como referencia la optimización y rapidez de los sitios web como un factor destacado en sus algoritmos de posicionamiento. Es por ello que los sitios que se preocupan por el WPO tienen un mejor posicionamiento que los sitios lentos que no tienen en cuenta los factores de optimización.
Por tanto, dedicar un tiempo a la mejora de WPO en tu sitio web impactará no solo en la experiencia de usuario de tus visitantes, sino también en cómo Google considera a tu sitio web para mostrarlo más arriba en sus resultados de búsqueda.