The speed in which your web pages load is of utmost importance to your search engine optimization, and more importantly, for your users. In this article we discuss some of the best practices for improving your web page performance, as well as tools you can use to test the performance of your site.
UPDATE January 18, 2018: Google has announced an upcoming algorithm change for mobile search results which they have dubbed the “Speed Update.” We’ve written a post about this algorithm change and what it means for page speed.
According to a pair of studies done by Akamai and Gomez (collated into this handy infographic by Kissmetrics), 47% of users expect a web page to load in two seconds or less, and 40% of users will abandon a page that takes longer than three seconds to load. Making your web pages load faster increases the likelihood that users will see (and read) your content.
Google in particular is obsessed with improving the performance of the web. They show this in many of their projects; from creating a new form of HTML with their AMP Project to structural enhancements to the infrastructure of the internet as a whole, they are obsessed with making web pages load faster because they know that ultimately when a user is searching the web, they want the content they are looking for delivered without a wait.
In 2010, Google added page loading speed as one of the many factors involved in ranking how web pages appear on their results. All other factors being equal, the site that reliably loads faster will show up first when ranking results.
There are a number of factors that come together to indicate the speed of your web page, and as such, keeping track of what is slowing your web pages’ load time can be a difficult task. Fortunately, there are tools available that can help identify specific aspects of your site that may contribute to perceived slowness.
Google PageSpeed Insights
One of the first tools you should use to determine how fast your site loads is Google’s PageSpeed Insights tool. This tool can analyze a web page and give you suggestions for accelerating your site for your users. It is important to note that the scores and suggestions given by the PageSpeed Insights tool are merely guidelines, and your score does not necessarily correlate with the PageSpeed Ranking factor. Nevertheless, using the PageSpeed Insights to analyze your site is an excellent first step in determining your site’s speed.
The first tab contains analysis of the web page’s performance for mobile users, and the second tab is performance for desktop users. At the top of each tab is a score between 0 and 100 and a simple description of how well the page is doing. Below this score is a list of suggestions for improving the performance of your site.
One thing to note about the PageSpeed Insights tool and score is that it does not take into account AMP pages hosted on Google’s content delivery network (CDN). If you test a regular page of your site, the results you get back are for that page if it was entered directly, it does not match the user experience when the page is visited from the Google search results (which for most web sites is the majority of visits). AMP Pages are loaded from a special AMP URL loaded on Google’s AMP CDN so the results you get for a mobile page on your website, or even from the locally loaded AMP web page on your own site’s web server will be slower than the speed that the user will get when loading the AMP web page from Google’s AMP CDN. Google judges the speed of an AMP web page hosted on Google’s CDN on how fast it is itself, not the PageSpeed of the original non-AMP or AMP web page hosted on your own web server.
You can find a list of the PageSpeed Insights Rules on Google’s documentation website for the tool. These rules change over time, but many of them are good suggestions in general, so I’ll cover a few of the big ones here.
Leverage Browser Caching
Often times there are some resources used on every page of your site. Your CSS file, for example, is often shared amongst all your web pages, and there may be images used on multiple web pages such as your firm’s logo. By passing
ETag headers to the browser, you can leverage the browser’s built-in caching in a way that prevents the browser from asking for the same file repeatedly. Google recommends you use a minimum of one week for your cache expiration headers and as much as a year or more to maximize the performance for repeat visits and moving from one web page to another.
It used to be that adding animation or video to your site required use of browser plugins like Flash or Java. While these plugins added a lot of functionality and interactivity, they were (and are) also well known for being slow, crashing, and having security issues. Most mobile browsers don’t support plugins at all, and the major desktop browsers have all announced phasing them out.
Avoid Landing Page Redirects
Redirects are a necessity on the web, and Google actually strongly recommends you use redirects when it comes to moving content around your site. For example, when you move your site to HTTPS, you should redirect the HTTP version of your site to the HTTPS version of your site so that there is one authoritative version of your web pages.
Be careful when you add redirects to your site however, as it can become easy to create what are known as “redirect chains.” If at all possible, use exactly one redirect to redirect your users from the URL they landed on to the URL you want them to be on. Each redirect results in an additional round trip between your browser and the server and can significantly increase the response time for your web page.
Improve Server Response Time
The first part of a user’s web page load experience is the server’s response time. Nothing else can happen if the server doesn’t respond with your web page’s content in a reasonable amount of time. PageSpeed Insights returns a warning if it detects that your server takes longer than 200 milliseconds to start responding with your content.
There are a number of factors that can lead to an increase in server response time. If you are using a dynamic Content Management System (CMS) to manage your content, make sure you are leveraging your particular CMS’s performance recommendations on your server.
No matter how much you optimize your server, the user’s bandwidth is always going to present a bottleneck. This is especially true for mobile users, as mobile networks are generally slower than desktop broadband connections. Many of the suggestions Google gives in PageSpeed Insights are about reducing the number of bytes you have to send to your user, so you can use as little of their bandwidth as possible.
Minify Resources and Optimize Images
Images are another story. If you take a high-resolution photograph with your digital camera and then shrink it down to fit in a much smaller area on your website, the extra resolution is a waste. Even if your image is being presented as full size, it likely contains more data than it needs. Running the image through an image optimizer can significantly reduce the size without decreasing the visual quality of the image.
Web developers and people who work on the web in general tend to have faster-than-average internet connections. This can lead to the false belief that web pages will load as fast for your viewers as they do for you. WebPageTest.org is great because you can test your site using real browsers on varying connections around the world.
The test is slow, but when it finishes you get a very real-world view of how your site loads, and you can view a timeline of when your browser started and finished downloading each resource necessary to render the page (commonly referred to by web developers as “The Waterfall”).
The suggestions and grades at the top of the results page are much simpler compared with Google PageSpeed Insights rules, but it is an easy way to get a real waterfall on a connection other than your own, and it gives you real numbers for load time.
Pingdom Website Speed Test
The Pingdom Website Speed Test combines a simplified version of the PageSpeed Insights test (using Google’s Advanced Programmer Interface) with a direct fetch test and waterfall rendering similar to WebPageTest’s.
The tool also integrates Yahoo’s Exceptional Performance Best Practices ruleset from the YSlow browser plugin to give you a single report containing suggestions from both Google’s and Yahoo’s best practice guidelines.
Pingdom does a good job of simplifying the places where PageSpeed Insights and YSlow’s rules conflict, or where YSlow’s rules conflict with each other. For example Yahoo recommends you keep components under 25K in size, but also recommends combining smaller images together into CSS Sprites, which can take resources that were smaller than 25K and make them larger than 25K. Pingdom skips the suggestion about sprites resolving the conflict.
The important thing to remember is that the rules on all of these tools are guidelines—suggestions for ways to improve your performance—so when some rules contradict each other, you should evaluate the outcome of each and pick the solution that will result in a greater improvement in performance.
Justia Website SEO Report
Justia uses these tools and a number of others to continually measure performance on all of our client websites and blogs. We send regular reports of the results to our clients so they know where they stand.
If your law firm website is not with Justia, we’d be happy to provide you with a free SEO audit of your site that includes the results of tests described above and real actionable suggestions on how you can improve not only your website’s speed, but other aspects of your search engine optimization as well. To request your free website SEO report, simply fill out this request form.
Web page performance is important for your success, both in your search engine optimization to drive users to your site, and in retaining those users once they get there. Be sure the marketing organization you work with is as fanatical about web page performance as we here at Justia are.