Free tools to speed up your website

A fast-loading website is crucial. Specially for mobile websites. Surprisingly, not many webmasters give website speed optimization the importance it deserves.

Speeding up your website brings up important benefits:

  • Leads to higher retention and conversions
  • SEO improvement (Google recently announced site speed affects pagerank)
  • Higher visitor engagement

 

Google PageSpeed Insights vs Yahoo YSlow

In this article I will analyze two website speed optimization tools that will help you make your website faster:
Google PageSpeed Insights, and Yahoo YSlow.
These great tools will save you time and money and will give you accurate reports and tips for improving your website speed performance. And the best of all: these tools are FREE!

 

Google’s PageSpeed Insights

PageSpeed Insights is a tool created by Google Developers,
can be accessed from this url: https://developers.google.com/speed/pagespeed/insights/,
also it is available from Google Webmaster Tools, and as an open-source browser extension for Google Chrome.

 

website speed up

Accessing Google PageInsights from Google Webmaster Tools Menu

If you choose to use it from Google Webmaster Tools (GWT), you need to have your website verified on a GWT account, if you don’t have it done yet, I suggest you do it right now, it is fundamental for optimizing the SEO of your website, submitting your website for Google indexing, and a variety of tools that will help you improve your website’s overall performance.

Assuming you already have your website set on GWT, and once you are logged in, go to your website’s dashboard and find on the left hand side menu the last option: “Other Resources”, click on it. You’ll find PageSpeed Insights as one of the available tools.

 Analyzing your website

Once you open it, PageSpeed Insights will run a scan of your website, then it will create a report.
(If you access PageSpeed Insights from the direct URL, just enter the URL you want to analyze, and click “Analyze”)

The generated report will show you these 2 tabs: Mobile and Desktop

PageSpeed Insights Screen

PageSpeed Insights Screen

 

Within Each Tab you will find 2 main sections: Speed, and User Experience.
Each one of them containing the following items:

  • Overall ranking of your website Speed / User Experience (measured from 0 to 100, eg: 75/100)
  • “Should Fix”: the items that are crucial for improving the page load speed.
  • “Consider Fixing”: the items that are not crucial
  • “Passed Rules”: the rules that are ok!, no action required

Below  Should Fix  and Consider fixing, you’ll see the option “Show how to fix”, which will give us a description of the element to be fixed, and nice suggestions on how to achieve that.

Working on the page speed improvements

You can start right away working over these fixes: once you finish the fix, you can re-run the PageSpeed test, to see how the rules are set to “passed” and your  speed ranking increases (sweet!).
Working on most of these fixes should be pretty straightforward if you are an experienced web developer.

Tip: The report gets cached every time we run it, so remember to wait for at least 30 seconds between each report re-run.

Notes: Google PagesPeed Insights doesn’t consider the performance of network connection (which varies considerably), instead it focuses on network-independent aspects as HTML structure of a page, how it uses external resources such as images, Javascript and CSS files.

 

Yahoo YSlow

YSlow analyzes web pages and suggests ways to improve their performance based on a set of rules for high performance web pages, also summarizes page’s components, displays statistics about the page and provides tools for performance analysis.

Yslow is available as an addon for the most popular browsers:

*This Review was made using YSlow as a Firefox/Firebug complement.

Analyzing your website

YSlow provides a very practical interface, divided into 5 Main Tabs:

Home Tab: on the first one we have the welcome screen, with the big “Run Test” button, once you click it YSlow analyzes your website and shows you the “Grade” tab.

website speed optimization. Home Tab of YSlow complement for Firefox

Home Tab of YSlow complement for Firefox.

Grade Tab: On this tab, you can check your overall page Grade, The page is graded based on 23 testable rules for high performance web pages, based on these grades values, you will see the overall Grade.

The rules are listed in order of importance from most important to least important. Each rule is assigned a letter grade A through F, with A being the highest grade.

Speed up your website using YSlow. Speed optimization tools

YSlow Grade Tab. Overall performance score.

You can click on each rule to see a description of the rule that can be improved, also a Read more link for further information.
Work on the rules you can fix, try to reach an “A” whenever possible, and run again the test to check the improvements.
In my opinion, an overall “B” grade is an excellent score.

Components Tab: will bring up a list of components, along with their  size in Kbytes.
Statistics Tab: will show you the total of HTTP requests, along with the total weight measured in Kbytes, and some pretty graphs.
Tools: In this tab you will find links to very cool tools for analzing and minifying your Javascript and CSS files

Working on the page speed improvements

Working on the speed improvements with YSlow is very fast, YSlow allows you to re-run the test inmediatly right after you upload your changes, no need to wait for cached results.
It also provides an option to auto-run YSlow each time a web page is loaded.

 

Conclusion:

These two website speed improvement tools are great resource for webmasters who want to tune-up website performance.
Google PageSpeed Insights focuses on making your site more mobile-friendly and is constantly improving (it has recently added more recommendations on mobile usability), Yslow provides powerful and detailed overall rules and is available in a wider range of  browser addons.
I recommend using both tools for optimizing your website speed, they both complement well between each other.

Don’t freak out if you don’t reach 100/100 Speed Ranking!
If you run the test on big companies websites, you’ll notice they never reach 100% Speed Ranking, or an “A” grade on YSlow.
As an experienced web developer, I can tell you it is very difficult to have 100% speed score, common case scenarios involve websites that require the use of lot of external resources as several js files,  css files and media elements, that will impact on page load speed even after being minified/compressed. Also some fixes may involve doing some setup on the server side, and some times in real world webmasters don’t have the right privilegies, or will need to contact their hosting providers.
So, if you reach to earn at least some points of Speed Ranking, and reduce web page loading time, that will be a nice reward!

Now you know these great page speed improvement tools, it’s time to speed up your website!

 

Related resources:
For advanced developers, here is an excellent article from Moz.com with tips to speed up your site: http://moz.com/blog/15-tips-to-speed-up-your-website

Related article: Mobile Usability Tool

Leave us a comment on which one is your favorite tool, share your experience below:

3 Comments

  1. Firebug add-on that benchmarks your web page and uses a set of best practice rules to let you know how you can speed things up. Play around with the tool for a while, though, and you soon begin to spot the differences.

  2. good tips i use & implement this are tips in my website to increase my website speed…thanks for the sharing….

Leave a comment

Your email address will not be published.


*