Optimized websites score well across hundreds of Google ranking factors.
As a result, they rank higher and always have a competitive advantage.
One factor that Google utilizes to determine website rankings is the website’s loading speed.
Websites that have longer loading times receive weaker rankings than equivalent websites page load quickly.
Google offers Google PageSpeed Insights tool is an online tool that webpage admins can use to learn how Google determines their websites’ loading speeds.
Users enter the target URL, and Google generates a report that displays an optimization percentage and specific suggestions that can improve the website’s loading time.
The closer to 100% a website earns, the more likely that Google will favor the website in search result rankings.
The Importance of Webpage Loading Times
Websites that appear on the first page of search results receive far more web traffic than search results on subsequent pages.
Since Google factors loading times into their search rankings, focusing on lightweight, quick-loading webpages will increase the chances of a webpage landing on the first page of search results.
Sites that consistently appear on the first page of search results had common characteristics:
- Rapid loading times
- High levels of optimization
- Low instances of viewers leaving the website before it finished loading
Impatient users may leave a website that does not load within 400 milliseconds. And 1 in 4 users will abandon a website that does not load within 4 seconds, with 46% of users refusing to revisit a website that they consider slow-loading.
According to recent reports from Google, most business websites have average page load times ranging from 7.9 seconds to 11.3 seconds. This leaves a critical opening for competitors that can optimize their wordpress sites and divert potential customers to their websites with superior site performance.
Determining How Google Measures Your Website’s Loading Speed
Google provides online free tool that specify how it measures a website’s page performance. This is a valuable service for two reasons: it gives you direct insight into how Google will treat your website’s ranking factor. It provides a level playing field that nullifies problems that arise when multiple users have varying internet speeds and hardware power.
- Copy and paste (or manually type) your website’s URL into the Google Page Speed Insights tool.
- Click “Analyze” to have Google run a quick test on your site.
- The report that Google generates will give a percentage indicating the optimization level. When the percentage is not 100%, Google will specify which parts of the website must be optimized to reach 100%.
Reaching 100% might not always be possible, but it should be your goal so your website remains competitive with similarly-themed websites.
Be sure to test how the mobile version of your website performs as well. Rarely will a website appear the same way on a mobile device and a desktop or laptop device, so scanning each format is vital to reaching 100% optimization.
- Input your website URL at Test My Site and hit enter.
- The generated report will identify issues that need improvement for a more efficient mobile site.
How to achieve 100% optimization
Reaching 100% optimization will not be easy. However, the improved Google rankings and the increased revenue will make the effort worthwhile. Conversely, settling for a lower percentage will give an opening to a competitor that reaches for – or achieves – a score of 100%.
1. Reduce the data size of your website’s images
Compressing images can reduce their sizes by up to 50%, and many common tools – and free in many cases – can reduce image sizes without sacrificing the image’s quality.
For the novice we recommend WP Smush Image Compression and Optimization. WP Smush is free to use, and it has many appealing features that can make image size reduction simple and swift:
- Automatic detection of images that are candidates for reduction
- Automatic reduction of images upon uploading
- Bulk uploading of images
- Reduction of up to 50 files at a time
Crush.pics is an alternate tool for Shopify users. Compress JPEG and Optimizilla are two of several free online tools that perform image reduction services. As a last resort, Windows users with limited resources can open Microsoft Paint and use the resize functionality to reduce image sizes by percentages.
In addition to shrinking images, knowing which image file format is most appropriate for its purpose can mean the difference between kilobytes and megabytes. When adding images to your website, consider the following rules of thumb:
- Use GIF files for small images such as logos and enhanced elements such as buttons and bulleted lists.
- Use JPG files for images requiring multiple colors or a photograph-like appearance.
- Use PNG files for images that require transparency.
HTML coders should note that scaling down an image by defining height and width variables in the IMG tag does not change the image’s size. Scaling down images will also trigger warnings pertaining to HTML minification (which will be covered in the third optimization task).
2. Understand how requests and caching work, then apply those principles to boost loading speeds
The web browser sends multiple requests to the web site’s host, querying about and verifying every single element on the web page. This can lead to double-digit-second loading times, especially when the destination page has significant multimedia files such as images and audio files. Browser caching stores local copies of elements such as text and images, preventing having to reload said elements when there is no change between the cached version and the current version on the website. Only elements that have changed will need to be reloaded. Fewer requests means less communication between the client and server, which directly leads to shorter loading times.
WordPress developers should download the W3 Total Cache app.
The tool also helps you minify HTML, JavaScript, and CSS.
WordPress users can reduce load times further by disabling or reducing websites’ revision histories. The more stored revisions the server has, the more loading time the site will take to display. Unless you have a compelling reason to maintain an extensive revision history, cut the number of stored revisions to the bone – or consider storing revisions on an offline or off-site location.
If you have control over the web host, check the “expires” header. The less frequently your webpage is updated, the lower the “expires” value should be. If you can set your “expires” value to one year or longer, you can reduce the amount of fetching that returning users’ web browsers will perform.
In addition to utilizing browser caching, reducing the number of redirects on your website can reduce loading times as well. When your webpage has two or more redirects, you are costing your users valuable time and yourself revenue and search result rankings. If you can eliminate redirects completely, do so; otherwise, eliminate as many redirect chains as possible.
With regards to fetching resources, an excessive amount of wordpress plugin/plugins on your website can slow loading times to a crawl. Even a simple-looking plugin such as the Google+ button box can add two seconds of loading time. Note, however, that one plugin that performs multiple complex operations can be worse for load times than several smaller plugins that perform a single task. When in doubt, look for reasons to remove plugins. A general rule of thumb is to limit your web page to 10 or fewer small, simple, single-function plugins.
3. Minify the code as much as possible.
“Code optimization” is a simple way of describing minification. Minified code removes functional redundancies and white-space to reduce the size of the code file.
WordPress users should download and use HTML Minify to make the process much easier. The plugin is simple to install and configure, and the minification results are both quick and impressive.
If you do not use WordPress, you may be able to perform your own HTML Minification if you have sufficient experience and comfortability with modifying HTML code. However, manual minification should be considered as a last resort due to the effort involved and the potential for accidentally deleting core web vitals assessment code – especially for large web page. This will make the code harder for software developers to read, so you may want to save two copies of the HTML code: a readable version and a minified version. Common ways to minify HTML code include:
- Removing all comments
- Removing as much formatting as possible (such as indented sub-tags) without compromising the functionality of the code
- Removing all unused code
- Shortening variable names
- Shortening function names
A web search for “HTML Minification” will return several web page that will allow to copy-and-paste your HTML code into the web page’s form and perform automatic minification with the click of a button. However, you should take precautions to ensure that you are not dumping your code onto a spoofed site lest a hacker copy your code.
Many web hosts will allow you to “minify” entire code files as well. By using a compression tool such as GZip, you can reduce the size of code files such as HTML and CSS files, then upload the zipped file to the host. You will need to coordinate with the web host to ensure that the host can read the compressed code, but this can reduce web page speed/site speed when the code files are larger than 150 bytes. Note, however, that attempting to compress image files with file-compressing software is not recommended; continue to use image-reducing tools for GIFs, JPGs, PNGs, and similar image files.
4. Understand and apply AMP protocols
AMP is an acronym for Accelerated Mobile Pages.
The purpose of AMP is to apply code optimizations that specifically benefit performance on mobile devices. The emphases are on removing or reducing the number of elements that are either completely incompatible with mobile devices or are more unwieldy on a mobile device than on a laptop or desktop computer. Google prioritizes AMP-optimized mobile sites by designating them as “Top Stories.”
AMP’s online tutorial can help code-savvy web admins manually apply AMP principles to optimize their mobile sites and increase the chances of the site being identified as AMP-optimized.
WordPress plugins such as AMP for WP are an alternative for users who are not tech-savvy.
Conclusion
The purpose of a website should strongly dictate its form and function. The main goals of a business website are to draw in new customers, to keep current customers engaged, and to increase the company’s pre-tax income through sales. Those reasons alone justify focusing on quick loading times, but Google’s ranking algorithms favoring fast-loading websites with low bounce provides additional incentive for webmasters to increase their websites’ performance.
Scoring 100% optimization may not always be possible – especially with sites that require significant multimedia or complex operations – but striving for 100% should always be a goal.
- Use the Google PageSpeed Insights tool to determine your website’s current performance and suggested steps to improve your website’s perfect pagespeed insights score on subsequent site speed tests.
- Compress and optimize the images on your website using a combination of the correct image file format and tools that compress or reduce the size of the file without significantly impacting image quality.
- Use a plugin to leverage browser caching. In addition, code-savvy web admins can make adjustments to both the website and the web host to further enhance caching capabilities.
- Minify the code. Smaller code file sizes lead to shorter loading times. Trading readability or standards for better search result rankings can be a good trade-off, especially when keeping a “standard” offline backup of the code files.
- There is no drawback to learning more about the code and mechanics pertaining to web pages, as such knowledge can fill the gaps left by apps and tools. Knowing what to do – and what not to do – allows you to perform smaller, pin-point adjustments that may be quicker and more accurate than machine-generated modifications.
- Enhance and prioritize mobile web sites by applying AMP protocols. When in doubt, focus more on performance and functionality and less on enhancements and “glamour.” Having your website marked by Google as AMP-optimized can dramatically increase your web traffic.
Work With Us
We guarantee a 90+ on Google PageSpeed Insights! If you’re needing help speeding up a slow WordPress, Shopify or any other website CMS, then get in touch!
Connect with Ryan on Linkedin.
- Free HTML Landing Page Templates - April 4, 2024
- GDPR Compliance: A Practical Guide to GDPR Website Compliance - March 25, 2024
- Creating Wireframes for Web Development: A Guide to Wireframe Mockups - December 19, 2023
