Core Concepts

Page Speed Checklist

The Madness Behind The Methods

Comprehensive page speed optimization is the product of many interrelated strategies and techniques that work together to contribute to overall performance.

Get started with a conceptual background on page speed optimization to help maximize loading speed, improve user experience and create a more effective sales platform.

Load Time

One of the primary measurements of website performance, load time is the time elapsed between a user action to navigate to a website and when the website is loaded, visible and ready for user interaction. The benefits of optimizing website speed and minimizing load time are broad, affecting nearly every step in the path to sales for both short and long-term success.

This very scientific graph illustrates the impact of website performance on sales.

Improving website speed is a solution to a problem that continues to emerge as the internet continues to evolve. As websites have become more feature rich, they have also become more complex, with larger and more numerous files resources. As these files add up, load time slows down and that's bad for users and therefore bad for business.

The Mobile Factor

Another major factor driving the need for improved website speed is a strong shift toward mobile internet usage. Slower mobile networks magnify the effect of under-optimized websites and the resulting need for performance optimization.

User Experience

Why is load time such an important factor in the path to sales? The answer is user experience. Together with other considerations like interface design and content structure, load time impacts users' ability to quickly and efficiently find what they need or complete a task.

Browsing Speed

Navigation is often the most obvious way performance affects user experience. Websites that load quickly allow customers to click from page to page at a natural pace and move through the sale process without delay. If pages load too slowly, customers can become impatient and frustrated. Cart abandonment is an important metric in the ecommerce industry, influenced in part by load time.

Website performance can affect user experience in less obvious ways as well. Unlike on-site factors like design and content, the influence of load time on search engine visibility and traffic retention means that performance has a role in user experience even before customers reach a website. If customers aren't able to find a website in search results or it loads too slowly, any further customer relationship or sales is stopped in its tracks. User experience begins the moment potential customers perform a search or click a link to a website.

User Engagement

Another key factor affected by load time, user engagement is often measured by the number of pages each user sees during a visit to a website as well as how much time they spend on each page and how many times (and how often) they return. Particularly for web-based businesses like ecommerce, user engagement can have a very direct impact on sales.

Performance Goals

The importance of load time is part of an evolving consumer expectation of readily available and efficiently-delivered information. Mobile and WiFi internet speeds continue to increase, mobile devices have become commonplace and tools for searching, organizing and consuming information become more sophisticated and accessible by the day. Users expect information fast and it's in business owners' best interests to meet that demand. For websites this means minimizing load time, but what exactly is the goal? How fast is fast enough?

Load Time

Websites should load as fast as is reasonably possible, in balance with content, features and the needs of the user. Statistics on browsing habits illustrate a clear correlation between load time and successful progress through the path to sales. Traffic retention - sometimes measured as bounce rate - is a prime example. Users will abandon a website if too much time passes before the page is visible and functional, at a rate that increases with each moment of delay.

The exact numbers will vary with network conditions, but ideally the initially-visible elements of a website should load in under 2 seconds with a maximum limit of 4-5 seconds for data-heavy pages or slow internet connections.

Websites should load in under 2 seconds.

Page Weight

Load time is highly dependent on internet connection speed, so in addition to time, it's also important to establish a goal for the quantity of data needed to load each page, often called page weight. Lower is better of course, but for most pages the initial-load page weight should be under 1MB (megabyte).

Page weight should be less than 1 megabyte.

1MB transferred over a reasonable 5Mb/s internet connection (5 megabits per second - equivalent to a good 3G connection) yields a load time of 1.6 seconds. This simple calculation doesn't take into account factors that can make loading slower (like network latency) or faster (like CDN file caching) but even with some padding, 1MB should yield a load time under 2 seconds for most users.

While landing pages should be fairly strict with these goals, it's reasonable to anticipate some exceptions, like interior pages that are less likely to be visited directly or pages with a lot of content like images. However if some pages become too large and slow, it may be worth finding a logical way to break the content into separate pages.

Perception Of Speed

Load time and page weight are good general indicators of performance, but it's also important to leverage the perception of speed. This can be achieved by prioritizing the parts of each page that users see and interact with first and has the added benefit of limiting differences in perceived load time across variables like internet speed.

Above The Fold

Above the fold is a term that originated in print design but has carried over to the web and refers to the content of a page initially visible in the browser window before scrolling. (Sometimes also called "above the scroll".) Prioritizing above-the-fold content typically involves restructuring some HTML, CSS and JavaScript code and can effectively strengthen the perception of faster loading. The initially-visible content of any given page will vary depending on the height and proportions of the screen, so it's important to test a variety of screen sizes and devices to identify visible content elements.

For heavier, slower-loading pages, prioritizing above the fold content becomes a greater relative factor in perceived load time. Some performance testing tools emphasize above the fold loading strategies and can help measure and guide that part of the overall performance picture.

User Interface

Although not directly related to load time, another aspect of perceived performance to consider is the responsiveness of interactive elements like buttons and controls. Delayed or sluggish reactions to user input can lead to frustrating and unfavorable user experience. Click or touch actions should feel snappy and animations should be fast.

Progress Indicators

Used carefully, loading animations and progress indicators can improve the perception of speed by subtly or momentarily distracting the user's attention and suggesting a sense of progress or action.

Where Science Meets Art

In addition to the nuts and bolts of applying various optimization techniques, performance optimization also involves the more subjective process of finding an ideal balance between content, features and speed. Like the difference between technical proficiency with a paintbrush and crafting a beautiful work of art, maximizing website performance in balance with quality content is not always a perfect science.

Balance

Websites should include enough engaging content to fully inform potential customers and provide adequate opportunity to make a positive impression and sell the benefit of the product. At the same time, avoiding excessive or superfluous content will help to ensure that a website loads quickly and visitors get the best possible user experience, free from delay and overwhelming or confusing extraneous content.

Maintaining a balance between content, features, page weight and load time.

For example, images often account for the majority of data that has to be transferred to view a website, but indiscriminately removing images can diminish overall user experience. Instead, carefully consider how each image contributes to the impact of the core message and make mindful choices about which images strengthen that message and which images might be superfluous (not specifically beneficial) or even overwhelming (specifically disadvantageous) to the user.

Context

Depending on the audience, a more feature-rich browsing experience may be worth some reasonable concesion of slower load times or users may prefer to get information as quickly as possible with minimal nonessential content. Finding a balance between well-intended enhancement and practical benefit to the user may take some trial and error to land on an ideal result of refined but effective content.

To maximize speed in balance with content, consider questions like:

Synergy

Just as each step in the path to sales compounds the impact of each subsequent step, the many layers of performance optimization benefit from a similar multiplier effect. Leverage this effect by applying as many optimizations - and to as great an extent - as is reasonably possible.

Performance optimization and improvements to load time are often measured in the hundreds or even tens of milliseconds. While some optimizations may seem imperceptible on their own, they do add up, and the resulting advantage of website speed translates into real benefit for the user and the bottom line.

Landing Pages

Most performance optimizations will apply to the entire website, but some pages warrant special attention and more aggressive optimization. Landing pages - the pages of a website that visitors reach first from off-site links and search results - are a great opportunity to make a positive first impression on new customers and can benefit most from fast load times.

Landing pages can be intentional, like the homepage or a specialized page that receives traffic from keyword-targeted advertising, or incidental, like pages that receive traffic directly from search engines. Tracking and analyzing the way customers reach a website will help identify incidental landing pages that can benefit from extra performance optimization.

Staying Up To Date

After the initial process of applying performance optimization, it's important to periodically review for any needed maintenance or updating. This can mean checking for and removing unused or out-of-date plugins and updating code libraries and frameworks.

As the standards and technologies of the web change, it can also involve revising optimization strategies altogether. The ongoing move toward HTTP/2 is a good example of how best practices evolve as new technologies are adopted by the infrastructure of the internet like web servers and web browsers.

Testing & Analysis

Testing is an important step to understand a website's existing performance profile and evaluate the effectiveness of improvements. Just how fast or slow is a page loading? What areas of the loading process need the most attention? Which performance optimization techniques will help reach page weight and load time goals? These questions can be answered with an ongoing process of testing and analysis.

Evaluating Performance

There are many free online tools available that will analyze a website and return a detailed evaluation of the loading process. In addition to general performance measurements, the results of most testing tools include notes on the areas with room for improvement to help formulate a list of needed optimizations. These tests can also verify that existing optimizations are in place and working properly.

Each analysis tool offers a slightly different set of features and results, so running multiple tests will get the most complete picture of loading performance. Based on the different features they offer, each test can be used to focus on a different aspect of the loading process. For example, some tools include an option to select a geographic location, adding insight about performance for users across town, across the continent or on the other side of the globe.

Try out some of the most popular performance testing tools to get an idea of the information they provide and how the results can guide and verify performance optimizations:

Market Competition

Analyzing competitors' websites can help gauge performance benchmarks in a particular industry. Given that most websites are under-optimized, improving loading speed is a great opportunity to set a business apart and win customers.

Browser Tools

Most modern web browsers include some version of developer tools or 'devtools'. These features are built right into the browser and make it easy to examine the details of load time, page weight, server requests, file compression, the loading sequence and much more.

Lighthouse mentioned above is also built in to the Chrome web browser.

Real-World Testing

Test results, data and numbers are a valuable tool to refine and optimize a website, but it's a good idea to temper those results with real-world perceptive tests. Loading and interacting with a website on a variety of platforms like laptop/desktop computers, mobile devices, wifi and mobile networks will balance the hard data and numbers with a more subjective, hands-on user experience.

Customer Feedback

As a supplement to the data from testing tools, asking users directly about their experience with load time through customer surveys and feedback requests is a great opportunity to learn more subjective information like perceived performance and reveal any room for improvement. Plus, it's a great way to connect with users and demonstrate a genuine investment in customer satisfaction.

Know Your Audience

As with many aspects of optimizing websites and business in general, commonly-accepted standards and best practices are a good starting point, but understanding the unique needs and expectations of users in a particular market can help refine performance optimization strategies even further.

Knowing the kind of traffic a website receives - like mobile devices vs laptop/desktop, network speed, geographic location and return visits - will help formulate a picture of the user base to refine content and optimization strategy to their needs. For example, if users are spread across the globe versus a more centralized geographic region, it can make sense to lend more importance to the location of web servers or how extensively CDNs are used.

Analytics

Website traffic analytics tools and plugins make it easy to explore usage stats and reveal patterns and trends. After a few weeks or months-worth of tracking to establish a baseline, that information can be used to develop an optimization strategy and improve user experience. Metrics like bounce rate, engagement, cart abandonment, sales conversion and landing pages can give a better understanding of the way customers use a website and how load time impacts overall user experience and sales.

Where To Begin?

Optimizing page speed is the product of two main factors - minimizing page weight and streamlining delivery. Start with minimizing page weight to reduce both the quantity and size of the file resources needed to load the page.

Minimize Page Weight