Everyone who’s been working with WordPress has to know about the Gutenberg Editor. It represents a major shift in direction compared to the classic editor that’s been used for years.
There are some crucial differences between the two, which leads to situations where one is better than the other. We’ll go over these differences and situations to give you some insight when you’ll be better off using either of them or maybe even a combination. Taking into account that generally visual editors tend to provide very similar features, the focus will be from the Gutenberg perspective.
Frontend/backend editing
The main selling point of visual editors is frontend editing. The drag and drop nature of the editor enables you to see all the changes while you’re making them, meaning you’ll instantly get to see what your visitors will be seeing.
Gutenberg is similar in the sense that you’re also inserting various elements in blocks, but it’s a pure backend editor.
If you want to see how it looks, you’ll need to check the preview. The way Gutenberg is evolving, however, it’s a realistic assumption that the end goal is a frontend interface. Until we do get there, visual editors are a tad easier to use and have the added feature of the instant preview.
Styling and layout
Styling options in Gutenberg, just like the classic editor, are entirely dependent on the theme you’re using. Granted, there seem to be millions of them out there, so you’re bound to find something that works, but your page layout is limited by the overarching theme you’re using – that includes headings, menus, etc. Visual editors aren’t bound by these restrictions. You can create an overarching theme that’s applied to all pages, but you can also use a different style for each one individually.
Furthermore, there are more customization options available with visual editors.
Using Gutenberg, you’ll get to change some general characteristics of a block like the size and background color. On the other hand, visual editors will let you tweak practically every aspect of every individual element, enabling you a much higher level of customization.
Various visual editors even tend to have unique styling features that are prominently marketed as special features. Much like with the backend editing progress is being made constantly with expanding current features and adding new ones. In the long run, the differences are bound to lessen more and more.
Third-party content
For both Gutenberg and other visual editors, core functions and features can be greatly expanded by incorporating various add-ons from third-party developers. As you would expect, Gutenberg holds the upper hand in this instance. As the WordPress default editor, the vast majority of plugins that are released are compatible, and there is truly a large number of them that affect specifically Gutenberg in some way. Because there is so much content out there, the variety on offer is staggering. We honestly can’t think of something that you could need and won’t find in the WordPress repository.
With visual editors, the situation is somewhat different. It essentially boils down to popularity and usage – the more popular a visual editor is, the keener other developers are to put out content for it. This works great if you’re using something like Elementor, but if you deviate from the mainstream products more than you should, you’re in for a surprise once you find out how little support those other options have.
Code
The differences so far were more or less surface deep. If you dig deeper, however, you’ll probably find the biggest difference between Gutenberg and visual editors – the underlying code.
Gutenberg, as a core part of WordPress, has a uniform, standardized code format that is known and can be used in any form and by anyone that knows their stuff.
Once you’ve mastered the process, you can that repeat it numerous time again and again. In addition to being standardized, it offers many more possibilities than your generic visual editor that makes sacrifices in order to keep things simple.
This is actually the main drawback – the knowledge threshold is much higher when you have to build something from the ground up through code, instead of dragging and dropping elements. Furthermore, where coding from scratch is universal, visual editors tend to have their specific coding methods that you don’t even see until you look under the hood. All the styling and customization we’ve mentioned earlier could actually be a bloated mess you won’t be able to dig yourself out of. Even if you do get so familiar with one editor that you know it inside and out, switching to another one means going through everything over again. You can imagine how working on multiple projects for several clients, all with different editors in place, can be virtually impossible to pull off.
Synergy
Who says you can’t have the best of both worlds? It does take some getting used to, but there is a fair number of visual editors that support working directly with Gutenberg. When looking for the perfect visual builder to use with Gutenberg, you’ll need to find one that can be integrated into Gutenberg without much fuss. You’ll then be able to insert blocks relating to the visual editor into Gutenberg. Essentially you’ll be using Gutenberg for the general layout of the page and the base code that goes with it and the visual editor for customizing all the elements you’re adding. Granted, the code will probably still be less than optimal, but at least the general outline will be in a standardized format, with only the styling options being specific.
Summary
We’ve thrown a lot of information your way, but you’re still probably wondering when you should use one over the other. The answer is situational and depends on your starting point and what you want to achieve. If you’re a developer that creates and maintains sites for others, there still isn’t a better option than pure coding – everyone in the field knows it, and because it’s standardized, you’ll get to reuse it again and again. In case you’re the do it yourself type and for any reason need to create and manage everything, but simply don’t have the knowledge to do it from scratch, by all means, give visual editors a try, or even combine both if you’re so inclined.
Right now, Gutenberg and visual editors are hardly the same things, even though they do share some similarities. The way things are progressing, Gutenberg could, over time, be more like a visual editor, but we’re a long way until one cancels the other out. Depending on your situation, you should look to use the best of both choices right up until one really does completely take the place of the other.