The site owner may eventually want to increase his download speed. This increases the ranking of search results; besides, it is more pleasant for site visitors to work with it by getting a faster response to their actions.

In search of a quick and straightforward solution, site owners install a vast number of plug-ins, which in turn consume resources and only slow down its work. We do not have anything against optimization plugins, but they need to be used to the point and with knowledge of the principles of their work.

Besides, site owners who have never experienced administration often have a misunderstanding of optimization. In their understanding, optimization is the acceleration of the script at any cost. The task of optimization is to produce the optimal speed of the site at the optimal price of resources. Therefore, there can not be universal instructions for all sites.

To make your website fast is an urgent task for any resource owner or webmaster. After all, page loading speed is one of the most critical factors for the success of a web resource, along with high-quality content and beautiful graphic design.

Slow loading increases the likelihood of losing users at times. Especially when visitors come from mobile devices. Simple recommendations to speed up site loading, which even an inexperienced user can implement in practice, will help minimize the likelihood of traffic loss.

1. Optimize HTML-Code and CSS-, JS-Files

Download optimization is impossible without concern for the “cleanliness” of the code transmitted to the user’s browser when entering the site. A large number of characters in the source code significantly affects the loading speed, so its brevity is a critical success factor.

How to minimize code to speed up site loading

Remove unnecessary characters, markup elements, and source code tags. Automating the process will help add a small insert at the beginning and end of the HTML-code of the site.

This method of buffering HTML-content is quite useful, but it can create an additional load on the random access memory.

Group the same type of CSS files and JS files. Free PHP applications like JCH Optimize, Cloudflare or Minify, which are copied into a separate directory and pass through all the site files, will help to combine the elements.

2. Remove Extra HTTP Requests

Uploading page elements (javascript, images, CSS, and flash files) takes up the lion’s share of system resources when loading a site. HTTP requests for such elements noticeably slow down the site.

To avoid “extra” requests, you need to reduce the number of components of the page. This will entail a proportional decrease in server calls and will speed up the loading of the site.

This can be done in several ways:

• Combine multiple images into a single graphic file (CSS sprite);
• Use inline images (inline-pictures) in the page style sheet;
• Multiple CSS files or scripts on one page merge into one file;
• Minimize the number of scenarios and plugins.

3. Arrange JavaScript and CSS in the Right Order

It is recommended to place the CSS files at the top of the page code, and the JavaScript at the bottom. After this optimization, static content will be loaded first, and then only dynamic graphics.

Flash elements or animations that require more resources to download will not “pull out” forward and spoil the impression of the site from the first seconds. This will ensure a smooth download of content and increase the aesthetic appeal of the resource.

4. Reduce the Number of External Scripts

External scripts are pieces of code (texts) that are accessed via an external link. Links create additional requests to many different servers, which ultimately slows down the site. To avoid this, it is recommended to use mainly local scripts embedded in the structure of the source code of the page.

Of course, focusing on local scripts will create certain limitations in the appearance and functionality of the site. But the resulting download speed advantage is worth these “sacrifices.”

5. Enable Flush

This PHP-functional allows you not to wait until the user’s server loads information from the resource, but to output it in parts. While the data is transmitted to the browser, the open window will not remain empty but will be smoothly filled with loadable elements of the site. Such acceleration is especially necessary for web resources with a complex interface and high traffic.

It is better to place the flush function at the beginning of the page source code, immediately after the head. From the header, HTML content will open faster, and you can also enable parallel loading of CSS and JavaScript elements.

6. Cache the Pages

Caching saves some information from the pages of the site (flash, graphics, JavaScript and CSS) to the user’s browser. On the next run, these files are instantly downloaded from the browser, giving the site extra speed.

You can enable caching by adding an expires header to the HTML code. WordPress sites are easily cached using the installation of plug-ins with free or partially free functionality, such as W3 Total Cache, Cache Enabler, or Zen Cach.

For new sites, it is better to use caching only after full readiness for launch. If you enable the feature during development, further changes may not be displayed correctly on the site.

7. Use a CDN

Content Delivery Network – a chain of servers scattered in data centers around the world to increase the speed at which content is transferred to visitors. The closer the visitor is geographically from CDN servers, the faster the data packets from the site are transmitted.

The use of CDN is especially important for content and high-loaded portals, whose primary audience is very far from physical servers. This service minimizes waiting time for downloads from overseas sites, contributing to an increase in their ranking in local search results. After all, the content is downloaded from the server storage nearest to the user in his country.

8. Optimize Graphics And Video

You must select the correct graphics and video format, as the file format directly affects the speed at which information is presented to visitors.

Recommended formats for different web content:

• SVG – for vector logos and simple interface elements;
• PNG – for schemes and non-vector logos;
• JPG – for photos and images;
• MPEG4 – for video and animation.

Also for video and animation, a relatively new WEBM format is available. In most cases, it provides a smaller video size with the same quality. However, the form has limited browser support (for example, there is no support in the macOS / iOS Safari browser). Therefore, it is recommended to use a WEBM file as a priority video source and install MPEG4 as an alternative source. You can also use the only MPEG4 if sharing is unacceptable or inconvenient.

Separately, we note that the vector format (SVG) allows scaling without loss of graphics quality.

Stages of image optimization

Step 1 – Reducing the size of the image.

Many popular CMS, such as WordPress or Joomla, have built-in plug-ins to optimize images from the original. But this method creates an additional load and can slow down the site. Each time the page loads, the browser first accesses the source code, and only then resizes the image on the fly.

To avoid loss of speed when loading images, graphic editors built into the OS, such as Preview (Mac) or Microsoft Paint (Windows), as well as online services with similar functionality will help. Working with them will require minimal skills in working with graphics.

Step 2 – Compress the file before downloading.

Even after optimizing the image size, its “weight” is usually still far from optimal. Convenient and free services like ImageResize or TinyPNG help to reduce the size without loss of image quality. Most of the processes here are automated. The user only needs to upload files and download already compressed to the optimal image size.

9. Apply Gzip File Compression

Gzip is a simple method of compressing site files to save channel resources and speed up loading. Using Gzip, files are compressed into an archive that the browser can download faster, and then unzip and display the content.

Enabling the use of Gzip is quite simple – you just need to add a few lines of code to the .htaccess file. For example, when using the Apache web server, the mod_gzip module is available for webmasters, in order to activate Gzip, in this case you need to add such code to .htaccess

Gzip-file compression is done to reduce the number of requests to the server from a browser. Put, this technology reduces the initial weight of files to 70% to speed up the download.

Way to Embed Gzip Compression

Add the following code snippet to the “.htaccess” web server configuration file.

On Apache server

# BEGIN GZIP COMPRESSION
<IfModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</IfModule>
# END GZIP COMPRESSION

On Nginx server

gzip on;
gzip_comp_level 2;
gzip_http_version 1.0;
gzip_proxied any;
gzip_min_length 1100;
gzip_buffers 16 8k;
gzip_types text/plain text/html text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript;
gzip_disable "MSIE [1-6].(?!.*SV1)";
gzip_vary on;

10. Change Hosting

The most basic method to speed up downloads is to change the hosting provider. Saving on resource allocation often leads to a significant deterioration in the quality of services, which undermines all attempts to speed up the site on the vine.

If manipulations with content, code, and plugins do not bring results, it’s time to think about choosing a more decent “home” for the site. On a quality hosting with high availability and thoughtful technical support, the Internet resource will receive a powerful impetus to increase the speed of work. And this will be appreciated by a grateful audience.

The Most Important Thing Is…

It is necessary to strive for accessing the site for no longer than 2-3 seconds. It does not matter if the site opens for 2 or even 3 seconds, but if there is more, and then this is a reason to think about accelerating the site load.

You also need to understand that there are two parameters for page load speed.

The first is the speed at which content is displayed (at this point the page is already open and shown to the user, while the transparent page indicator is still displayed until all static files and asynchronous scripts are connected).

Moreover, the second is the speed of the actual formation of the page, when all that had to be connected was connected. You need to focus on the first parameter i.e., no more than three seconds must elapse before the site layout is displayed.

Conclusion

You can not ignore such a figure as the speed of loading the site. It was he who from the first seconds, creates a comfortable environment for visitors. The faster the user gets the desired content, the higher the likelihood that a positive image of the resource will be formed and loyalty to it built.