google.com, pub-2394874653903681, DIRECT, f08c47fec0942fa0

Website Performance: A Comprehensive Guide


We’ve all experienced that critical moment when you’re about to make a big purchase like a plane ticket or book spontaneous dinner reservations—and the page stops loading. Your heart quickly sinks as you wonder if the transaction went through and you panic that you’ll get charged twice. Ultimately the frustration settles in: You needed to book something and you lost your chance thanks to a page that simply didn’t load in time.


If you can relate to this rollercoaster of emotion, then you understand the importance of website performance when you create a website.


What is website performance?


Website performance measures how fast a website's pages load and display in a user's browser on any type of device, impacting overall interactivity and usability. Simply put: The faster a website loads and displays, the better it “performs.”

Server and platform infrastructure play a key role in site performance, but other factors can affect performance, like unintentionally overloading a website with content and images. In this guide, we’ll cover all the basics of website performance, plus share what you can do to monitor, support, and improve your site.

Tip: Wix sites now perform better than ever. Constant infrastructure enhancements—like continuous code optimization and automatic image conversions to WebP format—help sites load more quickly, regardless of your device or location.


Why website performance matters


Regardless of your industry or niche, think of website performance as the scaffolding for your online success: Many times, a good initial performance is all a visitor needs to ensure that they’ll not only interact with your site again, but possibly also convert into a customer. For example, if a website visitor experiences site freezing or content that takes even a second too long to load—they likely will not return to your site. This can have a long-lasting impact on not only your website, but how the public perceives your brand, too.


As Niya Noneva, Senior Solution Expert at Contentsquare put it in their 2022 Digital Benchmark Report,


“With people all over the globe suffering from online conference call fatigue and seeking to reduce their time behind screens, every second of user attention and engagement counts. Slow loading times are outside of the tolerance threshold of today’s busy, attention-deficient user. Customers expect website experiences that make it worth their while.”

Let’s dig a little deeper into why website performance is so important, it impacts:



User experience


As you create a website, it’s essential to consider how design affects performance. If a website looks amazing but is slow-to-load, erratically shifting, or slow-to-react, it’s likely your visitors will become impatient, frustrated, and even leave. This is because those aesthetic elements come at the expense of your site’s user experience. “Web performance is user experience,” says Lara Hogan, author of Designing for Performance. “As you design and develop a new site, you’ll consider many components of its user experience: layout, hierarchy, intuitiveness, ease of use, and more.”


By providing a user experience that factors in website performance, you give your website the best chance at ensuring business success.



Bounce rate and visitor retention


Website owners have an extremely short-time frame to make a good first impression on their site’s visitors—so it’s essential that their website performs well. Bounce rate measures the percentage of visitors who land on a website and leave after only visiting one page or without clicking any links. According to Google, if a page takes three seconds to load, as opposed to one, visitors are 32% more likely to bounce.



Conversion rates


If a user has a good experience with your smooth-and-speedy site, it’s likely they will stay on your site and click a few things. The experience may even prompt them to return to your site and buy something or request your services. According to Cloudflare, “The quicker a webpage loads, the more likely a user is to perform the targeted action on that webpage.”


However, a 2019 Portent study found the first five seconds of page-load time have the highest impact on conversion rates. Even just a one second delay will reduce conversions by 4.42%.



Brand perception


Keeping tabs on your website’s performance and overall appearance can signal to customers that you value their time and their spending. Just one bad experience with an underperforming website can influence brand trust and overall brand perception.


Imagine this: A member of a certain famous family posts an Instagram Story wearing your company’s branded sweatshirt. Another micro influencer then posts the link to your merchandise page, giving a call-to-action to their predominantly-Gen Z audience that not only is the branded sweatshirt available—it just so happens to be on sale. Thousands of high-intent visitors decide to click through to your site and spontaneously grab one for themselves but encounter a merchandise page that is slow to load. If these impulsive buyers are like 60% of their peers, it’s likely they’ll bounce if a website or app is too slow to load.


And it’s likely that the damage won’t stop there. Their disappointment could linger and affect how they see your brand: The same IBM study states that, “Companies that can’t meet Gen Zers’ extremely high expectations risk rapidly falling out of favor—and leave the way open to competitors.”



Mobile-first culture


On average, Americans check their phones 344 times per day—that’s once every 4 minutes, so it’s no surprise that 57.84% of all web traffic comes through mobile phones. Creating a high-performing mobile-first design that loads quickly is an important part of user experience. Mobile users likely browse your website as they commute or wait for their coffee, meaning distractions are everywhere and speed is of the essence.


Studies show that a 0.1 second improvement of mobile site speed increases conversion rates by 8.4% for retail sites. You can check out if your site is mobile friendly using this simple test.



mobile first culture impacts website performance


SEO


Performance affects not only how your user experiences your website, but it can also impact how visitors find your website in the first place.


Google’s Core Web Vitals (which we will get into below) are a part of the Google Page Experience (a set of signals to measure perceived user experience) and can impact how a website shows up on a search result page (SERP).


It’s important to note, however, that Google doesn’t consider Core Web Vitals as a key ranking factor.


John Mueller, Google's search advocate, said that, "relevance is still by far much more important."

“Page experience is just one of many signals that are used to rank pages,” he further explains. “Keep in mind that the intent of the search query is still a very strong signal, so a page with a subpar page experience may still rank highly if it has great, relevant content.”

For example, if your business ranks alongside a competitor for a query on a SERP, whichever site has a better performance may rank higher on the page.



Performance metrics


Site performance is measured by various speed and quality tests, including how quickly a website loads when a visitor arrives, how quickly it reacts to user interactions and how smoothly media like animations run. These tests are measured either in the lab, running controlled simulations, or in the field, using real users’ experiences and real measurements. Since there are so many tools and metrics to keep up with, Google’s Core Web Vitals initiative creates a unified and aligned industry standard to help websites focus on the most important metrics. While they are key metrics for measuring website performance, it’s important to note that they are not the only metrics that factor into performance.



Core Web Vitals


Core Web Vitals measure speed, interactivity, and visual stability using three signals:


  • Largest Contentful Paint (LCP) measures the time it takes to render the largest image or text block on the page.

  • Cumulative Layout Shift (CLS) measures all layout shifts during the entire lifespan of a page. A layout shift occurs anytime a visible element changes its position while the page loads.

  • First Input Delay (FID) measures the time from when a user first interacts with a page (e.g. by clicking on a link or button) until when the browser actually processes that interaction.


Tip: You can learn more about Core Web Vitals and Wix site performance including the difference between mobile and desktop scores.



Page load metrics


At their 2018 developer conference, Web Performance Made Easy, Google placed great emphasis on speed, saying, “Most users [75%] rate speed as being at the very top of the UX hierarchy of their needs.”


Page speed refers to how quickly content on your webpage takes to load. Page speed can be measured in several ways including:


  • Speed Index (SI), representing how quickly content displays during page load.

  • First Contentful Paint (FCP), measuring the time from when the page starts loading to when any part of the page’s content (texts, images and other graphic elements) render on the screen.

  • Time to Interactive (TTI), measuring how many seconds it takes from when a user lands on a page to the moment it becomes fully interactive (when users can click on buttons and otherwise engage with your site).

  • Total Blocking Time (TBT), simply put, measures the total amount of time your webpage was blocked, preventing the user from interacting with your page.

  • Time to First Byte (TTFB), measuring the time between the browser requesting a page and when it receives the first byte of information from the server.



Page load metrics


What affects website performance


To optimize your site’s performance, let’s dive into the parameters below you should consider:


HTTP requests


HTTP, or hypertext transfer protocol, requests structure how web browsers and web servers communicate. When you type a URL into your browser, you’re essentially asking your browser to request each of those page's files from the webpage’s host server. In general, the more complex a web page is, the more HTTP requests it has to make to load the full site, the slower it loads.


Generally, the fewer HTTP requests a site has, the better it performs. Things that can impact the number of HTTP requests include images, JavaScript, CSS files and third party tools.



Page weight


While the number of requests affects performance, so does the content actually being requested. Page weight, also known as page size, refers to a web page’s file volume—the HTML, images, or other media, JavaScript, CSS and third-party resources contained on the page. The heavier a website is, the more elements and assets that need to load on a page, the slower the page performs.


  • Image size: Images play an essential role in your website design. They convey brand messaging, captivate visitors, support blog content, and can even act as calls-to-action (CTAs). However, images weigh more than plain text HTML files, take longer to load, and therefore can significantly impact a website’s performance. To ensure the best performance, all images need to play a strategic role on your site and be optimized. Image optimization refers to the process of converting images into the smallest possible file size without compromising on the quality. You can use an image resizer tool to scale your images to the exact dimensions you want. You can then download them in either JPG, PNG or GIF file formats. It’s important to note that the best format in terms of performance is JPG, since JPG images can be up to 10x smaller than PNGs, and as a result, they can load much faster. It’s also the best practice to avoid GIFs, since these animated images tend to have large file sizes which lead to longer load times. Instead, try a video since it uses a smaller file size and can be viewed by a user before the file is fully downloaded. Tip: Every image added to a Wix site is automatically optimized and converted to modern image formats (like WebP) to ensure fast downloads and high quality. Wix sites also use “lazy loading” to optimize performance, so browsers delay loading content or media outside of a user’s initial view.


  • File size: The smaller the file, the faster to send and download. To improve performance, files can be “compressed” by a web server, or shrunk down as much as possible without losing information, then sent to a browser to receive and render them as normal. Tip: Wix automatically compresses all files using Brotli or gzip for faster, more efficient downloads.



Web hosting


Web hosting refers to the serving of a website’s files to a user browser. Different hosting options can affect your site's performance based on website size, traffic numbers and scalability.


Tip: Wix handles hosting for you, by serving all websites on servers in multiple locations around the world, automatically served and cached by CDNs, which ensures fast server response times, specifically Time To First Byte (TTFB).



Caching:


Caching is the process of storing data (either on the server or via a browser) where it can be more easily fetched in the future to avoid an HTTP request and response cycle.


For example, if you have an ecommerce website selling thrift store finds, you’ll have certain assets like your logo that appear in the same place on every page. Without caching, the page would have to download the logo every time a user clicked on a new product page. All Wix sites deploy automatic caching to all pages.



Geographic location


Even though it may feel like the omnipresent Internet exists nowhere and everywhere, the infrastructure that causes websites to work is not only tangible, but located all around the world. Each HTTP request has to travel from the browser to the server, and then the information has to travel back from the server and be delivered to the browser. The longer the physical distance data has to travel between servers and browsers, the longer the time it takes for a request and response cycle to complete. For example, a website hosted on a Seattle, Washington-based server would perform better for a browser request in Seattle than it would a request in Madagascar, because the data has fewer physical miles to travel.


To cut down the distance data needs to travel for requests, hosting providers also strategically-place servers (called proxy servers) around the globe as part of Content Delivery Networks. These servers host cached copies of web pages, images and videos and quickly respond to requests from browsers closest to them.


Tip: Wix hosts all sites on globally-distributed CDNs and data centers, plus automatically enables server-side caching, seamlessly saving it on our CDNs to ensure quick and efficient content delivery—regardless of location.



Browser plugins, extensions and third-party applications


Third-party add-ons give your website additional functionality by accessing data stored on another server. Since they require additional HTTP requests to these servers, they often are slow-to-load. To optimize performance, keep add-ons limited to only those that greatly contribute to the user experience.



URL redirects


Redirects forward website visitors and search engines to different URLS from the page they originally requested. They’re triggered when a browser sends an HTTP request to a server for a certain page URL that has been redirected to another page. The server responds to the browser’s request with the new page URL, and then the browser responds with a new request for that URL. Since it requires completing an additional HTTP request, it can negatively impact a page’s performance. Multiple redirect requests can be quite taxing on the browser resources and ultimately slow down page load time.


As your business grows and your online content changes, you may need to update the flow of your website using redirects. For example, let’s say you’ve created several blog posts covering the same topic and you want to consolidate them into one strategic post based on a topic cluster model. While redirects are often unavoidable and necessary for SEO, keep them as straightforward as possible to guarantee good performance.

Tip: Use the bot log reports to define issues/error codes, or Deepcrawl's app (costs money), to set redirects using Wix's redirect manager. (Go to your dashboard and click SEO Tools and click the URL Redirect Manager).



Best practices for checking website performance


The first step in checking your website performance is testing it.


Tip: Using the Wix Site Speed Dashboard you can view your site’s TTI (time to interactive), plus test, analyze and optimize your site’s performance for desktop and mobile. You can also monitor your loading speed per page, compare it to other competitor businesses in your industry, plus learn actionable tips to improve your overall user experience.





Before you start testing, consider the following:


  • Pay attention to your data source. Field data, or Real User Monitoring (RUM) data, is the most accurate measurement since it comprises data from your real users from real visits and reflects the actual conditions of your users’ devices, networks and locations. However, not all sites have sufficient traffic to get this field data, so they can use lab data instead. Unlike field data, lab data comes from a simulated environment. On mobile, specifically, the simulated conditions test on a low-end device with non-ideal network conditions, therefore they aren’t 100% accurate since it doesn’t necessarily equate to the real world user experience. While it’s less accurate, lab data comes in handy when you’re trying to see how a design change could affect your website performance. Let’s say you’re considering embedding a new gallery to your site and want to see if it has any noticeable effect on your website performance before you publish it. Since you can’t get field (RUM) results because the design is not live, use lab data to get immediate results to detect theoretical performance degradation for the typical user experience on desktop and mobile.

  • Pay attention to cache. For lab tests, results will change whenever you refresh. For each test, it’s recommended to refresh between three and five times and run an average to get the most accurate and trustworthy results.

  • Different tests give different results. Each test works differently and calibrates its own measurement and unique performance score. Also, when analyzing a URL, you’ll receive two separate reports—one for desktop and one for mobile. They will likely have different performance results due to processing capabilities, network conditions, website content that sometimes is different between desktop and mobile. To get an accurate result, try anywhere from one to three tests—just pay attention to the specifics of each test and where the data comes from to best understand why they may differ.





Google has several free tools that track site performance, including Google PageSpeed Insights and Google Lighthouse. Some other tools worth checking out include GTmetrix, Treo and Calibre.

Post a Comment

Previous Post Next Post