15 octubre 2019

¿Cómo mejorar el PageSpeed en WordPress?

Si me conoces un poco, ya sabrás que estuve trabajando durante una época en BigSeo. Fue allí donde comencé a entender qué era el SEO y todos los factores que implicaban a este. Como programador, a parte de diseñar webs y programar nuevas funcionalidades, una de las tareas que tenía era la de optimizar el PageSpeed de las webs con el objetivo de que fuesen más rápidas y en consecuencia más fáciles de rastrear para Google (y ya de paso mejorar un poco la experiencia de los usuarios).

Pasé muchos ratos junto a Toni Díaz y Pau Casanellas intentando buscar posibles mejoras por ínfimas que fuesen, y en este post voy a explicar lo más usado y cómo he conseguido que esta página web tenga un 90 en versión móvil y un 98 en versión Desktop .

Tema

Estos son los temas que he probado, te cuento mi experiencia 100% sincera en lo que a PageSpeed y velocidad de carga se refiere.

Astra

Astra es el tema que utilizo en la mayoría de páginas web. Es un tema de una compañía muy involucrada en el desarrollo de temas y plugins para WordPress. Este tema tiene una versión gratuita y una versión de pago, ya dependerá de las necesidades o funcionalidades que necesites. Este tema es increíblemente rápido y se toman muy en serio la velocidad de la web, por lo que continuamente están optimizando el tema para que sea aun más veloz. Además, cuenta con muchas opciones de personalización que te facilitarán y agilizarán mucho el hecho de hacer una web bonita y funcional.

Orbital Theme

Orbital Theme, de BigSeo, también es muy rápido, aunque actualmente no saca tan buena nota en PageSpeed como Astra. De todos modos es un buen tema, y es increíblemente bueno si tu objetivo es crear nichos para la venta de productos de afiliado. Es por ello que si quieres realizar una web enfocada a la venta de productos de afiliados te recomiendo comprar YA este tema, porque con los clústers te será increíblemente fácil realizar tu página. Al igual que Astra, en Orbital se toman muy en serio la velocidad de carga de la página ya que esta influye directa e indirectamente en el posicionamiento de la web así que no debes preocuparte porque tendrás una web con una alta velocidad de carga.

Plugins

Estos han sido los plugins que más he utilizado en WordPress para mejorar el Pagespeed, tal vez hay mejores pero a mí me han funcionado muy bien y siempre los utilizo.

Caché

W3 Total Caché

Una de las cosas imprescindibles para tener buen PageSpeed es la caché y minimizar los ficheros. Sin esto, automáticamente nuestra nota de PageSpeed se irá a la basura. Es por ello que hay que tener sí o sí un buen plugin para la caché. En mi caso utilizo W3 Total Caché.

Este plugin, además de permitirnos tener una buena política de caché, permite minimizar todos los archivos que queramos de javascript y css y finalmente comprimirlos todos en un único fichero. Es muy fácil de configurar y funciona muy bien, tal vez sea por eso que millones de webs lo tienen instalado.

Optimización de imágenes

Un problema común cuando se intenta mejorar el PageSpeed son las imágenes. Suele haber varios errores: las imágenes deben tener un formato de próxima generación, las imágenes son demasiado grandes y/o pesadas...

Squoosh App

Squoosh App no es un plugin, es una web que permite subir imágenes redimensionarlas y cambiarles el formato entre otras muchas cosas. Es esencial subir imágenes mínimamente optimizadas a WordPress. No recomiendo subir imágenes en formato WEBP ya que aún no está soportado al 100% por todos los navegadores, así que lo que recomiendo es que redimensiones la imágenes en caso de ser necesario y la conviertas a MOZJPG.

Resmush.it

Resmush.it no solo te deja optimizar las imágenes sino que a partir del momento en que lo instales todas las imágenes que subas se optimizarán automáticamente. Es de esos plugins que no hace ruido pero va haciendo su trabajo. Sin duda lo recomiendo.

Lazy Load

Como en BigSeo utilizábamos el tema Orbital Theme, ya teníamos por defecto la opción de activar el Lazy Load. Sin embargo antes de que esta funcionalidad estuviese programada utilizábamos algún plugin para Lazy Load, aunque no solíamos tener una preferencia como pasaba con los anteriores.

A3 Lazy Load

Este era el plugin que utilizábamos en BigSeo y nos iba bien. Pero recuerdo que tampoco probamos demasiados, tal vez dos o tres más. Finalmente decidimos quedarnos con este ya que era el que menos problemas presentaba y hacía su función.

QuickLink

QuickLink no afecta al PageSpeed, pero ya que estamos tratando la velocidad de carga creo conveniente añadirlo al pack. QuickLink precarga el contenido de los enlaces que se encuentran en el Viewport, de manera que cuando un usuario hace clic en un enlace esa página ya está cargada y por lo tanto no tendrá que esperar a la respuesta del servidor. Sin duda un gran plugin.

EL MEJOR CONSEJO

El mejor consejo para tener un buen PageSpeed es no instalar plugins de más. Cada plugin tiene sus propios archivos CSS y JS y estos se cargan en todas las páginas independientemente de si se utiliza el plugin o no, de manera que cada vez que instalas un plugin tu página tarda unos milisegundos más en cargar.

Si hay algo que se puede hacer a código, intenta hacerlo a código.

Si hay varios plugins con la misma funcionalidad, testea cuál es mejor en relación pagespeed/calidad.

Pon imágenes, pero no te pases.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram