Tips to Optimize Speed of your Website

The user experience depends on the performance and speed of your web pages. So, if your website is too slow, you will lose visitors, as well as possible customers. Besides that, search engines such as Google do consider the speed of your website when it comes to search rankings. So, always take measures to optimize speed of your website.

top ten tips to optimize speed of website:

1. Apply a CDN (Content Delivery Network)

The location of your site user from your web server affects the speed of your site so much. The far your users are from your web server, the more data the distance that transmitted data will travel. Thus, ensuring your content is cached across many geographical loccations assists in solving this issue. In most cases, your operating cost will be increased by a CDN.

But, will, without doubt, get some speed bonus. Among the best CDN to use are Amazon S3, and MaxCDN.

2. Stop Displaying Text in Images

Text in an image is entirely not useful for SEO and inaccessible to screen readers. Also, displaying text on images raises your web page's load times as more images translate to a heavier web page.

3. Optimize Your Web Caching

Apart from utilizing caching systems, ensure you make website which use web caching to a greater extent. Web caching happens when the web browser caches the files for later use. Among the things that can get cached by browsers are images, JavaScript files, and CSS files.

The basics caching is like putting JavaScript and CSS code which get utilized in many pages in external files. But, there are many other methods of ensuring you cache your data in any effective manner. For instance, you can set HTTP response headers like Expires and Last-modified to minimize the requirement for re-downloading specific files whenever a user revisits your website. This is a crucial step to optimise speed of your website.

4. Optimize How You Write Code

Examine your source code. Are all the tags you have used necessary, or you can utilize CSS for assistance in the display? For instance, rather than applying em tag along-with h1 tag, as shown in the image. Use CSS in making your headings italics with the font-style property. Writing your code well minimizes the file sizes of your CSS and HTML documents. Also, it makes maintenance easier.

5. Defer Loading Content if Possible

Ajax lets you create web pages which can be updated one at a time whenever you want. So, rather than reloading a whole page whenever a user takes some action, you can update sections of the page with ease.

For example, let's assume you have an image gallery. The images files are larger and heavy, and thus might slow down the loading speeds of your web pages. So, rather than loading all the images when someone visits your web page, you only show the thumbnails of the images. After that, if the user clicks the thumbnails, you can request complete images for your server one at a time, and update the entire page.

As a result, if the user wants to view some few images, they will not wait for all the images to download. This kind of development pattern is known as lazy loading.

Moreover, web development libraries such as MooTools, Prototype, and jQuery may make the loading of deferred content easier to start.

6. Do Not Resize Images in HTML

By default, an image is 1280 x 900 px in dimension, However, what do you do if you want to make it 400 x 280 px? You should resize and resave it using an image editor such as Photoshop, rather than using the width and height features of HTML. For example, <img width="400" height="280" src="myimage.jpg" />. Reason being, by default the file size of a big image, is always bigger compared to a small image.

Thus, rather than resizing your image using HTML, resize it with an editor such as Photoshop, and then save it like a new file.

7. Optimize Your Image Sizes Using An Appropriate File Format

It is possible to optimize the size of your files without losing the quality of the image, through a selection of an appropriate image format. For instance, JPG format is most cases showcases photographic images as smaller file sizes. Thus, use PNG format if you require the image transparency that it provides.

Furthermore, there are so many tools which you can utilize in reducing the file weights of your images.

8. Utilize External JS And CSS Files

Whenever a user loads your web page for the first time, external sources such as CSS and JavaScript files will get cached by the browser. So, it is good to put them in exernal files, rather than inline CSS and JavaScript files to optimize speed of your website.

Besides that, utilizing inline CSS improves the rendering time of the web page. In fact, defining everything in your primary CSS file allows the browser to perform minimal work when rendering the page.

This is because it knows all the style requirement that it should use.

Also, utilizing external JS and CSS files leads to easier maintenance of your site. Reason being, global files is all you require to maintain, rather than code scattered in many web pages.

9. Loading JavaScript at The End of Your Document

Loading your scripts at the end of the page is the best practice, instead of at the start. This allows your browser to render everything before starting with the JavaScript. As a result, your pages become more responsive.

This is because JavaScript functions by blocking anything below it from rendering up to the time it is done downloading. Therefore, if possible, you should reference JavaScript before your HTML documents close <body> tag.

10. Utilize Caching Systems

Is your website connecting to your database to make similar content? If so, you should start utilizing a caching system. If you have a caching system, your website needs to make the content once, rather than making it whenever your users visit the page.

Also, you should not get worried because caching systems refresh their caches based on the period you have set up. Hence, even changing your web pages at a constant rate might get cached.

Further, famous CMS's such as Drupal and WordPress have static caching attributes which change powerful generated pages into static HTML files. This is to minimize un-important server processing. The cache page feature in Drupal is found in the core. On the other hand, WordPress has many plugins like WP Super Cache.

Still, if possible, you can install database caching, as well as server-side scripts caching systems on your web server. For instance, PHP has add-ons known as PHP accelerators, which enhance performance by caching and other different ways. A good example is APC. Also, database caching minimizes the work linked with database access/read/write procedures. As a result, the performance and scalability of your web apps improve.

Summary

The speed and performance of your web pages are vital in search rankings by search engines. Also, this determines if your site visitors and potential customers will revisit your website. So, you should optimize the speed of your website.

In case you have any suggestion, comment, or question regarding how to optimize website speed, use the comment section.

RECENT NEWS

CLIENTS REVIEWS

I have been working with the team for a few years now. They have developed a stunning website for me and now they are maintaining it for me. They are reliable, fast, conscientious and highly skilled. I would not have been able to run my eCommerce business without them. Highly recommend!

Founder of Exclusive Outdoor Living

Vicky Hines

Working with Helpbot was really good. I hired them for revamping my website & doing its SEO. And I was just amazed at the results and the professionalism showed by them. I recommend Helpbot to everyone looking for website development and maintenance.

Ceo/Founder of Millenium Contracting

Tony Veizis

Sid from the get go was very professional. He suggested and implemented various tools that will enhance the back end operations. Now, I have signed up for one year website upkeep. I am currently discussing the possibilities of Sid migrating and revamping of my another e-commerce website, I strongly recommend his services.

Director of Full Potential Learning Academy

Subbarayan R Ph.D.

Helpbot has been outstanding to work with! Helpbot has a team of highly proactive individuals who completely understood what we were trying to accomplish and came up with the creative development of our goals. I highly recommend them!

Professional Celebrity Hunter - PD Safari

Peter Dafner

I have been working with Helpbot for the past 1 year and integrating them more and more into our business. Their dedication to our projects has been first class. They are professional, efficient and a pleasure to deal with. I wouldn’t hesitate to recommend Sid and his team to look after your development and maintenance needs.