En este artículo vamos a conocer cómo podemos aumentar la velocidad de carga de un sitio web de WordPress, una de las características que toman en cuenta los motores de búsqueda para colocar un sitio en las mejores posiciones de sus páginas de resultados.
La velocidad de carga de una página web se define como el tiempo medio que tarda una página en aparecer en la pantalla. Se calcula desde la iniciación (cuando el usuario pulsa sobre el enlace de una página, o escribe su dirección en el navegador) hasta que la página está completamente cargada.
El directorio de plugins de WordPress dispone de varios plugins que ayudan a aumentar la velocidad de carga de un sitio web, sin embargo en este artículo vamos a conocer uno denominado como Autoptimize, el cual realiza una optimización del código, y esto lo hace comprimiendo la carga de imágenes y fuentes.
Para instalarlo, debemos ingresar al directorio de WordPress, y una vez instalado y activado debemos acceder al gestor de configuraciones del mismo. Esto lo hacemos desde el menú Ajustes de la barra lateral.
Se carga el gestor de configuraciones de este plugin, y fíjate que tenemos varias pestañas que contienen los diferentes parámetros que debemos definir para configurar este plugin. Por defecto, se muestran las opciones de configuración de la pestaña “JS, CSS y HTML”, y aquí podemos activar la optimización por separado del código HTML, Javascript y el CSS.
Opciones de JavaScript
En este bloque basta con marcar la casilla en el campo “¿Optimizar código JavaScript?” para tener comprimido todo el código JavaScript.
Al marcar esta casilla, de froma automática también se marcará la casilla del campo “¿Unificar todos los archivos JS enlazados para que se carguen sin bloquear la carga de la página?”, la cual permitirá enlazar archivos JavaScript para que se carguen sin bloquear la carga de la página. Si la desactivamos, los archivos JS individuales seguirán en su lugar pero minimizados.
El resto de las opciones de este bloque las podemos dejar tal y como están.
Opciones de CSS
En este bloque debemos marcar la casilla del campo “¿Optimizar el código CSS?” para comprimir el código. Al seleccionar esta casilla, también se marcarán por defecto las casillas “¿Unificar archivos CSS?” y “¿Incluir CSS incrustados?”.
El resto de opciones las podemos dejar desactivadas.
Opciones de HTML
Para comprimir el código HTML, en este bloque debemos marca la casilla del campo “ ¿Optimizar el código HTML?”.
De forma opcional, podemos seleccionar la opción “¿Mantener comentarios HTML?” si queremos que al comprimir el código se mantengan los comentarios HTML.
También podemos ver otros bloques, los cuáles podemos dejar con su configuración predeterminada.
Para finalizar, debemos presionar sobre el botón “Guardar los cambios y guardar la caché” y así aplicar las configuraciones básicas que hemos definido.
Si queremos optimizar aún más la velocidad de carga de nuestro sitio web, podemos aplicar las configuraciones avanzadas del resto de las pestañas del menú de navegación de este plugin.
Optimización de imágenes
La pestaña “Imágenes” dispone de algunas opciones para optimizar las imágenes de nuestro sitio web y acelerar el tiempo de carga del mismo. Para esto, debemos marcar las casillas “Optimizar imágenes” y “¿Carga diferida de imágenes?”.
CSS Crítico
La pestaña CSS Crítico sirve para retrasar la carga del CSS combinado completo para garantizar que cada página de nuestro sitio web se procese incluso antes de que se cargue el CSS completo.
Para poder configurar esta opción es necesario instalar otro plugin llamado Autoptimize Critical, que es de pago.
Opciones Extra
Esta pestaña evita tener que descargar Google Fonts, o simplemente las elimina. También permite quitar los Emojis, eliminando el CSS y el JavaScript incrustado.
¡Optimizar más!
Aquí se muestra un listado de plugins y servicios relacionados que pueden ayudar a mejorar más el rendimiento de un sitio web. Algunos de estos servicios son de pago.
Una vez que hemos definido todos los parámetros podemos comprobar cuánto ha mejorado la la velocidad de carga de nuestra web, para esto podemos utilizar herramientas de análisis como PageSpeed Insights, GTMetrix, Pingdom Website Speed Test,etc.
Inicialmente me formé como Técnico en Anális y Diseño de sistemas. Luego ingresé a la escuela de negocios, hice una licenciatura en Administración y obtuve una especialización (Post-grado) en Alta Dirección Empresarial. Desde el año 2007 me dedico a la creación de sitios web, lo cual combino con la consultoría y la capacitación de tecnologías de Internet.
- Cascada CSS - agosto 24, 2023
- El objeto Math - agosto 23, 2023
- Diferencia entre null y undefined en JavaScript - agosto 16, 2023
