Evento online de la comunidad de Elementor Zaragoza celebrado el 11 de junio de 2020.
El WPO se encarga de conseguir que nuestra página web cargue de manera rápida. Algo fundamental desde cualquier punto de vista.
WPO para Elementor: ¿Qué vamos a ver?
En esta charla, el compañero Chabi Angulo – líder de la comunidad de Elementor Zaragoza junto a Merche Salas – hace un repaso completo al WPO desde 3 enfoques: del alojamiento web a Elementor pasando por WordPress.
Durante la charla, veremos:
- Qué es el WPO y porqué es importante para Elementor (y tu web).
- Pautas para optimizar el hosting.
- Detalles para mejorar el rendimiento de WordPress.
- Ajustes de velocidad para Elementor y Addons.
- Plugins y enlaces de interés
¿Qué es WPO?
WPO, de las siglas en inglés Web Performance Optimizations, sería algo así como las técnicas de optimización del rendimiento de una página web.
Lo mires por donde lo mires, optimizar el rendimiento de tu sitio web es positivo.
Le gustará a Google, le gustará a tus usuarios y también te ayudará a consumir menos recursos en tu servidor.
¿Por qué es importante el WPO?
- Es importante para que la web sea rápida. Eso ayuda a los recursos de tu hosting.
- Para que los usuarios no abandonen la web
- Para mejorar el posicionamiento en Google (el SEO y el WPO van de la mano)
Nunca debemos ver el WPO como un gasto; a la larga, es una inversión.
¿Qué vamos a necesitar?
Lo primero y fundamental: paciencia. Hacer WPO para Elementor o para cualquier web no es algo que se haga en un abrir y cerrar de ojos.
Además, Chabi recomienda varias herramientas que utilizará a lo largo de la charla:
- Gtmetrix (registrados con una cuenta gratuita), una herramienta para medir la velocidad de la web.
- Copias de seguridad (All in One WP Migrator, Updraft Plus, etc)
- Excel (para llevar el registro de nuestros avances en cada análisis de velocidad)
- Un editor de código
- Un cliente FTP (Filezilla o similar)
¿Cómo medimos la velocidad de Elementor?
Gtmetrix es una buenísima herramienta para medir la velocidad de una página web.
Desde aquí, con una cuenta gratuita, podremos geolocalizar nuestro análisis en un centro cercano a nuestros usuarios.
Si trabajamos en una web para España, podremos configurar Gtmetrix para que analice los tiempos de carga desde Londres.
Y revisaremos 4 parámetros:
- Tiempos de carga: debería estar entre 2 a 3 segundos.
- Peticiones: ideal tenerlo por debajo de 50 peticiones.
- Peso: nunca deberías pasara la barrera de «1 mega» de peso para cada url.
- Puntuación: la nota que Gtmetrix asigna a nuestra optimización de velocidad.
Optimizar el hosting para una web rápida
Antes de comenzar un proyecto, valora las limitaciones del hosting y sobre todo elige un buen plan.
Es interesante que el servidor web cuente con discos duros SSD, certificados SSL, las últimas versiones de PHP, MySQL o MariaDB.
Algunos ajustes de servidor para mejorar la velocidad de Elementor:
- Activar compresión GZIP.
- Reducir el TTFB (Time to First Byte)
- Certificado SSL.
- HTTP2
- Optimizar la base de datos (échale un ojo al hack que nos dejó en la meetup de Madrid)
- Si está disponible, activar LiteSpeed en nuestro servidor
Mejorar el rendimiento de WordPress
IMPORTANTE: Antes de cada cambio, haz una copia de seguridad.
La mejor herramienta es el sentido común:
- Puedes registrar tus avances en un excel.
- Cuando vayas a probar funcionalidades, plugins o temas para tu WordPress, hazlo en una instalación en local para no «ensuciar» tu página web.
Algunos consejos para mejorar la velocidad de WordPress:
- Mantén tu WordPress actualizado (pero siempre espera unos días para actualizaciones grandes)
- Optimiza la base de datos.
- Aumenta la memoria de PHP hasta los 256Mb (mínimo) para mejorar el rendimiento de Elementor.
- Utiliza un theme optimizado. Chabi recomienda Astra. Y también habla de Hello Theme, OceanWP y GeneratePress
- Utiliza plugins con sentido común y no tengas más de 1 plugin que haga lo mismo.
Multimedia: optimiza las imágenes de tu web
- Asegúrate de controlar las dimensiones de tus imágenes.
- Intenta siempre que las imágenes de tu web pesen menos de 100kb.
Recursos para optimizar elementos multimedia:
- https://tinypng.com/
- https://shortpixel.com/online-image-compression
- https://comprimir-video.convertir-pdf.com (para vídeos)
Y plugins de WordPress que nos ayudarán a optimizar nuestras imágenes:
Otros detalles para optimizar WordPress
- Configurar un CDN
- Optimizar heartbeat
- Vigilar errores 4040
- Analiza el rendimiento o impacto de uso de plugins y themes
¿Cómo cargar rápido Elementor?
Elementor sí ralentiza nuestra web. Claro, descartando también las
anteriores acciones que serían tratar el hosting y WordPress.
No me sirve de nada tener un coche si no tengo para pagar su combustible.
No me sirve de nada tener una web si el hosting tiene caídas constantes.
Así que ya por defecto, Elementor hay que tratarlo y si es desde nada más
comenzar, mejor.
Sabemos a la perfección que la memoria PHP debe tener 256Mb
Ajustes WPO para Elementor
Chabi recomienda:
- Seguir todos los consejos anteriores.
- En Elementor -> Ajustes:
- Desactivar Elementor de aquellos contenidos que no necesitamos.
- Desactivar colores por defecto.
- Desactivar fuentes por defecto.
- Desactivar font awesome 4
- Utilizar el menor número de fuentes diferentes (por estética y por velocidad)
- Desactivar los widgets que no usemos en la colección de addons para Elementor que tengamos instalados.
- Códigos para el functions.php de tu web:
- Si no los utilizamos, quitar los iconos de Font Awesome (ver en Github de Chabi)
- Lo mismo para eicons (ver artículo)
- Optimizar el CSS y el javascript: minimizar y combinar con WP-Rocket
Enlaces de interés
Si te interesa el tema del WPO y cómo hacer que tu web en Elementor cargue más rápida, Chabi recomienda a 2 cracks.
Él dice que ha aprendido todo de ellos y son sus referentes en temas de optimización WPO:
Por supuesto, échale un ojo a todas las charlas de WPO que hay en WordPress.tv. Y en especial a este taller de Fernando Puente en WordCamp Zaragoza 2019.
¿Aún no has visto el vídeo? Pues míralo hasta el final. Mucho valor en esta charla sobre WPO y en el debate y ronda de preguntas posterior.
¿Qué truco de WPO para cargar más rápido Elementor utilizas tú? Déjalo por los comentarios.
Y, si aún no estás dentro, suscríbete a nuestra newsletter para estar al día de las novedades del universo Elementor.
Sí, también hablamos de WPO (aunque no tan bien como Chabi).
4 comentarios en “WPO para Elementor: optimiza tu página web”
¡Excelentes tips! Nos han sido de mucha ayuda. Estuve leyendo que el equipo de Elementor está optimizando el código fuente. Las próximas actualizaciones serán más rápidas.
Gracias por tu comentario!
Sí, en Elementor 3 optimizaron la estructura del código y lo seguirán haciendo en próximas actualizaciones seguro, para intentar mejorar los tiempos de carga de nuestras webs con Elementor.
Un saludo!
Gracias chabi, ando trabajando las WPO por el tema de ir mejorando las Core Vital en mi página web porque he leído que dentro de poco será un factor importante para Google
Hola
Supongo que aparte de realizar todos estos cambios, también se ha de tener en cuenta las características del servidor, porque debe de influir de alguna manera en la carga al margen de la optimización que realices.