WordPress

Optimizar una web WordPress con WP Rocket e Imagify

Proponemos la instalación de dos plugins en WordPress destinados a conseguir que las páginas web cumplan con las Core Web Vitals y, como consecuencia de ello, carguen rápidamente.

Optimizar una web WordPress con WP Rocket e Imagify

Cada vez es más importante el conseguir el mínimo tiempo de carga de las páginas de un sitio web. Optimizar una web WordPress, es decir, conseguir el máximo rendimiento de un sitio web gestionado con WordPress es fundamental. Hoy hay que tener muy en cuenta lo que indican las Core Web Vitals impuestas por Google.

Para conseguir lo indicado es obligatorio instalar, en el caso de que el CMS sea WordPress, un plugin de caché y otro que se ocupe de crear todos los tamaños de imágenes con el menor peso, es decir, que ocupen poco espacio, así como que sea capaz de crear imágenes en el formato WebP.

Después de haber realizado una gran cantidad de ajustes y cambios en Batiburrillo.net he llegado a la conclusión de que los dos mejores en el terreno indicado son WP Rocket para la caché y, para la gestión de imágenes, Imagify. El primero es de pago, pero a pesar de ello merece la pena su instalación. El segundo ofrece una versión gratuita si no se suben muchas imágenes, y dos versiones de pago.

Lo que ofrece WP Rocket

Ya hemos hablado de este plugin en más de una ocasión. Así, hemos escrito tres artículos sobre el mismo, WP Rocket, algo más que un plugin de caché para WordPress, Cómo optimizar un sitio web construido con WordPress utilizando WP Rocket y Cómo conseguir una alta puntuación en PageSpeed Insights.

Tras instalar WP Rocket los pasos a seguir para su puesta en marcha son muy sencillos. De hecho, los más importantes se activan ya desde el primer momento. Tras acceder, en el Panel de Administración de WordPress, hay que ir a Ajustes -> WP Rocket. Estos son los ajustes que proporcionan un alto rendimiento:

  • Caché: Activar Habilitar la caché para dispositivos móviles y dejar en 10 horas la Vida útil de la caché.
  • Optimizar archivos: Activar Minificar archivos CSS, Optimizar la entrega del CSS con la opción REMOVE UNUSED CSS, Minificar archivos JavaScript, Cargar archivos JavaScript de manera diferida y Retrasar la ejecución de JavaScript. Si notamos algún error en las páginas del sitio web, tal vez sea necesario eliminar algún archivo CSS en el apartado de REMOVE UNUSED CSS. Lo mismo habría que hacer en los apartados de JavaScript.
  • Medios: Activar en LazyLoad las dos primeras opciones. También es conveniente marcar el apartado incluido en Image Dimensions.
  • Precargar: Activar los tres apartados de Precargar Caché. Lo normal es que el tercero muestre el Mapa del sitio XML que corresponde al plugin de SEO instalado. Es conveniente también activar Precargar Enlaces y Precargar Fonts añadiendo la URL o URLs de los archivos de fuentes.
  • Base de datos: Marcar todos los apartados y, en la parte inferior, activar Programar Limpieza Automática Diaria.

El resto de apartados depende de cada uno. Así, por ejemplo, si tenemos activo un CDN debemos reflejarlo en el apartado correspondientes. El Heartbeat podemos dejarlo con la configuración que trae por defecto. El resto de apartados también podemos dejarlos sin efectuar ningún ajuste.

Lo que ofrece Imagify

Lo mismo que ocurre con WP Rocket, también hemos publicado ya un artículo sobre este plugin. Nos referimos a Imagify, para optimizar imágenes en WordPress. Este complemento se puede descargar gratuitamente desde el repositorio de WordPress. Como ya hemos indicado, podemos utilizar esta versión o recurrir a una de pago en el caso de que el número de imágenes optimizadas al mes superen los límites.

La configuración del plugin es muy sencilla. Tras acceder, dentro del Panel de Administración de WordPress, pulsamos sobre Ajustes -> Imagify. Esto es lo que debemos hacer:

  • En el nivel de optimización podemos optar por Agresivo.
  • Activamos Optimización automática de imágenes al subirlas y Backup de las imágenes originales.
  • Activar la creación de versiones WebP de imágenes y marcar Usar las etiquetas <picture> tags.
  • Activar la redimensión de las imágenes más grandes, señalando el tamaño máximo.
  • Se mostrará una lista de los archivos a optimizar. Podemos dejar todos los que estén activados o, en el caso de que se repita algún tamaño, eliminar uno de los dos que se muestran.

Tras finalizar los procesos anteriores debemos pulsar sobre Guardar cambios o Guardar e ir a optimización masiva.

Conclusión

Si tienes dudas sobre la instalación de estos plugins, desechalas. Haz lo que te contamos en este artículo y podrás comprobar los resultados obtenidos en PageSpeed Insights. ¡No tengas dudas!

Fabriciano González

Amante de la informática y de Internet entre otras muchas pasiones. Leo, descifro, interpreto, combino y escribo. Lo hago para seguir viviendo y disfrutando. Trato de dominar el tiempo para que no me esclavice.

Deja una respuesta

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

uno × 1 =

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.