Recently, I conducted an extensive review of 12 Gutenberg block plugins. Even though Gutenberg — now called the Block Editor — has been around since 2017, I haven't used it much beyond converting classic blocks to rich text blocks. Beaver Builder filled my need for a page builder, and I didn't see much reason to switch. But as Gutenberg gathers momentum, I felt like it deserves a second chance. Plus, I was curious to see how Gutenberg stacked up (no pun intended) to the competition. Here's what I liked, and didn't like.
What I Liked
Towards a better publishing experience
Gutenberg completely revamps the WordPress publishing experience. Prior to Gutenberg, WordPress relied on TinyMCE to power the editor. The classic editor assumes the user works with words with an occasional image, while Gutenberg opens the editor up to all sorts of content via blocks.
When using TinyMCE, adding anything besides text or images was an awkward experience. You had the choice between raw HTML and shortcodes, and neither option was particularly user-friendly. With Gutenberg's custom blocks, the user is able to add custom content using context-specific UI controls. Elements such as tables and sliders can now be added and edited right inside the editing screen instead of another admin page.
The world of web publishing is no longer satisfied with text and aligned images. It now demanded flexibility, responsiveness, and interactivity. Gutenberg is here to tackle that problem. While it may not be perfect, it is a giant leap in the right direction.
The JavaScript Revolution
The release of Gutenberg followed another major update to WordPress, namely the addition of the WordPress REST API. These two releases signaled a new paradigm shift in WordPress development. Prior to this, WordPress developers worked primarily with PHP with some Ajax. The advent of the REST API allowed developers to work with WordPress data without ever touching PHP. The introduction of React into Gutenberg brought JavaScript front and center in WordPress' architecture.
Personally, I welcome the move to embrace modern JavaScript. The addition of React means that front-end developers who dislike working with PHP can still find a niche in WordPress development. Diversifying the developer community also means new ideas and more innovation. It opens WordPress up to possibilities that were previously unattainable.
JavaScript development isn't without its drawbacks, of course. Personally, I'm not particularly fond of the massive toolchain required to write modern JavaScript, or the rapidly-changing standards that presents a steep learning curve for beginners. But JavaScript is here to stay, and it has proven its versatility. If learning JavaScript means I can apply it to multiple platforms, then I'm all for it.
What I Didn't Like
Identity Crisis
Back around 2016 and 2017, WordPress was already enjoying a dominant market share. Even as WordPress was eating up the competition, it was clear that the classic TinyMCE editor wasn't capable of handling complex layouts. Using shortcodes to display columns was a hot mess and encouraged theme lock-in. It was also evident that sites like Medium and Squarespace were offering a better writing experience. On the WordPress side, the core editor looks woefully outdated as more users began adopting page builders such as Elementor or Beaver Builder.
When Gutenberg was released in 2017, the similarities to Medium and Squarespace were hard to ignore. Sure, Medium was gaining in popularity at the time, but the decision to mimic Medium's interface seems shortsighted to me.
Medium's UI lives within an opinionated framework. There is flexibility inside well-defined boundaries. Yes, you can choose between image sizes, but you cannot change the font, the margins, or other settings that might fundamentally affect the site's design. It is clear that Medium's editor is just that, and not an actual page builder.
WordPress is now grappling with Gutenberg's identity. Is it an advanced editor, or is it a page builder? Right now, there is a big push towards full-site editing using Gutenberg. We know that a Medium-style UI works as an advanced editor, but can it work as a page builder?
Uncanny Valley
Though not exactly billed as a WYSIWYG editor, Gutenberg offers just enough preview power that it can be confused as such. I don't think WYSIWYG is an explicit, stated goal of the Gutenberg, but all the development around it seems to imply that it is, or will become, a WYSIWYG page builder.
In my opinion, one of Gutenberg's biggest user interface barriers is what I call the "uncanny valley" of WYSIWYG editing. By definition, the editing preview of a good WYSIWYG editor should look very similar to, if not exactly like, the final layout. Gutenberg faces several hurdles in achieving a useful WYSIWYG interface.
First, WYSIWYG in the editor is dependent on the active theme supporting editor styles. A good theme adds editor styles to help achieve WYSIWYG, but with Gutenberg it's not as easy. Not all themes provide proper admin styles, and this creates an inconsistent editing experience that is outside Gutenberg's control. Most other successful page builders bypass this problem by doing their editing on the frontend.
Second, the Gutenberg UI can be frustrating at times. Placed elements and drop targets lack clear, visible boundaries to help guide the user. For example, when working with multiple columns, you get floating “+” icons that look like orphans:
When moving blocks, your only visual guide is the presence of a thin line. There is no sense of where you are in the document, and the lack of a clear drop target makes the exercise extremely frustrating:
Finally, during my review of the major Gutenberg plugins, I consistently found UI bugs that hamper the editing experience. It wasn't clear whether these bugs originated from third-party plugins or from Gutenberg itself, but the fact that a number of them share the same bug makes me wonder if it originated from core.
Building for the Future
With full-site editing on the horizon, I believe Gutenberg needs to transition to a true WYSIWYG editor as the next step. While I may have my gripes with the Gutenberg UI, I am optimistic about Gutenberg's future. Gutenberg has expanded WordPress' horizon, and like WordPress, it will continue to innovate and adapt.
Top comments (2)
Big agree on the uncanny valley bit.
From a Wordpress theme developer point of view, I love gutenberg. It allows me to easily make complex block types that clients can easily insert and edit to their liking, visually. That was hard to do back when you had just some custom fields or shortcodes — you where stuck with a template that maybe could display some metadata, but it was hard to insert inside a post without the content looking weird.
A common complaint I heard from clients is that they wish they could edit more, like the color of buttons or the width of an image. These are things that gutenberg solved very well. I definitely agree that it’s not there yet, and things are still fiddly and wysiwyg is not really there — but for me, it’s a big deal that made things easier.
Yup, and it really is changing how themes will work. Most of my clients have transitioned to Gutenberg fairly well. Granted, right now they are only using Gutenberg for blog posts.