187 | Errores a evitar cuando usas un page builder

WordPress Semanal

En el episodio 187 de Wordpress Semanal repasamos 6 detalles importantes a tener en cuenta cuando diseñas tus páginas con un page builder como Elementor, Divi o similar.

Escuchar en iTunes Escuchar en iVoox Escuchar en Spotify

Plugin de la semana: páginas que vuelan

Ya recomendé un sistema para hacer que las páginas de tu web carguen más rápido (pre cargándose al pasar por encima de un enlace).

Con el plugin Flying Pages podrás conseguir lo mismo pero usando una metodología (según su autor) más completa.

6 buenas prácticas en el uso de un constructor visual

1) Usa un theme compatible con tu page builder

• Para tener control total sobre una página o incluso sobre la web entera
• Publiqué un episodio completo al respecto: mejores themes para implementadores
• GeneratePress, Astra, OceanWp, Hello Theme (para Elementor)

2) Desactiva los cachés

• Caché del navegador (plugin para evitarlo)
• A nivel de tu servidor
• Caché de un plugin
• Desactiva los cachés cuando estés en pleno diseño

3) Establece la paleta de colores de antemano

• Los page builders suelen traer una opción para definir los colores de antemano
• Tanto a nivel general como si estás diseñando una página concreta
• Si haces esto, ganarás en productividad y en consistencia
• Si además quieres guardar tu paleta de colores en el selector del editor de WordPress, puedes usar este plugin

4) Evita las columnas y las barras espaciadoras para posicionar elementos

• Aunque uses un page builder, es recomendable seguir buenas prácticas
• Los page builders te dan la opción de usar propiedades como el margin y el padding
• Así que aprovéchalo, no tienes por qué usar columnas vacías o barras espaciadoras para colocar elementos donde quieras
• Eso no hará otra cosa que añadir código extra, mermando el rendimiento de tu web y dificultando su mantenimiento

5) Simplifica el uso de secciones y columnas

• En la misma línea que lo anterior
• No hace falta que insertes columnas dentro de columnas hasta el infinito
• Puedes crear distintas secciones dentro de una misma página, cada una con sus columnas si son necesarias
• Así tendrás todo más ordenado desde el punto de vista visual y de código (estructural)

6) Usa imágenes escaladas y optimizadas

• Si cuando usas el editor normal de WordPress subes imágenes en un tamaño óptimo, haz lo mismo con un page builder
• Más allá de que tengas un sistema automático de optimización de imágenes, es buena práctica subirlas a tu web con las dimensiones que vas a usar
• Además, no todos los page builders hacen el trabajo de escalado por css que sí hace el editor de WordPress normal

Accede a +40 cursos, +130 vídeos avanzados y soporte conmigo: prueba el área para suscriptores durante 15 días sin compromiso.

Enlaces

En este episodio he mencionado los siguientes recursos:

1. Nuevo vídeo de la Zona código: eliminar menús de la barra de admin de WordPress
2. Curso del mes: Curso de WooCommerce (renovado)
3. Recomendaciones: Curso de Elementor, Curso de GeneratePress, Curso de Divi

Conclusión

Recuerda que no debes descuidar las buenas prácticas aunque uses un constructor visual.

Incluso diría que debes ser más riguroso en la preparación y la ejecución para no sobrecargar tus páginas ni hacerlas difíciles de mantener o replicar.

---

Si te ha gustado el episodio de hoy y quieres ayudarme a seguir creando episodios como este en iTunes, deja una valoración aquí (tardarás segundos). ¡¡Gracias!!
Si me escuchas desde iVoox, también te agradezco tus comentarios y me gusta.

La entrada 187 | Errores a evitar cuando usas un page builder es una artículo de Gonzalo Navarro.