Elementor vs Framer

En la actualidad, si quieres tener presencia en internet, tener una página web o una landing page se vuelve algo indispensable, existe una gran variedad de alternativas en el mundo de los constructores web (tanto con código como sin código) pero, en este artículo vamos a comparar Elementor, uno de los constructores web más populares de Wordpress con Framer, la alternativa reciente que promete cambiar como se hacen webs.

¿Qué es Elementor?

Elementor es un popular constructor de páginas web y landing pages que se ha convertido en una de las herramientas más utilizadas en el ecosistema de WordPress. Es un complemento (plugin) para WordPress que te permite diseñar y construir sitios web de manera visual, utilizando una interfaz intuitiva de arrastrar y soltar.

La principal característica que define Elementor es su sistema de “bloques personalizables” que reducen la complejidad de construir una página web y entender todos los componentes a añadir las columnas correspondientes y personalizarlo con las opciones que te proporciona Elementor de manera nativa.

Esto consigue que sea muy rápido conseguir diseños sencillos, típicos de las webs que nos podemos encontrar por internet y conseguir buenos resultados rápido gracias a su amplia gama de plantillas y su comunidad.

Esa misma sencillez a la hora de construir con estos bloques limita lo que se puede llegar a construir a los bloques que incluye Elementor, tanto en la versión gratuita como en la de pago, teniendo que recurrir a código personalizado cuando busques una animación o sección más compleja de lo que sucede.

Como es una herramienta que lleva amplio tiempo en el mercado se ha desarrollado una gran comunidad de desarrolladores de Elementor que crean componentes y plugins para expandir las capacidades de Elementor de manera nativa.

Elementor free vs Elementor PRO

La principal diferencia entre Elementor Gratuito y Pro es el número de plantillas y widgets a los que obtienes acceso. Hay suficientes funciones disponibles con el plugin gratuito. Sin embargo, si estás buscando un conjunto más extenso que incluye opciones de supernicho, puede que quieras optar por Elementor Pro.

Esto añadirá widgets, plantillas y funcionalidades para que puedas desarrollar webs más profesionales.

Una herramienta sobre Wordpress

Lo que para bien o para mal condiciona a Elementor es que debe utilizarse sobre una instalación de Wordpress.

Esto significa que este plugin añade una capa extra sobre Wordpress que puede traducirse en una reducción de los tiempos de carga por añadir código redundante al proyecto, así como tener que lidiar con los aspectos más negativos de Wordpress (actualizaciones, backups, seguridad…).

En el lado positivo, se integra muy bien con la red de plugins existentes para poder ampliar las funcionalidades nativas de elementor por ejemplo con Restrict Content Pro para crear membresías, LearnDash para crear academias online o WooCommerce para tener E-commerces.

Sin duda es una gran herramienta para construir webs, pero con sus pros y contras:

Pros Elementor

• Cuenta con una interfaz intuitiva que facilita la creación de diseños complejos sin necesidad de conocimientos avanzados de programación.
• Es compatible con una gran cantidad de otros plugins de WordPress, lo que permite agregar funcionalidades adicionales a las páginas creadas con Elementor.
• Cuenta con una gran comunidad de usuarios y desarrolladores que comparten plantillas, widgets, tutoriales y recursos que ayudan a mejorar y personalizar aún más los diseños de página creados con este plugin.

Contras Elementor

• Aunque cuente con una interfaz de usuario intuitiva, el uso de Elementor al inicio puede ser abrumador, especialmente para aquellos que no tienen experiencia previa en diseño web.
• Hace que la web cargue más lenta al generar demasiado código para cosas relativamente sencillas (lo que hace que el HTML sea más pesado) y cargar en la web infinidad de recursos innecesarios que afectan a la experiencia del usuario.
• Genera dependencia. Una vez que tengas tu web desarrollada con Elementor, no podrás salir de él, ya que tu web pasará a ser inservible.
• Conforme quieras realizar alguna personalización un poco más compleja deberás pasar el plan PRO de Elementor, el cual puede llegar a ser bastante caro.
• Actualizaciones constantes que obligan al usuario al usuario a tener que hacer constantes cambios en su web para que se mantenga al día.

Pricing

Aunque la versión gratuita puede ser más que suficiente para una persona que esté empezando en sus diseños y esto sea muy atractivo para poder tener una web a un bajo coste (únicamente hosting y dominio), en cuanto buscas avanzar a un plan Profesional, debes recurrir a los planes de pago, contando con una manera peculiar de cobrar, porque está pensado para agencias que hagan muchas webs con elementor.

Cabe comentar que si creas 3 webs, puedes tener licencia en cada uno de ellos PRO por 99€.

¿Qué es Framer?

Framer es una herramienta de reciente lanzamiento que te permite construir páginas web y landing pages sin necesidad de código.

Aunque probablemente conozcas Framer de sus anteriores iteraciones como librería de animaciones, o herramienta de prototipado, ahora han pivotado al mundo de la creación de páginas web y han dado con la clave de cómo conseguirlo.

Crea webs sin código en Framer

Gracias a su constructor visual serás capaz de construir páginas web completamente funcionales y responsive en horas sin necesidad de tocar código.

A través de un enfoque drag&drop, Framer te permite construir cualquier diseño que tengas y convertirlo en una web completamente funcional de manera sencilla. A diferencia de Elementor, aquí puedes directamente replicar cómo funciona una web y añadir y modificar todas las propiedades que necesites de los componentes.

Es una herramienta pensada especialmente para ser fácilmente accesible a diseñadores, con una interfaz que recuerda mucho a Figma y que te permitirá reducir la curva de aprendizaje si vienes te ese mundo.

Crea diseños responsive de manera sencilla

La manera de crear webs que se adapten a todos los tamaños de pantalla de Framer es única, proporcionándote una visual de los tres tamaños a la vez para que puedas ver cómo se reflejan los cambios de manera inmediata en todos los dispositivos.

A través de su sistema de Frames, Stacks y Grids podrás personalizar el comportamiento de manera sencilla, explorando todo el poder de Flexbox y CSS Grid con una interfaz sencilla, además de contar con un potente gestor de estilos que te va a permitir crear páginas webs escalables y fáciles de modificar.

Construye webs optimizadas en Framer

La tecnología en la que desarrolla webs Framer es React, lo que permite que construyas páginas webs realmente rápidas al aprovechar al máximo las nuevas tecnologías que te permitirán que las webs salgan naturalmente optimizadas y no sea necesario mucho trabajo de optimización.

Esto tiene el contra de que luego es interpretado a HTML y CSS y no es código directamente escrito, lo que puede que no sea perfecto para todos los casos de uso.

Por contra, la ventaja es que puedes desarrollar componentes y código en React para añadir funcionalidades que no existan por el momento, lo que está potenciando un ecosistema realmente grande de contribuidores a la herramienta.

Pros Framer

• Publicación de los cambios instantánea. Te permite hacer cambios y darle a “publicar” para que puedas ver en escasos segundos los cambios efectuados en la web en tiempo real.
• Puedes crear páginas web funcionales muy rápido.
• Gran biblioteca de plantillas y componentes sobre los que diseñar.
• Facilidad de agregar animaciones y transiciones complejas.
• Te permite añadir código para agregar una mayor personalización.
• Te permite hacer páginas web responsive.
• Te permite crear páginas web en menos de 1 min. gracias a su inteligencia artificial

Contras Framer

• A diferencia de Elementor, Framer es una plataforma cerrada, todos los complementos, integraciones y plantillas pasan por el filtro de la empresa.
• Sobre todo al inicio se puede volver un poco difícil hacer páginas web responsive por el hecho de que no es del todo intuitivo.
• Llegado a un punto, es difícil escalar dentro de Framer dependiendo las necesidades del usuario.

Pricing

¿Cuál es la mejor opción entre Elementor y Framer?

En nuestra opinión, si lo que buscas es un herramienta con la que construir páginas web sin necesidad de conocimiento técnico, y además, con una buena personalización, rapidez en el diseño y unos costos bajos, Framer es la alternativa más atractiva.

‍