A la hora de plantear el diseño web de un proyecto, existen diversos factores que afectan tanto al rendimiento como al posicionamiento SEO de un sitio web en los distintos motores de búsqueda. Sin embargo, hay uno que está tomando un especial protagonismo entre todos ellos: El WPO.
Tomando como referencia a Google, el buscador más usado por los usuarios, afirma que hoy por hoy la experiencia de usuario es uno de los elementos básicos de su filosofía. Tanto es así, que un sitio web no optimizado correctamente debe asumir que no logrará obtener grandes cuotas de tráfico dentro de su mercado.
Entonces, ¿qué significa WPO?
El WPO (Web Performance Optimization u Optimizaciones del Rendimiento de una Web) es la optimización de carga de un sitio web. En otras palabras, es aplicar una serie de mejoras a nuestro sitio web para mostrar de una manera rápida la totalidad de su contenido. Para optimizar los tiempos de carga, no debemos centrarnos únicamente en la Home (comúnmente llamada página de inicio), sino en la optimización de todas las páginas que forman nuestro sitio web.
Existen 3 motivos principales que debemos tener en cuenta para aplicar las técnicas WPO en nuestro sitio web:
- Mejorar la experiencia de usuario y por tanto, la conversión de los CTAs (Call to Action o Llamada a la acción) que tenga nuestro sitio web.
- Mejorar la indexación y el crawleo por parte de los bots de los principales buscadores, como por ejemplo el de Google.
- Mejorar la eficiencia del sitio web, reduciendo el consumo de recursos en servidor y logrando estabilidad en los picos de tráfico.
En Wanaleads, como agencia de diseño web Sevilla, la mayor parte de nuestros proyectos están implementados con WordPress y por ello, en este artículo tomaremos este CMS (Content System Management o Sistema de Gestión de Contenidos) como referencia; aunque algunos aspectos podrán extrapolarse a cualquier tipo de proyecto.
8 Factores que influyen en el WPO
1. El hardware donde se encuentra alojado nuestro sitio web (hosting)
Hay multitud de proveedores de servicios web para esta finalidad y por tanto, es normal que no sepamos a cual acudir si estamos buscando lo mejor. No te aconsejamos que te dejes llevar por la publicidad o la visibilidad de dichos proveedores en Internet.
Lo que realmente debes hacer antes de decidirte por uno u otro, es fijarte en los aspectos técnicos de los servidores que dicho proveedor ofrece; como por ejemplo:
- El almacenamiento: En la mayoría de ocasiones, cuando contratamos un alojamiento web (hosting), éste es compartido. Es decir, en un mismo disco se almacenan los servicios de distintos clientes. Esto implica que el espacio sea reducido e implica que el tiempo de carga de una web sea rápido.
- Discos HDD o SSD: Lo ideal es elegir un proveedor cuyos alojamientos dispongan de discos SSD (Solid-State Drive o Unidad de Disco Sólido), ya que la rapidez de lectura y escritura de estos son muy superior a los tradicionales discos HDD (Hard Drive Disc o Disco Duro). Obviamente, el coste de este alojamiento será superior, pero la verdad es que merece la pena, llegando a disminuir en 2 segundos el tiempo de carga de un sitio web.
- Memoria RAM: La memoria RAM es otro aspecto a tener en cuenta. Una RAM con alta capacidad, ayudará a que los procesos de carga sean mucho más rápidos y eficaces.
- Tráfico de datos: La inmensa mayoría de los servidores disponen de tráfico ilimitado. Si nuestro sitio web posee un tráfico superior a la cuota contratada, la rapidez de carga quedará limitada a ella. Por tanto, es otro aspecto importante a tener en cuenta, sobre todo si nuestro sitio web tiene una tasa de tráfico elevada.
- Certificado SSL: Para poder usar el sistema HTTP/2 (Hyper-Text Transfer Protocol v2 o Protocolo de Transferencia de Hipertexto, versión 2) usado en los nuevos navegadores para agilizar la carga, necesitas tener instalado un certificado SSL (Secure Sockets Layer o Capa de Puertos Seguros).
Contratar un alojamiento web con estas características puede tener un coste más elevado que otro que no las tenga, pero los resultados merecerán la pena.
2. El software donde se encuentra alojado nuestro sitio web (hosting)
Para mejorar el rendimiento de nuestro sitio web y garantizar la seguridad de nuestro proyecto, es necesario que nuestro alojamiento web cuente con versiones actualizadas de las aplicaciones con las que vayamos a trabajar.
- Aplicaciones: Disponer de las últimas versiones estables de PHP (Hypertext Preprocessor o Preprocesador de Hipertexto) y SQL (Structured Query Language o Lenguaje de Consulta Estructurada) en el caso de proyectos con los CMS (Content System Management o Sistema de Gestión de Contenidos) más populares como por ejemplo WordPress, Joomla, Drupal, Prestashop, etc; es fundamental.
- Compresión GZIP: Como ya sabréis, cuando comprimimos cualquier documento, reducimos el tamaño de este. En el caso de las páginas web, sucede exactamente lo mismo. Pueden comprimirse y por tanto, se reducirá su peso y con ello aumentará la velocidad de carga de la misma. Para ello, disponemos de la compresión GZIP, un formato destinado a la compresión de documentos. No obstante, hay que tener en cuenta que esta compresión no sirve para almacenarlos, tan sólo los comprime.
- Sistema de caché: Un buen alojamiento web, debe disponer de un sistema de caché propio para servir la información al usuario de una manera rápida.
3. La selección del tema y el maquetador visual
El empleo de temas y un maquetador visual bien desarrollados, es un factor clave que determinará la velocidad de carga de nuestro sitio web.
Es importante que nuestro sitio web tenga un bonito diseño, imágenes potentes, efectos, colores y en definitiva, una creación visual muy atractiva; pero tienes que tener en cuenta que esos recursos deben estar correctamente optimizados para que los tiempos de carga de la página no se disparen. Pues el buen o el mal desarrollo de los archivos CSS y JavaScript que los conforman, pueden influir a la hora de cargar el sitio web.
4. La optimización de imágenes
Este aspecto es fundamental en los tiempos de carga de nuestro sitio web, por no decir, el más importante. Si se trata de un sitio web con desarrollo desde cero te recomendamos lo siguiente:
- Ajusta el tamaño de las imágenes a lo que el usuario verá por pantalla. De esta manera, evitarás cargar imágenes más grandes de las que el usuario necesita ver.
- Emplea servicios externos para optimizar imágenes, como pueden ser TinyJPG o TinyPNG, Abraia.me o Kraken.io.
Sin embargo, si tu sitio web ya se encuentra en desarrollo, puedes emplear extensiones para esta finalidad; como por ejemplo:
De esta manera, puedes mejorar el rendimiento y la velocidad de carga de tu sitio web entre un 60 y un 80%.
5. El sistema de caché
La memoria caché es aquella que almacena los datos para luego volver a utilizarlos. Activar la caché es una técnica que ayuda a agilizar la carga de una página web. Funciona de la siguiente manera:
- Un usuario entra en una de las páginas del sitio web.
- Dicha página descargada se guarda en su equipo.
- Cuando vuelve a entrar, no tiene que volver a cargar dicha página, ya que la página o gran parte de sus elementos ya están almacenados en su equipo.
Este proceso implica que el tiempo de carga se optimice de una manera muy eficaz, ya que tarda mucho menos abriendo una página ya descargada, que una inexistente. Para ello, en Wanaleads os recomendamos la implementación de un plugin llamado WP-Rocket para WordPress; que además de contar con un buen sistema de caché, dispone de funcionalidades muy interesantes como es el minificado o la compresión de archivos HTML y CSS, asi como la carga asíncrona de JavaScript.
6. Alojar el contenido multimedia en servicios externos
Por norma general, los vídeos, audios y otros documentos multimedia suelen ocupar bastante espacio. Una medida eficaz en la optimización suele ser alojarlos en servicios externos. Por ejemplo, es más recomendable publicar un vídeo en YouTube y mostrarlo en nuestro sitio web desde un enlace o insertándolo con un iframe, que alojar dicho vídeo en nuestro propio servidor.
La mayoría de estos servicios están perfectamente preparados para publicar el contenido que necesitemos y facilitar su integración en el código de nuestro sitio web.
7. Usar un CDN
La publicación de contenidos en un CDN (Content Delivery Network o Red de Distribución de Contenidos) es una de las mejores formas de reducir los tiempos de carga. Un CDN nos permite disponer de dichos recursos desde otros servidores alojados en diferentes localizaciones internacionales.
Además, «sirve» los contenidos de nuestro sitio web desde distintos servidores en todo el mundo más próximos al lugar en donde se realizan las peticiones, y por ello implica que los tiempos de carga se reducirán.
En sitios web con un volumen de tráfico elevado, supone una gran ventaja para evitar que el servidor se sature con peticiones. Existen varias opciones de CDN tanto de pago como gratuitas. is recomendaciones son Amazon Cloudfront y Cloudflare, éste último es el más usado (quizás por ser gratuito) y es el más sencillo de configurar para acelerar tu blog.
8. Precaución con los plugins, addons y otras extensiones
Si usas un CMS como WordPress, Drupal, Joomla, Prestashop u otros, debes tener cuidado con la cantidad de plugins y módulos instalados si quieres mimar el WPO.
Puede que resulten muy prácticos, pero tener un número excesivo de extensiones puede aumentar considerablemente los tiempos de carga de tu sitio web. De hecho, existen plugins que por sí solos incrementan notablemente los tiempos de carga, y es por ello que debemos valorar su beneficio o perjuicio para nuestro proyecto.
Plugins (o extensiones) para WPO en WordPress
La mayoría de los proyectos que desarrollamos en Wanaleads, los implementamos con WordPress; y por ello, os vamos a mostrar cuáles son los plugins que más usamos para mejorar el WPO:
- WP-Rocket: Implementa un sistema de caché muy efectivo, así como otras funcionalidades muy interesantes como el minificado de archivos, la precarga, la integración con una CDN o el control de la API Heartbeat de WordPress.
- Imagify: Extensión de los creadores de WP-Rocket para la optimización de imágenes con muy buenos resultados para los casos en los que el desarrollo del proyecto ya se encuentra en producción.
- WP Optimize: Su principal función es limpiar la base de datos de registros y tablas innecesarias que puedan afectar a los tiempos de carga de nuestro sitio web.
- Autoptimize: Podrás minificar, combinar y optimizar los archivos HTML, CSS y JavaScript de tu sitio web para mejorar la velocidad de carga. Eso sí, debes tener en cuenta que en la mayoría de los casos, estas acciones implican que la página no se visualicen correctamente. Hay que tener mucho cuidado con los parámetros activos e ir probando.
- WPS Hide Login: Enmascara la URL de acceso a nuestro backend y evita que el servidor se sature con peticiones al mismo, fruto de ataques informáticos.
- Wordfence Security: Ofrece funciones de seguridad en WordPress para proteger tu sitio web.
Auditoría WPO
Una vez que has entendido qué es WPO y has aplicado todos los consejos que hemos mencionado para optimizar tu sitio web, ha llegado el momento de averiguar si realmente has obtenido buenos resultados. Para ello, será impresincible llevar a cabo una auditoría WPO con algunas de las siguientes herramientas que os recomendaremos a continuación. El empleo de las siguientes herramientas te aportará un feedback inmediato para realizar los ajustes sobre la marcha:
Ten en cuenta además, que el trabajo para mejorar tu WPO no finaliza una vez que aplicas todos los cambios y realizas la auditoría, sino que es algo que deberás llevar a cabo de forma permamente.
