Complete Guide to Increasing Site Speed

Why is site speed important? Lets use this scenario. A user searches a query within Google and search results are returned to the user. The user clicks a link and waits for the page to load, after waiting a few seconds the user clicks back to the search results and clicks a different result. This tells the search engine the query used to reach the site is not related to the page, since the user immediately clicked back. Thus the search engine will move the page down in the search results. This scenario will show how site speed affects SEO, now for the user experience. When users browse a site that loads slowly, it results in a poor user experience. If they are going through the checkout process and are having trouble loading a product into the cart, they will leave and make a purchase elsewhere.

Optimize CSS, Javascript, and HTML code

Minimizing the code within the backend of a website can help increase the load time of a site. This is done by removing spaces, commas, and other unnecessary characters that can slow down the load process. Often when a site is built, then changed, and added to extra code can still be present, thus slowing the load time.  

Minimize HTTP Requests

Each time a user visits a website the site must retrieve components from a server to build a page. When these requests are made this is called a HTTP request, and each time a request is made it adds a bit of time on the loading of a site. The following tips can help decrease HTTP requests,

• Combine CSS files – If your site has a number of CSS files, combine them into one single file allowing for faster access.
• Reduce Images – By limiting the number of images on a site can drastically speed up a page’s load time.
• Limit Unnecessary Files – Only use javascript and CSS files for pages that need them. If files are not needed on a specific page, remove them.

Enable Compression

If you’re creating high-quality, content rich pages chances are they are very large in size, resulting in it taking longer to load. By compressing the bandwidth of the pages helps reduce the HTTP request. Web servers will compress files through a GZip format, then send it out for download, which can reduce download time by nearly 70%

Reduce Server Response Time

Server response time is is dictated by the number of users visiting the site, how much resources the pages are gathering, types of software being used, and hosting of the site. By having too much of these assets running on the site can really slow down the user experience. Slow database queries, sluggish routing, and low amount of memory can drastically slow a website. Four steps to reducing the server response time on your site,

• Review performance data which can be done with automated web service tools.
• Locate bottlenecks in response time.
• Remove bottlenecks
• Monitor future performance issues

Google suggests reducing server response time to be under 200ms, and once this is done it’s important to continue to monitoring the response time.

Enable Browser Caching

Each time a user visits a web page the elements of that page are stored on the user’s hard drive, also known as being cached. This is done so the next time a user visits the page it will load faster, since no HTTP request needs to be sent another time. Once someone lands on your site elements such as stylesheets, javascript, and images are stored. It’s best practice to store cached elements differently. For instance, if you’re utilizing ads or images that may change often limit those to cache for a day or so. In comparison, if your stylesheets or PDFs aren’t going anywhere it’s fine to allow for those to expire at a minimum of a month or maximum of a year. Note: Don’t go over a year, it will violate RFC guidelines.

Compress Images

It’s time to optimize the images which includes three main items.

1. Image Size – Everyone has had the issue of trying to view a webpage and there’s images that are gigantic and taking forever to load. Don’t piss off your users by making them wait for a simple image to load. Here are some easy ways to reduce the image size.
   1. Crop the images to fit the size of the web page. There’s no sense in embedding an image that’s 2,500 pixels wide if the page only needs an image that is 1,000 pixels.
   2. Minimize the color depth to the most acceptable level.
2. Image Format – There are many types of image formats, yet only a few are most common these days. Most commonly used is JPEG, which load quickly and don’t take up much storage. PNG images are also very common, however, some browsers don’t support this format. If you decide to use GIFs make sure they are small graphics, don’t over do it. Avoid using BMP or TIFF formatted images, they are often larger in size and take up lots of storage.
3. SRC Attribute – Now that the formatting is correct it’s important to check to ensure the code is optimized properly. This means ensuring there’s no empty img src, which is displayed as <img src=” ”>, which can add unnecessary stress on your servers.

Limit Plugins on the Site

Multiple sites offer plugins that can help make building a proper site easier. However, if you begin adding too many plugins to your site issues can arise. Lots of plugins can create holes for security issues, cause pages to crash, and ultimately slow your site. The easy solution to this problem is to limit the number of plugins you add to your site. There’s no reason to have multiple plugins running that are not adding any benefits to the site. Methodically review the plugins being used and remove any that are unnecessary.

Be Smart About Your Redirects

Redirects can be a lifesaver, in certain situations. Comparably, they can also reduce load time since each time a redirect is found a new HTTP request is created. Now that mobile is becoming a necessity for sites, many are optimizing for other devices. Some sites will set up mobile redirects that look something similar to the following, www.website.com which redirects to m.www.website.com which redirects to m.www.website.com/index. This is three separate HTTP requests which can take time to load, and we know users hate waiting.

Always keep in mind who benefits from site speed. It’s not for the search engines and it’s not for your internal team. Site speed is based on the user’s experience and giving them a pleasant viewing opportunity. Anytime you’re browsing through your site ask yourself “would I remain on this site?”.

Curious on how your site speed performs according to Google?