Aunque Divi ha contado con una mala fama histórica en cuanto a velocidad de carga. Esto … ES COSA DEL PASADO LEJANO. Hubo un tiempo, en que la implementación del antiguo page builder de Divi hacía que la web fuera algo lenta.
Pero todo eso ha cambiado mucho en los últimos tiempos.
Ahora Divi, es un tema rápido de carga con las opciones por defecto.
Pero, además en este post te voy a mostrar cómo hacer que vuele.
Te voy a mostrar cómo he conseguido que Google Page Speed me muestre una puntuación de 100 en escritorio y 100 en móviles.
IMPORTANTE!!!! La mayoría de opciones que te comento te servirán sea cual sea la plantilla que estés utilizando con WordPress
ACCEDE A TODOS MIS CURSOS ONLINE POR SOLO 10€/MES
DISPARAR OPTIMIZACIÓN Y VELOCIDAD DE CARGA DE DIVI
- Resultados en Google PageSpeed Insights de Web Wordpress con Divi
- Caché, compresión, optimización de imágenes, optimización de código y servicio web con Wordpress, Divi y WP Rocket
- Optimización de imágenes con Divi
- Quitar imágenes (avatares) en los comentarios de los posts de Wordpress
- Utilizar una fuente por defecto y no cargar Google Fonts
- Opciones de configuración y optimización de DIVI
- Versión de PHP del hosting con Wordpress
Resultados en Google PageSpeed Insights de Web WordPress con Divi
En primer lugar te muestro los resultados en Google PageSpeed Insights de un post del blog de mi web realizada con Divi
Resultado en Escritorio
Resultado en Móvil
En segundo lugar te muestro los resultados en Google PageSpeed Insights de la home de mi web realizada con Divi
La home es la página que más contenido tiene en todo el sitio web. Por lo que es normal que obtenga un poco peores resultados que el post que te he mostrado antes. Pero, tampoco está muy mal, 100 puntos en Escritorio y 94 en móviles
Resultado en escritorio
Resultado en móvil
Caché, compresión, optimización de imágenes, optimización de código y servicio web con WordPress, Divi y WP Rocket
En general en WordPress hay una serie de optimizaciones básicas que se deben implementar con cualquier tema que estés usando. Me refiero a crear una caché, compresión, optimización de código CSS, Javascript, optimización de servicio y carga diferida de imágenes.
Antiguamente usaba con Divi varios plugins gratuitos de optimización como: WP Super caché (para caché y compresión), Autoptimize (para optimización de código y servicio web) y a3 LazyLoad (para carga diferida). ..Aunque la velocidad de la web estaba bien y también su puntuación en Google PageSpeed insights, yo quería más, más, quería que mi web «volase» y tuviera 100 puntos en Google pagespeed insights, para un mejor posicionamiento web.
Después probé Wp Rocket que incorpora todas esas funcionalidades y otras más, y vi como mejoraban los tiempos de carga y optimización en Google PageSpeed Insights de mi WordPress con Divi.
Es el único plugin de pago que te voy a comentar en este post. Porque ha sido clave para la mejora de mi web con Divi y porque es un plugin con un precio asequible (en el momento de escribir este post está en 49$).
Tiene mejores y más potentes funcionalidades que los otros plugins que usaba y claro, concentrar todas esas funcionalidades en un solo plugin también ahorra recursos en WordPress y provoca una mejora del rendimiento.
Aquí tienes un enlace a la configuración de WP Rocket (incluye vídeo): Configuración de WP Rocket
QUIERO WP ROCKET
Optimización de imágenes con Divi
Debes subir las imágenes a tu wordpress con un tamaño adecuado en píxeles.
Aunque lo hagas correctamente, es muy importante instalar un plugin que optimice el peso de todas las imágenes que subas a tu wordpress con Divi.
Yo estoy utilizando en mi wordpress con Divi, el plugin gratuito Optimizador.io
DESCARGAR OPTIMIZADOR.IO
En este artículo tienes explicado como configurar el plugin: Cómo configurar el plugin gratuito Optimizador.io
Quitar imágenes (avatares) en los comentarios de los posts de WordPress
La carga de imágenes de los usuarios que hacen comentarios en las entradas del blog (avatares) provoca la realización de múltiples llamadas externas para la carga de imágenes.
Más llamadas cuanto más comentarios haya en el post. Cuanto más llamadas, más lenta es la carga de la página.
Yo tengo desactivadas la carga de imágenes (avatares) en los comentarios del blog y eso provoca una carga más rápida de las entradas del blog.
Es decir, no se muestran las imágenes de los avatares en los comentarios de WordPress.
Para hacer esto has de ir a en el panel de administración de tu wordpress a: “Ajustes > comentarios”, desmarcar el checkbox “Visibilidad del avatar” y guardar los cambios.
Utilizar una fuente por defecto y no cargar Google Fonts
Hay fuentes de Google que son muy bonitas. De eso no hay duda.
Pero, la carga de fuentes de Google (Google Fonts) se ha de realizar cada vez que se sirve una página de WordPress y eso provoca retrasos en la carga de páginas.
Lo que yo decidí hacer fue utilizar una fuente por defecto de las que incluye Divi (que ya vienen precargadas) y desactivar la carga de fuentes de Google.
a.- Fuente por defecto: Primero puse la fuente “Arial” por defecto en todo el sitio web. Las fuentes por defecto que puedes elegir con Divi son: Default theme Font, Arial, Georgia, Times New Roman, Trebuchet y Verdana.
Para ello has de ir a: “Divi > Personalizador de temas > Ajustes generales > Tipografía” y seleccionar una de las fuentes por defecto en el apartado “Fuente de cabecera” y “Fuente del cuerpo del texto”
Después, clic en el botón “Publicar”
b.- Desactivar Google Fonts: Para desactivar la carga de fuentes de Google has de ir a “Divi > Opciones del tema”, después en la pestaña “General” has de ir al selector “Usar las fuentes de Google” y ponerlo en “Desactivar”
Después guardar los cambios.
Opciones de configuración y optimización de DIVI
Ahora te muestro algunas opciones de optimización específicas del tema Divi.
Divi > opciones del tema > General (esto es interesante sobre todo si tienes incluido en la web algún Mapa de Google)
Divi > opciones del tema > General > Performance
Versión de PHP del hosting con WordPress
Intenta utilizar siempre la última versión de PHP disponible en tu hosting. Usar una versión antigua de PHP ralentiza la carga de la web y puede producir incompatibilidades.
Para saber que versión de PHP utiliza tu servidor consulta a tu empresa de hosting. También le puedes consultar a ellos como cambiarla.
Te recomiendo que siempre utilices la última versión PHP que te funcione correctamente.
Es decir, prueba a poner la última versión y después navega por tu web y por el panel de administración. Si detectas algún fallo, pon la versión de PHP anterior a la última y vuelve a probar.
Si no has detectado ningún fallo, utiliza la última versión.
Revisa si aparecen nuevas versiones PHP disponibles en el panel de administración de tu empresa de hosting.
Soy Blogger y formador profesional. Me gustaría que este blog te sirviera para conocer más de cerca el mundo del diseño web y de WordPress. Mi proyecto online es una plataforma de formación online tipo membership site, denominada cursotiendaonline.com donde podrás acceder a todos los cursos por solo 10 €/mes
