As you are probably already painfully aware of, site speed is an important search engine ranking factor. In February 2014, Google published a is one such tool. As is the case with Pingdom, Page Speed Insights will also give your page a score. What this tool does better than Pingdom is the fact that it shows you exactly what elements of the page can be improved to reduce load speed (more on this later).
- – Google Webmaster is an immensely valuable tool that most webmasters never use. From your dashboard you can quickly check site load time month by month, to determine whether or not your improvements are having any impact.
- – GT Metrix is the last tool that I recommend using. Like the previous tools, GT Metrix will offer you two performance scores (Page Speed & YSlow Scorte). From the drop down menus you can view exactly what is causing your site to under-perform. This actionable information will help you perform high-impact site speed tweaks.
Plugins you can use to check site speed: FireBug (Mozilla), YSlow (Mozilla), Page Speed (Google)
What exactly is a decent site speed?
- * 0-1 seconds: GREAT!
- * 2-3 seconds: GOOD!
- * 3-5 seconds: DECENT (but you should improve it)
- * 5+ seconds: BAD (you are losing visitors and money in noticeable quantities)
#2. Compress your Images (Even Further)
One of the primary causes of poor load times are large, uncompressed images. If you’re using Photoshop to edit your images, you have probably noticed the “Save for Web” option. This will help you compress images in order to reduce their size, without forfeiting too much of their quality. But did you know that you can use web-based tools to compress image size even further?
You can do this using the following tools:
- Photoscape
- TinyJPG
Image file type also matters. I recommend reading Shopify’s Image Optimization guide for more info about GIF, JPG, and PNG image files.
#3. Enable Gzip Compression
You will notice that Google’s Page Speed Insights recommends compression with Gzip. This is one of the most popular and effective methods of reducing HTTP response times. According to Yahoo, Gzip is supported by the search engines that support 90% of today’s Internet traffic.
To enable Gzip compressions simply add the following code in your .htaccess file:
# compress text, html, javascript, css, xml:
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
# Or, compress certain file types by extension:
<files *.html>
SetOutputFilter DEFLATE
</files>
#4. Use a Reliable Hosting Company
There are plenty great hosting services available (e.g. BlueHost or Hosting24), but there are even more bad ones, so you have to be careful what you choose. Sometimes, when everything else is correctly optimized, poor site speeds are simply a result of bad hosting.
I’ve been using the same hosting company (WPEngine for Wordpress) for the past 3 years. I never realized how much impact a fast hosting company would have on site speed (it immediately went from average to lighting fast) until I migrated a client’s site to this service. Not sure if your host is causing problems? Read a few online reviews.
Important Note: If you’re using Wordpress, you absolutely need to choose a theme that is not only beautiful but also
#5. Use Caching When Available
Media consumption is changing and the digital landscape must adapt to the new challenges created by these changes. Internet users take fast loading video sites for granted and will not wait more than 4 seconds if it doesn’t load. This is why you have to do all you can to site load speed. A few years ago, browser caching capabilities were quite limited. With the dawn of HTML5, this changed.
What exactly is browser caching? It’s simple:
When a visitor accesses your website for the very first time, the page will take longer to load because it needs to request all scripts, text, and images. This info is stored in the browser’s cache, so if the visitor checks out other pages, or comes back to your site, he will only have to download unique elements of your page.
HTML5 Local Storage and Application Cache will allow you to store megabits of data directly your browser (instead of the database) and to write fully-functional applications that you can run offline. How exactly does this help? Again, simple: these mechanisms will help you increase site speed (by strategically accessing local resources), reduce costs (no need for local storage), and improve offline browsing.
#6. Host Images on CDNs (Content Delivery Networks)
CDNs are crucial for international websites. Let’s say you’re website’s server is located in Germany. For local visitors, the content of your site will, naturally, load fast. But how fast will it load for someone that is browsing from Japan or the United States? Probably not very fast. That’s because the information has to pass through several routers along the way.
A Content Delivery Network creates copies of your page on multiple servers around the world. There are plenty of CDNs that you can choose from (e.g. Amazon’s CloudFront, Akamai, etc.). Most CDNs are paid services, but there are also a select few that are free. For example, Google is offering a free CDN (PageSpeed Service), for a while, at least.
#7. Minify CSS and JavaScript Files
Image Source: SearchEngineLand
Slow-loading pages usually have something to do with clunky CSS or JavaScript elements that are being loaded inefficiently. If you’re running a WordPress site or any other CMS for that matter, you should know that new CSS or JavaScript files are added every time you install a new tool or plugin.
This means that you have to minify these files periodically. One way to do this is by squishing all the files into one – instead of adding 20 JavaScript files, simply place all of them in one JavaScript file. Another way to minify these elements involves making them smaller & reducing white space. If you’re already on WordPress there’s a great plugin for that called WP Minify.
#8. Find Broken Links on your Site and Fix Them
Broken links have a negative impact on
You can quickly identify and remove broken links using one of the following methods:
- View your link-profile in Ahrefs. Navigate to the broken links section. Place redirects on your broken links, or re-create the missing page using the same SLUG.
- Audit your site using SemRush. The tool will automatically report all broken internal links. Recreate the page or place a 301 redirect to fix it.
- Use Siteliner to identify broken links and repeat the same process.
#9. Add LazyLoad to your Images
While not completely user-friendly, lazy-load can help you reduce load-times. This process will ensure that only images above-the-fold load (only images that visitors see in the window). As the visitor scrolls down, other images on your page will begin to load, just as they are about to come into view.
This solution is useful not only for reducing site speed but also for saving bandwidth by loading less information for users that do not scroll all the way to the bottom of your page. You can automatically add LazyLoad to your Wordpress by installing the jQuery Image LazyLoad plugin.
#10. Minimize RTTs (Round-trip times)
Round-trip times are not file size issues, they represent a number of requests issue. RTTs refer to the requests that need to be completed when a user accesses your site (e.g. CSS, JavaScript, and image files that need to load are requested individually).
In other words, the browser sends a request to the server, and the server sends information back. A great strategy for reducing site loading time is to minimize the number of RTTS made. Sounds complicated. Luckily for us, Google has put together a useful manual for doing this. Here’s the gist of it:
- Combine JS files to minimize requests.
- Combine CSS sprites with images. This will merge all small images into one background.
- Don’t use @import. Instead, use the <link> tag for your style-sheets.
- Minimize redirects (unless necessary), and DNS lookups.
So there you have it, 10 tricks that will help you improve site speed and achieve your business goals.
Featured Image Source: depositphotos.com
