Nashville Web Design | WordPress Page Builder vs Custom Code

I get it. Writing custom code is hard. It takes longer. It’s expensive. You can get a template code builder off the shelf, drag and drop a few things, and boom, you’ve got a pretty design. 

There are so many page builder choices out there like Visual Composer, Elementor, and Beaver Builder is a common choice. It makes it really easy to build a website or a page without knowing any HTML or CSS. You simply install the plugin, activate the license, and you are on your way. You can create reusable sections like a header and footer. Saving those sections and putting them on certain pages like the blog layout lets you get the style you are looking for pretty quickly. Also much cheaper because you don’t have to know any code.

We don’t dislike these editors but have often helped our clients that already use them on sites that were not done by our Nashville web design company. In some cases, we have installed Site Origin so clients can more easily edit the content of the pages themselves. The difference is the output of the code and the quality of the code on your site.

These editors have to protect their output to make it consistent. So, when you drag an element to use, like a set of 3 columns, and then drag something inside of it, each element has to be able to handle its own design without interfering with other elements. What this means is that you end up with a lot of nested code and long, custom IDs on each element. Google says that good practice is that a page is no more than 1,500 nodes of code. Most pages with these types of editors end up having well over 6,000 lines of code. That’s quadruple the recommended code.

In addition to these editors outputting a lot of code, some of the code is poor quality. This can make it harder for other plugins to work with the code. It isn’t because the editor is bad or the writers don’t know how to code. It is simply that each block of code that is outputted has to look and be consistent. Other parts of the page can’t interfere with it or it wouldn’t work so easily for the designer who is using it.

These editors make a lot of assumptions. Nashville web design knows how dangerous assumptions can be! They give you so much freedom but with it comes a lot of code that you don’t need. Worse, it’s code that your customer doesn’t need. What happens is the editor is going to try to let you do anything you want to do. That means if you want to change a section to some color it will give you access to all the colors to select. And if you want to add images and background colors inside that section you have that ability. The code ends up with a bunch of variables and if statements that account for these scenarios. Your customer gets the heavy load of all that code but only sees the output you build, which is usually not well constructed or poor quality code.

Our Nashville web design company has seen how common it is today for there to be featured blog posts or news articles in a section somewhere down the homepage. When you use a tool like Beaver Builder to insert those blog articles into the page it writes something called a query. The query has to be general enough to get all the information you could want to show the customer. The problem is your customer doesn’t need all the information. This ends up creating a lot of extra load on your server and slows the page down. We see slow queries all the time in these situations.

Google wants your page to be fast. They reward quick websites with higher search rankings and more traffic. So when you complicate a page with a builder and write bad code it slows the page down and potentially decreases the search traffic.

Some designers want to solve the problem of a slow website with a caching plugin. These plugins basically make a copy of the language to build the page, like the HTML and CSS and reduce the server load to go through the whole WordPress framework. For instance, instead of having to go through all the files, read the database to get the content, and create what you see when you visit it in your website browser, it copies the code that is output in your browser and saves it for your next customer. This is great because it reduces all the server resources. The problem is that if that code is long, inefficient, and dare I say bad, your customer still ends up being served with a huge file that isn’t optimized. We’ve often seen images that the customer doesn’t even see are still served. Or metadata, think like attributes of a blog like an author and date published, are served but they don’t even show up on the page. It’s just slow and inefficient.

At Bennett Web Group, a Nashville web design company, we write custom code for our websites. We’ve already talked about some of the drawbacks of page builders like Beaver Builder or Visual Composer so let’s talk about an alternative – custom code.

In most cases, your website will not be completely redesigned once it is done. The benefits of the page builder show up when the site is first built. It is true that it gets done quickly but it is also true the quality is worse. Once the site is done, those benefits mostly go away.

For instance, let’s say you have three columns on a site with benefits your company offers. A few months down the road you have a fourth benefit that you just have to have on the website. With a page builder, you would edit the column widget to change that from three columns to four, add an image widget to upload your icon, add a text widget to create the title, and possibly a rich text widget to create the content that sits underneath the title. You haven’t touched the site in months so you have to remember how to do this and drag and drop multiple widgets to make it work. On the other hand, if you’ve got custom code like our Nashville web design company does, you’re most likely going to change the column class from three to four, copy and paste the column three code, and edit the content to meet your needs. From a maintenance standpoint, it’s potentially less work. And the output is better.

In summary, if you have a designer on staff and plan to frequently change your page content or alter the design you may want to use a simple page builder like Site Origin. But in most cases, custom code is easy to work with and offers a better customer experience than a page builder. If you need a Nashville web design company to help you with custom code that Google and your customers will love just schedule your free consultation today.