¿Qué constructor de páginas debe utilizar con WordPress? Con tantas opciones, puede ser difícil encontrar el adecuado para tus habilidades, gustos y nivel de experiencia. ¿Cuál es el mejor? ¿Gutenberg? ¿Beaver Builder? ¿Elementor? ¿Brizy? ¿Otro del que no haya oído hablar?
En este post, nos centraremos en dos constructores de páginas diferentes: Gutenberg y Elementor.
En primer lugar, explicaremos qué es exactamente cada una y cómo funciona. A continuación, haremos una comparación en profundidad de 11 métricas diferentes, incluyendo la facilidad de uso, las capacidades y otras características.
Por último, te ayudaremos a tomar una decisión y te daremos nuestro veredicto final.
¡Comparemos Gutenberg con Elementor!
- ¿Qué es Gutenberg?
- ¿Qué es Elementor?
- Creadores de páginas frente a editores de bloques
- Los creadores de páginas y el futuro del diseño web
- Gutenberg y Elementor comparados
- Gutenberg vs. Elementor: Capacidades
- Gutenberg vs. Elementor: Compatibilidad con otros plugins
- Gutenberg vs. Elementor: Facilidad de uso
- Gutenberg vs. Elementor: Características principales
- Gutenberg frente a Elementor: principales diferencias
- Gutenberg vs. Elementor: Experiencia de edición en directo
- Gutenberg vs. Elementor: Características Responsive
- Gutenberg vs. Elementor: Funciones avanzadas
- Gutenberg vs. Elementor: Impacto en la velocidad de la página
- Gutenberg vs. Elementor: Precios
- Gutenberg vs. Elementor: Construir una página
- La decisión final
¿Qué es Gutenberg?
Lanzado originalmente en 2018, Gutenberg es ahora el editor de bloques estándar de WordPress. Aunque todavía puedes instalar el plugin WordPress Classic Editor, toda la comunidad de desarrolladores y diseñadores de WordPress está comprometida con el nuevo sistema Gutenberg.
El nuevo sistema fue creado para hacer de la construcción de un sitio web un proceso mucho más fácil. En lugar de escribir código HTML y CSS manualmente, Gutenberg está diseñado para ser muy fácil de usar, incluso para usuarios sin conocimientos técnicos.
Para crear una página en Gutenberg, simplemente tienes que arrastrar y soltar pequeños elementos, que se llaman bloques. Basta con arrastrar y soltar estos bloques en el editor y personalizarlos según sea necesario.
Más información sobre Gutenberg en nuestra guía detallada.
¿Qué son los complementos de Gutenberg?
Desde que Gutenberg es ahora el editor de bloques por defecto en WordPress, hay muchas nuevas extensiones y complementos que añaden funcionalidad. Estos plugins añaden de todo, desde tipos de bloques especiales hasta diseños completos, pasando por todo lo demás.
Spectrapor ejemplo, es un plugin que te permite añadir una cantidad significativa de nuevas funcionalidades al editor Gutenberg.
Puede añadir muchos tipos de bloques nuevos, como listas de precios, testimonios, listas de iconos y muchos más.
Utilizando los complementos, puedes crear sitios web complejos sin necesidad de saber programar. Basta con pulsar unos cuantos botones.
¿Qué es Elementor?
Elementor es uno de los plugins más populares para crear páginas de WordPress disponible, con más de 8 millones de instalaciones en todo el mundo. Permite personalizar el sitio mediante una interfaz de arrastrar y soltar, lo que facilita la creación de páginas y entradas sin necesidad de conocimientos de codificación.
Como puede ver en la captura de pantalla anterior, Elementor se utiliza en una interfaz separada que es diferente de la estándar de WordPress. Sin embargo, puedes acceder a él directamente desde tu sitio web, por lo que no hay nada más que gestionar que el propio plugin Elementor.
Elementor viene con un gran número de widgets, que le permiten añadir diferentes características a su sitio. Si esto no es suficiente para usted, entonces hay muchos Complementos Elementor para añadir muchos widgets y opciones de estilo.
Quizá el punto fuerte de Elementor sea su capacidad de diseño. Puede establecer posiciones personalizadas, modificar los márgenes de relleno y crear reglas globales para los colores y la tipografía.
Puede crear muchos tipos de sitios web con Elementorincluyendo portfolios, sitios de comercio electrónico, páginas de destino, listas de eventos, blogs y prácticamente cualquier cosa que se le ocurra.
Elementor: Comparación entre Free y Pro
Elementor dispone de versiones gratuitas y de pago. La versión gratuita incluye más de 40 widgets básicos y más de 30 plantillas. Los planes premium cuestan desde $49 al año por un sitio, hasta $999 al año por el plan de agencia, con un límite de 1.000 sitios.
La versión premium tiene widgets extra (90+), plantillas extra (300+), kits de creación de sitios web, soporte premium y otras características. Todo esto merece mucho la pena si tienes presupuesto para tu proyecto.
En general, si está construyendo un sitio web de negocios, es probable que desee obtener al menos la suscripción premium básica, ya que la versión gratuita puede ser algo limitada.
Creadores de páginas frente a editores de bloques
Elementor y Beaver Builder son creadores de páginas, mientras que Gutenberg es un editor de bloques.
Pero espera... ¿cuál es la diferencia entre un constructor de páginas y un editor de bloques? En la práctica, no mucha, especialmente para el usuario medio.
Sin embargo, en los detalles más sutiles, hay una diferencia.
Los creadores de páginas son más potentes, al menos por ahora. También permiten personalizar el diseño de la página de más formas, mientras que Gutenberg depende más del tema de WordPress.
Se puede pensar en un constructor de página como la creación de la página entera, mientras que un editor de bloques es sólo una forma de añadir cosas dentro de una página que existe en un sitio WordPress con un tema ya existente.
En otras palabras, con un editor de bloques, tus páginas siguen estando afectadas por el tema general de tu sitio. Con un constructor de páginas, puedes cambiar las fuentes, los colores y otros elementos de diseño de una página para que sean completamente independientes del tema general del sitio.
Utilizando la metáfora del cuadro, un constructor de páginas permite personalizar tanto el marco como el cuadro. Mientras que un editor de bloques solo te permite cambiar el cuadro, pero mantiene el marco (el propio tema de WordPress) igual.
Los creadores de páginas y el futuro del diseño web
Sin embargo, Gutenberg se está poniendo al día rápidamente y es probable que tenga más funciones de constructor de páginas en un futuro próximo.
Esto se debe a que es el futuro de WordPress y, como tal, cuenta con el apoyo de toda la comunidad. Gutenberg pronto será la única forma de crear un sitio moderno en WordPress sin usar constructores de páginas
Para el futuro, es probablemente una apuesta segura que Gutenberg eventualmente reemplazará o superará a la mayoría de los sistemas de constructores de páginas. Así que es una decisión inteligente aprender cómo funciona Gutenberg.
Dicho esto, es probable que siempre haya un lugar para los creadores de páginas. Como ocurre con muchos Plugins de WordPress y temas, a veces se necesita un sistema más potente y personalizable que resulta demasiado complejo para la versión por defecto.
En este tipo de escenarios, un page builder, combinado con algunos conocimientos profundos y experiencia técnica, seguirá siendo una herramienta capaz de crear sitios web increíbles.
Gutenberg y Elementor comparados
Ahora que sabemos qué son Gutenberg y Elementor, ¡es hora de compararlos!
Adelántese a los acontecimientos con estas comparaciones principales entre Gutenberg y Elementor, recogidas en una infografía fácil de entender.
¿Cuáles son las similitudes? ¿Cuáles son las diferencias? ¿Cuál es mejor? ¿Quién será el ganador?
En nuestra comparación, hemos utilizado 11 parámetros diferentes:
- Capacidades
- Compatibilidad con otros temas y plugins
- Facilidad de uso
- Características principales
- Principales diferencias
- Experiencia de edición en directo
- Funciones de respuesta
- Funciones avanzadas
- Impacto en la velocidad de la página
- Precios
- Construir una página
Vamos allá.
Gutenberg vs. Elementor: Capacidades
En primer lugar, hablemos de capacidades. ¿Qué se puede hacer con estos dos sistemas?
En resumen, Gutenberg y Elementor tienen capacidades similares y se pueden utilizar para crear los mismos tipos de páginas.
Sin embargo, Gutenberg está más integrado con el resto del sistema de WordPress, lo que significa que funciona por defecto con todos los plugins y temas.
Puedes crear páginas y entradas fácilmente con el editor de bloques, que se integra a la perfección con el resto del ecosistema y la interfaz de usuario de WordPress.
Elementor es más bien una entidad totalmente independiente, como una capa que se asienta sobre WordPress. El editor es una aplicación independiente con un diseño diferente y pretende ser un potente constructor de páginas completo, no necesariamente una extensión del sistema estándar de WordPress.
Como tal, puede crear muchos diseños complejos con él, pero puede haber algunas limitaciones con la integración a otras partes del sitio y con otros plugins.
Gutenberg vs. Elementor: Compatibilidad con otros plugins
Dado que Gutenberg es la versión predeterminada de WordPress, es compatible con básicamente todos los plugins y temas para WordPress. Los que no son compatibles con Gutenberg casi siempre están desactualizados, de todos modos, y definitivamente no deberías usar plugins antiguos a menos que seas lo suficientemente capaz técnicamente como para verificar que son seguros.
Elementor es un poco diferente. Elementor es menos compatible con otros temas y plugins, simplemente porque es un sistema muy diferente. Hay algunos plugins incompatibles con ElementorSin embargo, la lista no es demasiado larga.
Dicho esto, la mayoría de los plugins funcionarán sin problemas. Para los que no son compatibles con Elementor, a menudo hay una función nativa que puede realizar la misma tarea.
Gutenberg vs. Elementor: Facilidad de uso
En última instancia, la facilidad de uso depende de las preferencias personales. Sin embargo, cuando se trata de usabilidad, hay definitivamente algunas ventajas y desventajas tanto para Gutenberg como para Elementor.
Con Gutenberg, todo está integrado directamente en WordPress. La interfaz de usuario es simplemente una extensión del resto del panel de administración de WordPress. El diseño en sí también es una extensión del tema que tienes instalado en tu sitio.
Lo mejor de todo es que todo el ecosistema de temas y plugins de WordPress funcionará de forma nativa con Gutenberg. Esto hace que la instalación de nuevos temas y plugins sea pan comido.
Elementor, por otro lado, tiene una interfaz totalmente diferente. En lugar de una extensión de WordPress, es más bien una aplicación increíblemente potente que va encima de él.
Esto tiene sus ventajas y sus inconvenientes. Aunque significa que tendrás que aprender una interfaz de usuario diferente para utilizarlo, esta interfaz es en realidad bastante buena e intuitiva de usar. Es diferente de la de WordPress, pero funciona muy bien y es utilizable por cualquiera, incluso por usuarios sin conocimientos técnicos.
En general, Gutenberg es familiar y sencillo, mientras que Elementor es diferente pero intuitivo.
Gutenberg vs. Elementor: Características principales
¿Cuáles son las principales características de Gutenberg y Elementor? Repasemos cada una de ellas.
Gutenberg:
- Cree diseños modernos sin esfuerzo
- La versión por defecto de WordPress, especialmente en el futuro
- Toneladas de diferentes patrones de bloques y plantillas web prediseñadas
- Adaptado a dispositivos móviles
- No requiere codificación
- Completamente basado en bloques
- Reorganiza y mueve fácilmente los bloques
- Utilice decenas de bloques como encabezados, párrafos, imágenes y mucho más
Elementor:
- Cree páginas mediante una interfaz de arrastrar y soltar
- Toneladas de opciones de diseño
- No requiere codificación
- En gran medida autónomo
- Amplia biblioteca de complementos
- Toneladas de estilos para widgets, cabeceras y otras áreas
- Añade carruseles, galerías y otros elementos de diseño
Gutenberg frente a Elementor: principales diferencias
¿Cuáles son las principales diferencias entre Gutenberg y Elementor?
Hay algunas importantes:
- Gutenberg está integrado en WordPress, y de hecho es WordPress. Elementor es un plugin que está separado y encima del sistema regular de WordPress.
- Gutenberg funciona bien con temas y plugins, mientras que Elementor está esencialmente diseñado para no necesitar otros temas o plugins.
- Gutenberg es principalmente un editor de bloques, mientras que Elementor es un constructor de páginas. La diferencia es que Gutenberg te permite añadir y reorganizar bloques en tu sitio web, que luego son controlados por tu tema. Elementor, por otro lado, te permite crear un sitio completamente único que no está necesariamente ligado al resto del tema de tu sitio.
- Gutenberg es gratuito y siempre lo será, ya que ahora es el estándar de WordPress. Elementor tiene una versión gratuita, pero requiere una cuenta premium para acceder a funciones más potentes.
Gutenberg vs. Elementor: Experiencia de edición en directo
¿En qué se diferencian las experiencias de edición en directo entre Elementor y Gutenberg?
Ambos esencialmente le muestran cómo se verá la página, sin embargo, Gutenberg muestra cosas antes de se aplican el tema del sitio y otros elementos. Por lo tanto, es más como una vista previa que una edición en vivo real.
Para ver cómo aparecerán los bloques de Gutenberg, necesitas ver la página en tu sitio real. Esto es tan sencillo como hacer clic en el botón Vista previa y/o Publique pero sigue siendo un paso más.
Elementor le muestra exactamente el aspecto que tendrá su sitio dentro de la aplicación, ya que el diseñador está integrado directamente en el sistema. Puede personalizar fuentes, colores y cualquier otro elemento de diseño que normalmente maneja el propio tema.
El resultado final se mostrará en tiempo real en el panel de la derecha.
Gutenberg vs. Elementor: Características Responsive
Tanto Gutenberg como Elementor están optimizados para móviles y funcionan perfectamente en cualquier tipo de dispositivo. Son responsive por defecto, lo que significa que no necesitas hacer nada para que funcionen para móviles.
Sin embargo, algunos temas de WordPress pueden no ser responsivos. Esto es relativamente infrecuente y solo ocurre con los temas más antiguos o menos conocidos.
Si utiliza un tema popular como Astra, cada Plantilla Elementor es totalmente receptivo.
Gutenberg vs. Elementor: Funciones avanzadas
¿Cómo de avanzadas son las funciones de Gutenberg y Elementor? ¿Cuál es mejor?
En general, Elementor es probablemente un poco más avanzado, simplemente porque está diseñado para ser autónomo. Cuenta con un editor en vivo de arrastrar y soltar, optimización del flujo de trabajo, creación de páginas de destino, integración con herramientas de marketing y mucho más.
También puede añadir contenido dinámico, efectos de movimiento, estilos personalizados y experiencias personalizadas para cada usuario.
Gutenberg depende del resto del ecosistema de WordPress, como temas y plugins. Aunque puedes obtener la mayoría de las mismas funciones que Elementor, tendrás que encontrar un plugin específico independiente para esa funcionalidad.
Por ejemplo, el contenido dinámico se incluye en Elementor por defecto, pero con Gutenberg tendrás que instalar un plugin como Contenido tan dinámico.
Como tal, Gutenberg carece de ciertas características que se pueden añadir fácilmente a través de otros plugins, como Spectra. En general, no es una gran desventaja, ya que te permite elegir las cosas que quieres usar,
Sin embargo, si comparas la funcionalidad completa de ambos e incluyes los complementos adicionales, son muy comparables.
Gutenberg vs. Elementor: Impacto en la velocidad de la página
En general, Gutenberg es más rápido que Elementor, y muchos pruebas para confirmarlo. Es probable que esto se deba a que Gutenberg es más sencillo, más eficiente y tiene menos funciones adicionales que añaden más tamaño de archivo a tu sitio.
En parte porque Gutenberg es WordPress.
Sin embargo, eso no quiere decir que Elementor vaya a ralentizar su sitio web. Sigue siendo más rápido que la mayoría de los demás constructores de páginas y hay muchos consejos y trucos que puede utilizar para acelerar su sitio Elementor.
Para ilustrarlo, vamos a realizar una prueba de velocidad con GTMetrix. Utilizaremos dos plantillas Astra diseñadas para el mismo tipo de sitio: un sitio web de aventuras al aire libre. El primero se ha creado con Gutenbergmientras que el segundo utiliza Elementor.
Tenga en cuenta que estas plantillas están alojadas en servidores de alta velocidad y han sido debidamente optimizadas.
Resultados de Gutenberg Page Speed
Elementor Resultados de la prueba de velocidad de página
Como puede ver, el de Gutenberg es un poco más rápido: 0,949 segundos frente a 1,2 segundos. Puede que no parezca una gran diferencia, pero cuando se trata de la velocidad de una página web, cada milisegundo cuenta.
En Tema Gutenberg también tiene un tamaño de página menor (1,78 MB frente a 2,02 MB) y menos peticiones (24 frente a 51.) Esto también influye en el tiempo de carga del sitio.
Los sitios más lentos reciben menos tráfico, se comportan peor en los resultados de búsqueda de Google y tienen una mayor tasa de rebote. Esto es especialmente cierto si su sitio tiene muchas imágenes y páginas diferentes, que pueden sumar una cantidad importante de tiempo perdido.
Gutenberg vs. Elementor: Precios
Gutenberg es completamente gratuito, lo que significa que gana esta ronda casi de inmediato. Sin embargo, hay otros factores a tener en cuenta.
A saber, el soporte. Aunque Gutenberg es gratuito y está integrado en WordPress, esto significa que tienes que confiar en los canales de soporte gratuitos y/o en tu host en caso de que surja algún problema. A diferencia de las versiones de pago de Elementor, que incluyen soporte premium.
Por lo tanto, aunque Gutenberg es básicamente gratuito, es posible que tenga que pagar por el soporte adicional, lo que significa que a menudo puede costar la misma cantidad de dinero que Elementor.
Gutenberg vs. Elementor: Construir una página
Por último, hablemos de construir una página con Gutenberg y Elementor. Ambos tienen estructuras similares y son de arrastrar y soltar.
Cómo construir una página con Gutenberg
Para crear una página con WordPress Gutenberg, solo tienes que hacer clic en el signo más negro del editor de páginas y, a continuación, seleccionar el bloque que desees.
Para añadir contenido al bloque, coloca el cursor sobre el bloque y haz clic en él. A continuación, ¡empieza a escribir! Es muy sencillo. También puedes personalizar el bloque utilizando el panel de opciones situado a la derecha de la pantalla. Esto cambiará dependiendo del bloque y del tipo de bloque que hayas seleccionado.
Para desplazar un bloque, basta con hacer clic en los tres puntos situados junto a él y, a continuación, en Muévete.
¡Eso es todo para construir páginas con Gutenberg! Todo es una combinación de estos pequeños pasos: añadir bloques, personalizarlos y colocarlos en la página.
Cómo crear una página con Elementor
El Elementor tiene un diseño más complejo que difiere mucho del configuración estándar de WordPress. Pero aprender a utilizar el Elementor es más fácil de lo que parece.
Para añadir un elemento, tienes que arrastrarlo desde el panel de la izquierda al espacio de la derecha:
Una vez que hayas arrastrado un elemento, puedes moverlo arrastrándolo y soltándolo. Así de fácil.
También puede pulsar el pequeño signo más que aparece en la propia ventana y seleccionar así un elemento.
Para editar el contenido, sólo tienes que colocar el cursor sobre el elemento y hacer clic en él. A la izquierda, verás un panel con diferentes opciones de estilo. Dependiendo del bloque, también puedes editar el contenido directamente en el panel.
Por ejemplo, en la imagen siguiente, podemos editar el archivo Añada aquí su texto de encabezamiento texto en el panel lateral o en la vista previa.
En comparación con Gutenberg, Elementor tiene más opciones de diseño y personalización en el editor.
Esto se debe a que Elementor está diseñado para ser autónomo, mientras que Gutenberg está más integrado con WordPress. Como tal, la mayoría de las opciones de diseño para Gutenberg estarán en el personalizador de WordPress, en lugar de en el constructor de páginas.
Por último, para desplazar un bloque, basta con hacer clic y arrastrar el icono situado en el centro del asa azul del bloque, con 6 puntos.
Si lo mantienes pulsado, podrás arrastrarlo. ¡Voilà!
Crear páginas en Elementor es bastante sencillo y puedes editar y personalizar todo dentro del editor. No es necesario previsualizar la página para ver cómo quedará.
La decisión final
¿Quién es el ganador final? Como casi todo en la vida, depende de tu situación...
Gutenberg es mejor para...
En nuestra opinión, Gutenberg es la mejor opción global para la mayoría de los sitios web. Es la opción predeterminada de WordPress, lo que significa que cuenta con todo el apoyo de los desarrolladores del núcleo de WordPress.
También es muy sencillo y fácil de usar y no tiene mucha curva de aprendizaje.
Aunque Gutenberg no tiene tantas opciones de estilo como Elementor, tiene más que suficientes para todos los usuarios, excepto los más avanzados.
Y con complementos como SpectraCada vez se añaden funciones más potentes.
Elementor es mejor para...
Elementor es una excelente opción para sitios web en los que necesitas hacer páginas complejas que sean diferentes entre sí. O, si estás haciendo un sitio que no es el estándar de blog/sitio de noticias/sitio de páginas estándar.
Elementor le ofrece un mayor control sobre el diseño específico de cada página. Esto se debe a que Elementor le permite tener un control total sobre el diseño de cualquier página en particular. Por lo tanto, si usted necesita tener que para una página en particular o post, Elementor es definitivamente una excelente opción.
Aunque Elementor es más complejo que Gutenberg y está menos atado al sistema de WordPress, sigue siendo un constructor increíble que te da un montón de flexibilidad.
Gutenberg vs. Elementor - Veredicto
Para la mayoría de las situaciones, probablemente querrás quedarte con Gutenberg. Es la opción predeterminada de WordPress y seguirá creciendo con el tiempo. Y con complementos como Spectrala lista de funciones no para de crecer.
Sin embargo, si necesita un sitio más complejo que requiera ajustar el diseño y la funcionalidad de la página, puede que le interese Elementor.
Es una herramienta potente que tiene muchas funciones adicionales que pueden resultar útiles. Y aunque la interfaz de usuario es diferente y puede llevar algún tiempo acostumbrarse a ella, es bastante eficiente una vez que te haces con ella.
Recursos relacionados:
¿Cuál prefieres, Elementor o Gutenberg? Comparta sus experiencias en los comentarios.
Divulgación: Este blog puede contener enlaces de afiliados. Si realiza una compra a través de uno de estos enlaces, es posible que recibamos una pequeña comisión. Leer información. Tenga la seguridad de que sólo recomendamos productos que hemos utilizado personalmente y que creemos que aportarán valor a nuestros lectores. Gracias por su apoyo.
El Elementor era ideal hasta que subieron su precio por las nubes sin más, sin mejorar necesariamente las prestaciones para reflejar dicho aumento de precio.
Gutenberg como sabemos todavía está en su fase inicial. Si un cliente necesita un sitio web creativo súper afinado, le recomendaré Elementor, pero también sé que la mayoría de los clientes están contentos con las características actuales de Gutenberg.
Como freelance con pocos clientes que disfrutan de Elementor Pro gratis estoy constantemente subcontratando para encontrar alternativas más realistas. Tengo la sensación de que Elementor acaba de pegarse un tiro en los pies dada la versatilidad de los plugins gratuitos para alcanzar la excelencia sin necesidad de actualizarse en absoluto, y dado que los nuevos creadores de páginas crecen a una velocidad tremenda. Si hoy empezara a trabajar como freelance elegiría Gutenberg. Pero mis clientes están acostumbrados a Elementor.
Así que empezaré un segundo freelance para clientes normales y usaré Gutenberg. Ya estoy preparando a mis clientes de Elementor para una posible mayor suscripción en mi plataforma. Afortunadamente la reciente licencia Pro de Elementor afectó a los nuevos usuarios y no me afectó a mí (todavía), sé que es sólo cuestión de tiempo hasta que todo el mundo se vea obligado a sus precios actuales y estoy preparado para ese momento.
Gracias por compartir tu opinión, Samuel.
Usted menciona Ultimate Addons, pero cuando hago clic en el enlace salta a un plugin diferente llamado Spectra. ¿Es esta su intención?
SPECTRA es la nueva versión de ULTIMATE ADDONS, así que es el mismo plugin.
Una comparación muy bien redactada, imparcial y exhaustiva. Muchas gracias.
Totalmente de acuerdo. Y gracias por esas palabras en inglés que no podía encontrar en mi cabeza: Unbiased and comprehensive. Por fin! 🙂 Louise
Hola, ¿es posible tener ambas cosas? Por ejemplo, ¿una página de inicio en Gutenberg y un producto de una sola página en Elementor? Lo he intentado pero cuando creo una página en Gutenberg el diseño está totalmente desactivado.