The new “next door” on the site builder scene is Zion Builder. Not very popular yet, but already has more than a million downloads. He touts being the fastest and cleanest compared to the other “popular kids” on the block, Elementor and Beaver. Also, it claims to be the easiest to use. In this report we reveal his resounding successes, and also the whole stretch that he still has to go.
Significant benefits
Clean Code
Lets start by the beginning. doIt is true that Zion evades the concept of "bloatware", or is it sloppy programming with heavy/redundant/useless CSS/JS code? Yeah Zion is really light: In fact, tests show that Zion Builder code, same layout in Elementor, is on average 30% lighter, if not lighter.
Speed & Performance
By taking care to place lines of code where it's not strictly necessary, and through careful resource usage and browser loading, Zion Builder scores excellently on Core Web Vitals. Posts and Pages made with Zion load only what is necessary for the post, and nothing else useless and irrelevant.
For example, Elementor loads an average of 160kb between CSS libraries and JS commands on each post. Zion, meanwhile, reduces these common resources to a 3kb. Honestly, it's impressive. The result is instant loading of content comparable to our beloved Gutenberg, the native WordPress builder.
Professional Personalization
In this case something positive could be taken as "negative" when we start using Zion Builder. The level of customization of each section has as much complexity as we are willing to absorb. In comparison, Gutenberg, whose per-Block configuration level is limited, looks like an abstract constructor like a cube.
Thus, it will take us a bit of patience to familiarize ourselves with the Zion Builder interface. At first glance it looks a lot like Elementor (with ways to do it that we find in Beaver as well). But as soon as we start pressing tabs and options we will see that it is really impressive how we can tune each element, use dynamic input, see each specific CSS name and modify it if that is what we want.
Capture: Advanced customization even allows you to choose whether an element is visible to everyone or only to logged in users
Editing Speed
The page with the editing interface, the same one that allows us to edit and view a composition in real time, load as fast as Gutenberg. At the opposite end of the spectrum we have Elementor, which even with fast internet connections and depending on the setting, often becomes lethargic and even offers us to edit in “safe mode”.
Thus, composing or editing a Page or Post is really fast with Zion Builder.
Theme Editor with Components
Zion allows us swap headers and footers between different areas of the website, which may also not be so easy to understand at first. We can create header, body, and footer templates, but also easily switch between them on different post types. It is a functionality that can be confusing at first because, perhaps, we have never had that possibility.. Our site may not require that feature either, but it's an interesting possibility nonetheless, giving rise to new ways of thinking about a site.
Constant Development
As it is priced —but it is also strategic with new products—, the developers behind Zion are very attentive to bug reports and requests from their user community. In fact, the updates are frequent and gradually achieve greater adoption of the builder. Just take a look at your Facebook page to see how that hornet's nest stirs.
Price
Zion Builder PRO's cost of $29/year includes all professional templates, blocks, icons, fonts, and even a special WooCommerce builder. If we are interested in paying only once, and even using it in more than one site (or in unlimited sites), the final cost is USD149
Zion Builder PRO is included free in our service of Managed WordPress along with over a dozen PREMIUM components worth checking out. It is the complete solution recommended for commercial and institutional professional sites.
Details that can improve a lot
The editor
While the editor interface looks like the dashboard of a superior race spaceship, it still suffers from quite a few bugs. For example, users have repeatedly reported that CTRL+Z, the command to undo the last action, has unexpected results.
For its part, the history panel does not work as expected either: it does not record all changes, and even certain modifications are not reflected in the preview, so we should refresh the page to be sure. this nowadays it is unacceptable in a builder that, to top it off, wants to be the fastest of all. Work slows down and immediacy is affected.
The good news is that developers are always working on fixing reported bugs, so hopefully Zion grow healthy immediately.
Steep learning curve
As we have mentioned before, that editing panel that looks like it came out of a NASA technology can be antagonistic for some admins. The possibility of changing everything, of affecting every aspect, element and container, tends to require a more thorough knowledge of what is intended and what is being done. Particularly, in terms of CSS programming.
Zion recommends that we are familiar with CSS on a general level, and with css flexbox in particular. It will not be possible to create a professional website without knowledge of how something that we touch in the interface is translated in terms of programming. Certain fields and options will be incomprehensible to a designer without certain prior knowledge. However, Flexbox is fairly easy to learn, and actually using Zion Builder can be a crash course in it.
If we intend to make a professional site from scratch, Elementor is a better option for not so advanced or even casual developers.
That said, and for those who like learning challenges, starting out with Zion Builder guarantees a much deeper understanding of programming and CSS libraries at the end of the day.
Accessibility (WCAG compliance)
WCAG stands for Web Content Accessibility Guidelines, Are the accessibility guidelines for web content. Unfortunately, at the moment Zion does not meet these guidelines. There are still no aria labels, nor are there indexes for the tabs. Nevertheless, the claim against this has been made and the status of said integration is currently in process.
Inaccurate preview on small displays
Unfortunately, in "low" resolutions (1080p and below), it happens that the toolbar forces the editing screen to look as if we were editing for mobile devices. In other words, designing for desktop with a proper desktop, but low resolution, is not possible. It is recommended to use Zion Builder with a monitor of 1920 pixels or higher resolution.
Font Awesome Icons
Modern constructors already include the versions SVG (vector) of the FA icons (read Font Awesome). But Zion Builder commits the inconvenience of loading the entire source, which reduces that careful performance that is in some ways one of the strongest legs of this builder. Why would we want to upload over a thousand icons to our site only to use a handful of them? No doubt this is an incongruous oversight in the otherwise polished code.
Conclusions
No one could single out Zion Builder and criticize it without a compelling reason: the work behind this builder is noticeable in every detail, in the effort to give us clean and very, very small code. Editing is incredibly fast for the amount and level of toolbar customization. The developers are attentive to comments, criticisms and proposals and respond immediately to everything.
Zion Builder is a builder that promises to become one of the most used very soon.
Although it still has its bugs and drawbacks, we have no doubt that it will be the source of inspiration for changes and improvements in its competitors. This new kid on the block brings new tricks and that will certainly generate movements and trends for years to come. We, the admins and designers, are delighted.
Hoping that you liked the note, we wish you success in your endeavors and we encourage you to write your questions in the comments section.
We remind you that Zion Builder is included in our service Managed WordPress, the Service specially equipped with ALL the best, Premium level, to create your business without the need for third parties or purchases of additional components.
Thank you for reading.
Leave a Reply