With so many rumours floating around the internet about Search Engine Optimization (SEO), you are bound to miss a few good tips. People talk for days about good design and content. High-quality content is, without doubt, one of the biggest factors affecting the way you rank on Google. Most SEO companies swear by great design and copy on sites for ranking. One thing many professionals (some with decades of experience) miss is the page speed.
Page load speed is almost never something you consider when building your site. You want it to look as pretty as possible, after all. However, multiple studies by Google Analytics and other resources suggest that the load times for your pages could make or break your lead generation. In fact, the average attention span of an internet user is about 10 seconds.
You have 10 seconds, at most, to load your pages and all the resources on them. That’s not a lot of time. Because of the speed of the internet today, your pages are probably going to load faster than this regardless of what you have injected into the code.
Today, Google and other search engines factor your page load speed and times into their Page Rank algorithms. Google even has its own tool, open to the public, to check their page speed. Called Page Speed Insights, it’s one of the most useful tools out there for SEO companies across Toronto.
How Does it Work?
Google crawls your site page by page and checks how long it takes to load your content, starting from your above-the-fold content and moving down to the full page. Above the fold content is all code that’s in your tags, including loading external stylesheets, scripts, and more.
While it’s a powerful tool you can leverage to generate more leads, it’s also one of the most resource heavy. Loading scripts in a browser takes time. While this may be just milliseconds, it adds up and can significantly slow your page down.
- Eliminate render-blocking scripts
- Minify your scripts
Eliminating Render-blocking Scripts
The browser loads your entire page from the top down. Along the way, if it finds an external resource that hasn’t taken render blocking into account, it will pause the loading until that resource has been downloaded. This is render-blocking. Unless it is absolutely necessary for your page, you should try and avoid render-blocking scripts as much as you can.
Finally, you can defer the loading. This keeps all scripts on hold until the browser has loaded all the HTML (see the 2nd section of the image).
Readable code is important in larger web applications because it makes debugging the code if something goes wrong a lot easier. However, it can also take up a lot of space. The browser reads each line without distinguishing between what’s a script and what’s everything else.
To avoid this, you can minify your scripts. Resources like the Closure Compiler and Uglify.js are extremely useful for this purpose. Minifying your script means cutting out everything that isn’t necessary for the script to run. This includes comments, formatting, whitespace, and more.
You can’t optimize everything. There will be situations where you have to keep your scripts intact, whether for debugging and audits or for functionality. What you can do is optimize anything that isn’t essential. Even the smallest changes can improve your page load speeds. Ultimately, your code can contribute a lot to your site’s performance on Google’s ranking system.