In 2010, Google stated that they were going to begin to use site speed as a factor in ranking websites. In 2018, Google doubled down on this by stating that they intend to use site speed as a factor for ranking websites on mobile, with the intent of ensuring that people do not have to wait to find the answers to their questions. This means that if your website is not running fast, or at least faster than the average 15 seconds[1] on mobile, you will have trouble ranking on Google for anything other than your business name.
Have a Fast Host
The most important part of ensuring your site loads fast for Google is to have a fast host. Fast hosts will implement server-side caching and Gzip compression to ensure that websites are delivered fast and web pages aren’t larger than they need to be. For managed WordPress hosting, we generally use WPEngine or Siteground.
Implement Server-Side Caching and Gzip Compression (if your host doesn’t implement it already)
Server-side caching keeps your content management system (typically WordPress) from having to make the same database queries to deliver the same pages[2]. Gzip compression compresses your files, which results in faster network transfers[3]. If you’re using a fast host, there’s a good chance they’re doing both of these things already.
Minimize Your Site’s HTML, CSS, and JavaScript
While we’re on the topic for faster network transfers, another thing that can reduce the size of the files returned from your server is minimizing your site’s HTML, CSS, and JavaScript files. This works by removing line breaks and unnecessary whitespace (like indentations) that are usually not necessary for the browser to interpret and render your web pages[4]. If you are using WordPress, we recommend the Autoptimize plugin for this, though, depending on the other plugins you have installed on your site, you may have to set up exclude rules to the JavaScript or CSS rules to avoid having Autoptimize break your site.
Optimize Your Site’s Images
However, the time and data savings achieved doing these things are minuscule compared to the savings from properly sizing and optimizing your site’s images. This is because on most sites, images make up roughly half of the portion of content your users will download[5]. For this reason, we recommend that check to make sure you are using the right formats for your images (JPEG for photos, PNG for logos, infographics, and other non-photo images, and GIF for images that need animation), that they are at the size that you intend to display them on the web page, and not larger, and that they have been optimized to remove unnecessary colors and metadata. For WordPress sites, we generally use WP Smush to optimize our images for us automatically, though there are other plugins that do this as well.
Also, if the image was generated using a vector editor, such as Adobe Illustrator, Affinity Designer, or Inkscape, you should seriously consider using a vector image format such as SVG, instead of a raster format like PNG or GIF. Because SVGs use shapes, numbers, and coordinates[6] instead of pixels, they can offer significant savings in file size, especially at larger image sizes. The sizes of these SVG files can be decreased even further using image optimization programs such as ImageOptim or SVGO. However, unsanitized SVGs can also present an attack vector for your site, so if you’re going to use SVG images on your site, it’s best to install a plugin like Safe SVG for WordPress so the SVGs on your site are sanitized to mitigate any vulnerabilities.
Implement HTTP/2 (formerly SPDY) and HTTPS
HTTP/2 (formerly known as SPDY) offers significant speed boosts over HTTP by compressing site headers, and by allowing many resources to be fetched with the same connection[7]. This saves time, especially on slower connections with more lag, like mobile networks. However, most browsers only support HTTP/2 over HTTPS[8], so you’ll need to implement HTTPS, which is something you should do anyways because Google is pushing hard for HTTPS everywhere, to your site to see the benefits of HTTP/2.
When you do this, make sure you use HSTS and 301 redirect the HTTP version of your site to HTTPS, so visitors and backlink juice get sent towards the HTTPS version of your site. Also make sure all your internal links use HTTPS, and all your site assets load over HTTPS. If you don’t, that called mixed content, and that will, in the best case, cause delays as browsers get redirected from HTTP to HTTPS to download pages and resources, and, in the worst case, cause the web browser to display a Not Secure message when the user is on your site, which may cause visitors to leave.
Where to Start
If you’re not sure which one of these things are already done and which things you need to do, use Google PageSpeed Insights to diagnose your site. And if any of this confuses you, contact us at The Crouch Group. We’ve worked with many businesses to ensure their websites are properly optimized to get the visibility in Google they need to grow.
Our Thoughts on AMP
You may have noticed that during the course of this blog article, we never mentioned AMP. AMP causes Google to create another version of your site on Google’s servers, which accumulates backlinks, making it impossible to move away from AMP without SEO damage. AMP usually isn’t necessary unless your in a niche where Google requires it for visibility, like news. If you are in a niche that receives significant traffic from Google News and Discover, it might be necessary to bite the bullet and implement AMP, but if your host is fast enough and you’ve implemented these other tips, it shouldn’t be necessary to implement AMP.
Sources
1. An, Daniel. “New Industry Benchmarks for Mobile Page Speed.” Think With Google, Feb. 2018 https://www.thinkwithgoogle.com/marketing-strategies/app-and-mobile/mobile-page-speed-new-industry-benchmarks/.
2. “Server-Side Caching: Speed Up Your WordPress Website.” Testomato Blog, 4 May 2015 https://blog.testomato.com/caching-wordpress-website/.
3. Sexton, Patrick. “How to enable compression and gzip for page speed.” Varvy.com, 27 May 2016, https://varvy.com/pagespeed/enable-compression.html.
4. Champagne, Jason. “How to Minify Your Website’s CSS, HTML & Javascript.” Elegant Themes Blog, 17 Jan. 2019, https://www.elegantthemes.com/blog/tips-tricks/how-to-minify-your-websites-css-html-javascript.
5. “Report: Page Weight”, HTTP Archive, 1 Apr. 2019 https://httparchive.org/reports/page-weight.
6. Khanna, Abhishek. “How SVG optimization can help in improving website speed”, Imagekit.io, 24 May 2018 https://imagekit.io/blog/svg-optimization-improves-website-speed/.
7. Grigorik, Ilya & Surma. “Introduction to HTTP/2”, Google Developers, 1 May 2019 https://web.dev/performance-http2/.
8. “HTTP/2 Frequently Asked Questions”, HTTP/2, 24 May 2018 https://http2.github.io/faq/.
[…] Taylor Spencer offers guidance to improve your website’s mobile load time and boost SEO rankings. […]