Speed Matters both for Users and SEO: Nobody wants to wait several seconds for a website to load. Users would rather leave your site and go to a competitor than spend time waiting. “Time is money,” as the old proverb says. Time also matters for Google. Speed is one of Google’s ranking factors. All things being equal, the faster the website the higher the rank. And there is nobody who will argue that having a speedy website isn’t a necessity nowadays. The question is: how to make your website faster? Our guest author Tomek Rudzki, Head of the Research and Development team at Elephate, winner of “Best Small SEO Agency” at the 2018 European Search Awards, explains that in another installment of Unwrapping the Secrets of SEO.
This comprehensive Guide to Website Speed features three articles. Read them here: The Ultimate Guide to Website Speed – Part 1 and The Ultimate Guide to Website Speed – Part 3.
8. Avoid redirect chains
Sometimes you change your website structure; it’s totally fine. However, after performing a structure change, you should make sure that you have as few redirect chains as possible. In order to do this, you should update your internal links to point directly to the new URLs.
Sometimes the issue goes extreme, as you can see the screenshot below – over 5 million URLs with redirects.
Side note: Google claims that 3xx redirects don’t lose PageRank anymore. However, there are many SEOs, including Barry Adams, who have observed otherwise.
9. The Fewer Resources to Download the Better
10. CSS sprites
In order to reduce the number of requests, you can use CSS sprites. What’s that? Let’s say you use Share buttons for Facebook, Twitter, Pinterest, Google+, Reddit. That’s 5 icons = 5 requests. But you can combine these icons into a single picture. Then you can define where they should appear on the screen by specifying the CSS rules.
You can also reduce the number of resources by inlining small JS and CSS files.
11. Use CDN if you have Users from around the World
If you have users from around the world, it’s good to use a CDN for your static content (HTML, JS, CSS, image files).
Let me briefly explain a CDN, which stands for “Content Delivery Network.” If you use CDN, your content is distributed across servers located around the world.
- If a user from the USA reaches your website, they download the content from a server located in the USA.
- When a user from Russia visits your website, they might download the content from a server located in Russia.
It can really reduce the Time to First Byte for EVERY request. As a consequence, your website will load faster.
12. Be Careful with Lazy Load
Lazy load is generally good practice because you don’t flood the user with unnecessary content at the initial load. Do you have a carousel with a large number of photos and nobody clicks on the last image? Don’t force your users to download it immediately; lazy load it instead.
Some time ago MediaVine switched to lazy-loading ads. It resulted in a 200% improvement in page load speed.
13. Watch your Third-party Scripts
You improved almost everything on your website and it still performs slowly? It may be caused by third party scripts (video embeds, social share buttons, tracking software).
Let me quote Google’s developers documentation (again!):
Third-party scripts are a predominant cause of performance slowdowns and are often caused by resources outside of your control.
14. Resources Hints
If you want your website to be fast, you should make sure that the browser can collect all the resources necessary for rendering as fast as possible. Resource hints (special pieces of code placed either in the code or in the HTTP headers) can be helpful.
This might sound weird to you, but don’t worry, I will try to explain it in plain words.
You can use the “preload” hint to let the browser immediately download resources that are necessary for rendering (primary pictures, fonts, CSS & JS files). Thanks to using the preload hint, these resources can be downloaded immediately, even before parsing HTML.
This is how you can implement it in HTML:
Another interesting Resource hint is “Preconnect.” You should know that the browser can’t download a resource just like that. Beforehand, the browser has to perform a DNS check and negotiate the TLS secure connection. This takes time.
For the most important resources you can perform these steps in advance, by using the link rel=”preconnect” resource hint. If you want to dig into the topic, I recommend you read this documentation.