A page builder is a visual editing tool that lets you design web pages by dragging, dropping and arranging blocks such as headings, images, buttons and columns, and seeing the result as you go. Elementor, Divi, Beaver Builder and WPBakery are the best known for WordPress; Wix and Squarespace work on the same principle as complete platforms.
How a page builder works
A standard theme controls layout through templates written in code. A page builder adds a layer on top. You build a page from sections, rows, columns and widgets, set spacing, fonts and backgrounds through menus, and the builder turns your choices into HTML, CSS and JavaScript when the page is shown.
WordPress also has its own native editor, the block editor, which has grown into a capable layout tool with patterns and full-site editing. It is not usually called a page builder, but it does much of the same job with less extra code.
Builders store layouts differently. Elementor keeps its own data alongside the post. Divi and WPBakery have traditionally saved content as shortcodes, bracketed tags inside the page content, which means that if the builder is switched off, those pages fill with code instead of a layout.
Why it matters
Page builders made it possible for small UK businesses to change their own websites without paying a developer for every edit, and that is a real benefit. A sole trader who can update an offer page on a Sunday evening will keep the site more current than one who has to wait for a quote.
The cost is weight. Builders load their own styles, scripts, icon sets and animation libraries, often on every page, and wrap each element in several layers of HTML. That can slow first load and make pages feel sluggish to tap on a phone, which shows up in Core Web Vitals. Recent versions of the main builders have cut much of this, so how a site is built matters as much as which tool is used.
Builders also make it easy to get structure wrong. When headings are chosen for their size rather than their meaning, a page ends up with three H1s and no H2s, or with every section title as an H4, which makes it harder for search engines and screen readers to follow.
Common mistakes
- Building separate desktop and mobile versions of a section and hiding one, so the same content loads twice.
- Heading levels picked for looks, not for the outline of the page.
- Loading every font weight, icon pack and animation whether the page uses them or not.
- Installing a second builder for one feature, doubling the code on every page.
- Choosing a builder that leaves shortcodes behind, making a later redesign far more expensive.
- Unlicensed or out-of-date builder add-ons, a common security weakness.
How to act on it
If you already use a builder, check one important page in PageSpeed Insights and look at how much unused CSS and JavaScript it reports. Turn on the builder’s own performance settings, such as loading only the assets each page needs, and remove add-ons you do not use. Review headings on your main pages so that each has one H1 and a logical order beneath it.
If you are planning a new site, decide whether the block editor and a good theme can do what you need before adding a builder. Weighing those choices against your content, your budget and who will edit the site is part of a website redesign project.
