If you are reading this article it is because you are convinced of getting a faster website, and you know at least some of the advantages of achieving results in this field.
Let’s see first the main advantages of achieving a good optimization of a website.
Secondly, I’ll get to the point and I’ll leave you quick application keys to achieve significant results. Some of them, in the best of cases to cut loading times in half or even more.
Next I am going to leave you some keys of easy application that can improve the speed of your site until achieving a load in half the time.
Exactly HERE YOU WILL FIND…
- Because the loading times are important.
- As know the loading speed from your site.
- What to do, that is, measures to improve your load times.
Content
- Why load times are important?
- Measure the loading speed of your website
- Google’s PageSpeed tool
- tools.pingdom.com
- How to improve loading speed?
- Optimizing the weight of images
- Enable file compression
- Enable browser caching with htaccess.
- The cache or ‘caching’ of a website
- Cloudflare or CDN
- Conclusions on how to speed up your site
Why load times are important?
The load times of your pages, and I speak in the plural since each page can be positioned individually, are essential to achieve:
- SEO: Better positioning in search engines.
- UX: Better user experience for the customer.
- CRO: Greater number of conversions with your website.
fighting every tenth of a second chargeyou will be beating your competitors as if it were a race and, although the content is still the highlight of a site, when in doubt, google will always give a push in the search results to those who offer a better user experience.
Measure the loading speed of your website
Despite the fact that many times, with a simple glance you can appreciate the site response speedwe should try know what is the loading speed in seconds from a page on our site.
Tell you that you should always keep in mind, that not by knowing the loading speed of a specific page, this speed will be the same for the rest of your site. The loading speeds as well as the positioning are independent, with which we must try improve overall site speed and then specifically from pages with greater importance.
That said, let’s see what tools we can use to measure the speed and optimization of the pages of our site.
Google’s PageSpeed tool
We can say that this tool is the reference, not the best but the one that is directly controlled by Google, among its results we find a score relative to site optimization (not speed). Currently, with the latest google update, we see the real browser load times of the users, that is, with the limitations of their internet connections.
tools.pingdom.com
Apart from having the best interface and the easiest to use, this tool shows detailed results, and is a good reference to know the optimization level of our site and how to improve it.
The tool allows us to indicate from which server we want to do the test. This differential detail is very important when making measurements. Be sure to choose the server closest to the server you use to host your website.
This page also provides technical details of file weight, etc. So that measures and solutions can be taken. The report is in English, but you don’t need a great knowledge of this language to interpret its results.
How to improve loading speed?
Here’s the nitty-gritty, now that you know if your site is fastacceptable or, unfortunately, it is very slow, you will ask yourself how to increase loading speed.
To make the changes, you will mostly need technical knowledge of web development, although below I will comment on the 4 keys that can be done with basic knowledge of web development.
Broadly speaking, you can improve the speed of your site by attacking the following problems:
- Reducing the weight of the images.
- Compressing the css, js and html files that are sent to the user.
- Indicating the expiration date of your files.
- Applying a caching system to your website.
- Using a CDN like Cloudflare.
Optimizing the weight of images
Approximately half the weight of a page are images. More today with the visual approach of the sites and the quality of these.
If, on the contrary, most of the weight of your website falls on JavaScript libraries or CSS style sheets, surely you have a bigger problem on your hands and more tedious to solve (which requires a web developer).
The images of a site can be optimized in several ways: either using software for this purpose such as photoshop or even the painting to adjust the resolution and extension, or through the settings of the CMS you are using.
WordPress, for example, allows you to specify the resolution settings for large images on your site as thumbnails. The more exact this is with respect to the final visualization, the better the optimization will be.
As a strategy I recommend that you find out the maximum possible size that can take your images on your website and configure your site based on it. To do this you can use a monitor with a high resolution, the average size of the users of a site being those of a screen full hd.
Finally, a simple trick to drastically reduce the weight of your images is saving your images “for web” in photoshop.
In this way you must:
- Try what the image represented in pixels is suitable for the final visualization. Inspect with the browser and resize.
- Use an extension that compresses the images as much as possible: JPG minimum and if possible webp it will be your best choice.
Enable file compression
If you have passed the previous tests on your site, a Compression section will appear, and here is an easy problem to solve.
The file compression can reduce the size of the files your website visitor receives, reducing style sheets and HTML content by up to 70%.
This function is performed by the web server you use, and is usually available on almost all decent hosting.
Make sure you have compression enabled and review this section. Much of this work can be done in the file .htaccess if your CMS does not have an option for it.
In Joomla, for example, you will find an option that enables compression with just one click.
Enable browser caching with htaccess.
With the browser cache I am referring to the client cache, it is an independent task to your site, but without the proper configuration in the .htaccess file, it will not be activated.
If your visitors’ browser cache is not activated this results in the user downloading the entire page every time they change pages on your site, despite the fact that many files are the same on all pages.
For enable browser cache what we will really do will be specify an expiration date for files from our website. Here is a quick snippet that configures the expiration of your site’s files (images, style sheets, scripts, etc) for 1 month:
<IfModule mod_expires.c> <filesmatch "\.(jpg|JPG|gif|GIF|png|PNG|css|js|php)$"> ExpiresActive on ExpiresDefault "access plus 30 day" </filesmatch> </IfModule>
The cache or ‘caching’ of a website
The measure probably most powerful site optimization. This is a relatively easy measure to fix.
The cache is part of the work of your website in programming by the server or backend development. Enabled, this feature will save a lot of response time from your server.
Happily for this problem there are many developed solutions, all of them working well, some better than others. To enable caching on your site you will need a plugins either module for your CMS or in case of being a custom development you will need a library for this purpose.
if you use wordpress I recommend you WP SuperCache o W3 Total Cache since it has a lot of documentation on the internet, usually in the form of a tutorial and it gives good results.
If, on the other hand, you are a programmer and you have a custom site, I recommend PHP Fast Cache, which is a fantastic library and very easy to implement. I use it myself on this site.
Cloudflare or CDN
If you know what a CDN is or at least it sounds great to you, you are already one step ahead of the newbies.
If you don’t know him, I’ll tell you: cloudflare It is a CDN that does much more than a CDN, it gives you speed, page caching, security, and even decent web analytics.
It may be that with this explanation you have stayed a bit halfway, but don’t worry, in another article I will explain in depth how to configure it to get the most out of it.
But cloudflare is:
- Free: yes, it has a FREE account that allows you to take advantage of it and start speeding up the performance of the page in a few clicks.
- A DNS zone manager from PM: configure your domain pointing to your account, and configure DNS from a site.
- A CDN: caches your images, in many cases optimizes them (usually with the paid account) and reduces the load on your server.
- minify your JS, CSS and HTML files effortlessly. Yes, it manages it automatically, with a click.
- compress the server’s response: with brotli.
I imagine that you are already understanding why you should have cloudflare on your site: it is simply great.
Of course, like everything, at first it is difficult to master it.
Conclusions on how to speed up your site
The loading or response speed of a website is very importantnot only does it affect the short patience of visitors, but it is telling Google and other search engines that you care about the quality of your web page.
Also, as you have seen, some of the measures to improve this are relatively simple, and thanks to advances in CMS and content available on the internet, we can achieve results in just a few hours.
As a final point, tell you that if you want take your site speed up a notch and eat the competition, contact professional developers and make an investment in this aspect, in the long run you will reap the results in SEO and user experience.
It is very probable that even your readers/clients will choose your site over the competition if it is refined and allows agile navigation on any device.