Improving your site's performance is an important part of the creation process, as well as ongoing maintenance. The guidelines in this article can help to enhance your visitors' experience, improving aspects such as responsiveness, fluidity, and loading time.
Understanding loading time
Site loading time measures how quickly your site fully loads after a visitor requests access, by either clicking a link or entering the page URL. Many factors can affect the loading time of a page. Some are site-specific, and others are related to your visitor's device and internet connection.
Sites that have been optimized and adjusted load faster than those that are content-heavy.
Optimizing your site can ensure an improved loading time, as well as a better score on performance tools like Google PageSpeed Insights.
How Wix measures loading time
Wix monitors and collects data for several metrics. These include Google's Core Web Vitals, and additional vitals such as FCP, TTFB, and TTI. You can view
your site's speed metrics from your dashboard.
Wix automatically collects this performance data in real time across our platform in order to monitor and improve your site's speed. We recommend following the best practices below to ensure an enhanced loading time for your site.
Loading order of elements
When building or updating your site, we recommend that you keep
the loading order of elements in mind, as they can effect your site's performance.
For example, elements that are interactive or content-heavy (e.g. videos and third party apps) tend to load slower than static or lighter elements, such as text and buttons.
Optimizing elements on your site
Optimize the homepage and elements like text, animation, and images for better site performance. Click an option below for more information:
Content that is above the fold of your site is loaded before the rest of your page. Adding meaningful, relevant, and light content to this section of your page ensures that site visitors have useful information to discover while the rest of the page loads.
We advise using static elements such as text, shapes, and buttons on your above the fold. As these elements load first, it'll enhance your site's loading time and performance.
What is 'above the fold'?
This is the section of your site that visitors see first, before starting to scroll down.
Images uploaded to Wix sites are automatically resized for optimization. We recommend using JPG images rather than PNG images unless you require a transparent background, as JPG images are better optimized for site loading time and performance.
Learn more about images and your site performance
Notes:
- Wherever possible, Wix automatically converts images to modern formats such as WebP. This format reduces download size while maintaining image quality.
- It is not possible to upload images over 25mb to your Wix site.
Videos are a great way to encourage visitor interaction and interest. We advise keeping loading time in mind when adding videos, as they generally have high resolutions and take longer to load than static elements.
Third-party apps and iFrames
The content shown in third-party apps and iFrames (e.g. embedded videos or social channels feeds) is delivered from external servers, rather than the Wix servers.
This means Wix cannot optimize them and therefore they may create an overhead on your site’s loading time.
We recommend putting them on secondary pages, with a button on the homepage that will direct your site visitors to them.
We recommend using no more than 3 or 4 fonts on your site, as this can enhance your site's aesthetic and give it a professional feel. Keeping the font styles within this number range can also improve site performance, as it reduces the loading time.
Furthermore, we also recommend avoiding the use of custom fonts where possible. System fonts load faster, which can improve your site's performance.
Learn more about fonts and your siteSpecial effects such as animations and slideshows can bring your site to life.
However, they tend to load slower than static elements, and we recommend keeping them below the fold of your site where possible.
Note: Animated GIFs must be downloaded in full before they begin to play. We recommend converting any animated GIFs that you want to use into a video.
Lightboxes load later than other elements of your site by design. We therefore recommend limiting the use of lightboxes across your site, and avoid using lightboxes as your page's main content.
Your site's DOM order is the order in which visitors using assistive technologies (such as screen readers) navigate through your elements.
In order to provide a smooth experience for these visitors and ensure the correct order of elements, we recommend manually adjusting the visual order of elements to match the order displayed in the Layers panel.
Optimizing your mobile site content
In general, mobile devices are not as strong or fast as desktop computers, and have a slower internet connection. Therefore your site might take longer to load when viewing it on a mobile device.
If your mobile site is loading slowly, we recommend following the below guidelines to optimize its performance.
Click an option below to learn how to:
Use the mobile Editor to optimize your mobile-friendly site. You can hide and adjust elements, and even add a welcome screen.
Mobile-friendly sites will look different to the desktop version, so we recommend adjusting it to fit your needs.
To access the mobile Editor:
- Open the Editor.
- Click the Mobile Editor icon
from the top toolbar.
Hide unnecessary elements
Some elements may not be relevant to your mobile site, and will significantly impact loading time.
We recommend being mindful of these elements. Avoid overuse of elements such as lightboxes and third-party apps, and keep only relevant and necessary content on your mobile site.
To hide elements from your mobile site:
- Click the element you want to hide.
- Click the Hide Element icon
.
Tip: Hidden elements can be viewed and re-added to your mobile site by clicking
Hidden on Mobile on the left side of the mobile Editor.
Large images may take a while to load on your mobile-friendly site. We recommend cropping or making your image smaller to prevent your mobile site's loading time being impacted.
To crop an image:
- Click the image in the Editor.
- Click the Crop icon
. - Drag the handles to crop the image.
- Click Apply.
Tip: Images can be resized by clicking the image, then dragging the handles to make it larger or smaller.
Reduce items in galleries and repeaters
Galleries and repeaters are a great way to display images and information on your site, however they tend to load slower than other elements like text or basic shapes.
As a best practice, we recommend reducing the amount of items in a gallery or set of repeaters on mobile. Only display relevant and important items and media, and spread them evenly across your site.
Welcome screens are a great way to introduce your mobile site's brand. This is the first thing site visitors see, while your site can fully load in the background.
To add a welcome screen:
- Click Mobile Tools
on the left side of the mobile Editor. - Click Welcome screen.
- Customize your Welcome screen using the options available.
- Click Done.
Use a supported system and browser
Wix sites are supported on different mobile operating systems and browsers. If visitors are having issues viewing your mobile-friendly site, they may need to update their system or browser.
Supported operating systems on mobile devices:
- iPhone: iOS 15 and above
- Android: 8.0 and above
Supported browsers on mobile devices:
Third party code
Third party code can provide important insight, tools, and features on your site. However, it can also impact your site's loading time and performance if not optimized.
