Do a quick Google search for drag and drop styled WordPress themes, and you’ll find more than you can count. Then, there are WordPress plugins that enable the creation of pages via drag and drop enabled editors.
A drag and drop editor contains icons of all kinds of content elements, right from text boxes to cool widgets to add social share buttons. If you compare a drag and drop editor to the conventional method of designing pages using HTML5 and CSS, it’s obvious that the former has undeniable advantages. Writing long blocks of codes is tedious. Then, entrepreneurs and businessmen have to hire web developers and programmers to get their websites done via code. Plus, it’s difficult to extent the website and update it later on, when it’s based on legacy programming.
Drag and drop, on the other hand, is just about, well, dragging and dropping content elements to desired positions on the screen, resulting in good looking web pages. However, a deeper comparison indicates that the choice might not be too simple after all. Here, we will deep dive into the basic nature of drag and drop editors, and discuss why you might have several reasons NOT to choose a theme or plugin based on drag and drop.
The Problem of Proprietary Codes
WordPress doesn’t offer drag and drop editing by default as best website builders do. So, you always have to use a drag and drop enabled theme, or need to install a plugin that gives you an editor interface where you can design a page by dragging and dropping content elements. In most of these themes and plugins, several short codes are used to generate more complicated and advanced DOM structures that are responsible for creating elements such as rows and columns, containers, and even widgets.
Now, each theme or plugin could have its own proprietary mechanisms of creating short codes. Put simply, this implies that your theme and plugin powered drag and drop designed pages will have highly proprietary code. Making any changes and tweaks in the layouts via code editing, in such cases, becomes a tricky affair because of precisely this reason. So, a few months down the line, if you identify a required feature that the theme or plugin does not offer, you will not have the option to slightly tweak the code and get things done. You will need to request the original creators of the theme of plugin to help you out, which is generally time consuming and expensive.
Even making the move from one theme to another will become highly frustrating, because the core mechanisms of backend code generation will, in all likelihood, be entirely different. In events where the original developers cease supporting their theme and plugins, you will literally be stuck with an obsolete design!
Complicated Code With Lots of Nested Nodes
All web development and programming languages have their generally accepted best practices that programmers follow while creating the code. These best practices are aimed at making the code clean, intuitive, and easy to understand. Any website issues could necessitate the study and debugging of codes, and in such scenarios, clean code makes the analysis quick and accurate.
Alas! These best practices are not exactly followed by the 3rd party teams and individual developers who create drag and drop powered themes and plugins. Most of such themes and plugins result in heavily nested codes with super complicated node structures. In such thick codes, drilling down to the relevant sections becomes time consuming and energy draining for even veteran developers. Also, large number of nodes can make the website load slowly on most browsers, because of the additional time taken to render the website’s content.
Impact on Page Load Speed
Speed of website loading is a critical success factor in the competitive era of cyberspace. Attention spans are at all-time lows, and slow loading pages could spell doom for your website. Unfortunately, several 3rd party drag and drop styled themes, and drag and drop styled editor plugins are guilty of slowing down your website.
Because of overuse of proprietary short codes, the number of code translations required to render the website increases, which causes intermittent loading problems, and pushes loading speeds down. Here are the 3 technical flaws that most of these themes and editor plugins suffer from:
1. too many style sheets used to realize nuanced layouts and styles
3. excess of code lines of inline styles
The impact of the un-optimized code on the page load speed can be significant, and the extra second can be the difference between a sale, a conversion, and a query. No style can justify a compromise on website loading speed. Identifying a theme or editor plugin that brings in the advantage of professional style without the accompanying impact on loading speeds, however, is difficult.
The Risks Around Support and Upgrades
WordPress has undergone several improvements in the past, and the process is a continuous one. Whereas it’s a fair assumption that WordPress’ core will not alter so much as to make existing 3rd party plugins dysfunctional, it can certainly happen that a core upgrade will change the way a plugin works. In such a scenario, it becomes the responsibility of the plugin developer to solve the problems faced in the plugin’s working. However, who can guarantee that the plugin developer, for starters, will be interested in continuing the support!
Secondly, nobody can guarantee that the developers will be able to solve the problem. Thirdly, when WordPress adds a whole new functionality sometime in the future, you’d ideally want the developers to upgrade their themes and plugins to leverage the updated features. This, unfortunately, is always a risk with 3rd party themes and plugins. One safekeeping option you could have is to opt for products from developers with proven track record, good reputation in offering support, and with lots of existing customers.
The Design Outcomes Are Clunky, Way Too Often
As counter-intuitive it sounds, getting that perfect layout via a drag and drop powered theme or a drag and drop editor plugin is not easy. Page lines, visual composers, headway, excess icons, content elements that web designers never knew existed – all these factors create clutter, which is cancerous for something as focused as an attempt to create a professional looking website. No wonders, then, that many outcomes of editor plugin powered web design are clunky, disorganized, and amateurish.
Obvious visual discrepancies and design bugs spoil the end user’s experience, and cause irreparable damage to the reputation of the website. The reasons for this are plenty. For starters, most of these tools don’t offer a reliable quality and testing environment where designs can be extensively tested. Then, issues related to cross browser compatibility cause designs to load in awkward manner on certain browsers. Thirdly, because the designing is now not done by an expert web designer, there is little to no planning in the choice of colors, fonts, shapes, dividers, layouts, etc. Because of the ease of trying out so many combinations of design elements, amateur designers end up creating websites with jarring visuals, with little focus on enhancing user experience.
It’s Just Not Native
Nothing beats the seamlessness of a design that uses native WordPress UI. In other cases, that is, for most 3rd party drag and drop themes and editor plugins, content elements such as tabs, buttons, banners, and complete interfaces look odd and mess up the user experience. Long story short – nothing beats the cohesive appeal of a website designed using native WordPress elements. Then, we can’t rule out the possibility that WordPress could well add a native drag and drop editor functionality in the near future. The move towards this is evident from the enhancements done in Widget customizer, and could soon reflect in the post editor.
Heavy Markup And Non-Semantic Code Impacts SEO
WordPress website created using drag and drop powered themes and editor plugins are generally heavy on markup and non-semantic code. Now, advanced SEO algorithms also rate websites based on the code’s SEO friendliness. These drag and drop styled website, in many cases, end up with significant code bloat, which doesn’t sit well with SEO algorithms, and can hurt the ranking of the website. Even when you deactivate the plugin sometime in the future, the code bloat does not go, which leaves your website permanently handicapped in terms of clean coding.
There are so many drag and drop styled themes for WordPress, along with plugins that create such editors, that the option of traditional manual code based web design doesn’t even register in the minds of the modern website creators. However, the benefits of drag and drop can’t be viewed in isolation from the design, code, page load, and SEO impacts it creates. In this guide, we’ve lifted the veils off several facts about drag and drop. Eventually, your choice of methodology of creating your WordPress website has to be made with clear understanding of what you have in front of you!