Skip to content

Optimize your website

This page shows a set of changes you can make to help your site load faster and run more smoothly.

You don't need to do everything at once. Each optimization stands on its own, and the badges below each heading show how much work it takes and how much difference it makes.

Before you begin

These changes are made in the page editor. Open a page and keep the editor open as you work through the steps.

Work on one page at a time, and preview your changes before you publish. If something doesn't look right, you can undo it before it goes live.

Structure your pages efficiently

How a page is built has the biggest single effect on how fast it loads. A page made of fewer building blocks renders quicker for your visitors.

  1. Build layouts with Containers, and let a single container hold several widgets.
  2. Avoid wrapping every widget in its own container. This adds hidden layers that slow the page down.
  3. Remove Spacer and Divider widgets. Add spacing with a container's padding and margin settings instead.
  4. Combine related text into a single Text Editor widget rather than stacking separate Heading and Text widgets.
  5. Set responsive options on one widget for mobile and desktop, rather than creating two copies and hiding one.

A rough guide to page size

Around 30 to 50 widgets per page is normal. If a page passes 100 widgets, it's usually a sign that some can be combined.

  1. Upload the resized version.

Uploading a much larger image than needed slows the page down, even after the builder compresses it. Starting with a correctly sized file is what makes the difference.

Manage your fonts

Fonts have to load before text can appear in its final form. Fewer fonts, and fewer variations of each, means less to load.

  1. Limit the site to two or three font families. A common setup is one font for headings and one for body text.
  2. Load only the weights you use, such as regular and bold, rather than the full range.
  3. Store your fonts on your own site using the builder's Custom Fonts feature instead of loading them from an outside source. This removes an extra connection the browser would otherwise have to make.
  4. Turn off the builder's default fonts and colors when your site uses its own, so nothing loads that you aren't using.

Keeping text visible while fonts load

The builder's default setting keeps your body text visible in a fallback font while your chosen font loads. This is the right choice for regular text. Icon fonts are the one exception, where it's better to wait briefly for the correct icons to appear.

  1. When you need an exception, add it as a new named style within the global system rather than overriding a single widget.

If you find yourself overriding the same style on many widgets, that's usually a sign the global setup needs a new entry rather than repeated one-off changes.

Handle icons and graphics well

Icons and small graphics can quietly pull in more than they need to.

  1. Use the builder's own icon widgets. These place icons directly in the page rather than loading a whole icon font.
  2. For a one-off icon or a logo, upload it as an SVG file instead of loading an entire icon library for a single symbol. SVGs load as images, add no extra request, and stay sharp at any size.

Note

Font Awesome Pro icons are an exception. To have them load efficiently, set the Font Awesome kit to SVG mode in your Font Awesome account.

  1. Remove any animation that doesn't guide a visitor toward something that matters. It usually costs more than it adds.

Be deliberate with add-ons and embeds

Content and widgets from outside sources each bring their own code to your page.

  1. Prefer the builder's own widgets over ones from external add-on packs. Add-on widgets load their own styling and scripts and are a common hidden cause of slow pages.
  2. For embeds such as videos, maps, or chat, use a preview image that loads the full content only when a visitor clicks it, where that option is available. Each embed otherwise loads outside scripts as soon as the page opens.

A note on plugins

Plugins extend what your site can do, but each one can add its own code to your pages and slow them down.

  • Activate only the plugins you genuinely need.
  • Deactivate plugins you no longer use.
  • Before activating a plugin, check whether a feature already built into the builder covers what you need.

More plugins is not better. A shorter list keeps your site faster and simpler to maintain.

Where to start

If you only make a few changes, the ones with the highest Impact are the best place to begin: structuring your pages efficiently and keeping your images the right size. Both make a noticeable difference and don't require deep technical knowledge.

You can work through the rest at your own pace. Preview each change before you publish, and stop whenever your site feels fast enough for you.