What is Website Speed Optimization (WSO)?

When Google announced that one of the main factors that affect search ranking is website speed, the way website owners and webmasters design and re-design their websites has dramatically changed in response to the website speed search ranking criteria. This has also become one of the foremost considerations in Search Engine Optimization (SEO).

What is Website Speed?

Website speed is a measure of time how long a website (or a webpage) responds to web requests. Practically, downloading a website depends upon the user’s connection rate. Standard connection rate varies from one geographical locations to another. That is why website speed is commonly measured on a 56kbps modem connections or T1 connections. Google might somehow consider the connection rate discrepancy among internet users worldwide so rating your website speed in one location may differ from one place to another depending on the average connection rate per geographical region.

Why Google Stress So Much on Website Speed?

Practically, faster websites could save operating costs. It is a new measure that Google imposed for their search engine optimization criteria. Google, just like any other technological innovations, are getting obsessed with speed. Consider a user who is not be happy on the first page of Google SERP in response to his query because these websites load slowly. This could affect the user’s attitude towards using search engine as a primary “oracle” portal. Besides, numerous studies claimed that conversion rates are far higher for websites that load faster than their competitors that load slower.

What are the Factors Affecting Website Speed?

1. TOTAL HTML - the total number of HTML files on a particular web page (including the main HTML file).

2. TOTAL OBJECTS - the total number of objects that will affect web page delay.

3. TOTAL IMAGES - the total number of images on a particular web page.

4. TOTAL CSS - the total number of external CSS files on a particular web page.

5. TOTAL SIZE - the total size of a particular web page measured in bytes, which greatly affects 56kbps connection rate or lower.

6. TOTAL SCRIPT – the total number of external script files on a particular web page.

7. HTML SIZE - the total size of HTML file. Usually affected by the HEIGHT and WIDTH webpage images.

8. IMAGES SIZE - the total size of in a particular web page.

9. SCRIPT SIZE - the total size of external scripts in a particular web page.

10. CSS SIZE - the total size of r external CSS on a particular web page.

11. MULTIMEDIA SIZE - the total size of all external multimedia files.

What are the Good Parameter of These Factors Affecting Website Speed?

1. TOTAL HTML – Recommended is 1 which most browsers can multithread. Minimizing HTTP requests is key for web site optimization.

2. TOTAL OBJECTS - Above 20 objects per page accounts more than 80% of whole page latency. So 20 objects is advisable per web page.

3. TOTAL IMAGES – Above 20 images per page accounts more than 80% of whole page latency. So 20 oimages is advisable per web page.

4. TOTAL CSS – Arounf 3-4 external CSS files.

5. TOTAL SIZE - Less than 100K to achieve sub 20 second response times on 56K connections.

6. TOTAL SCRIPT – Ideally, 1-2 scripts only.

7. HTML SIZE - Less than 50K.

8. IMAGES SIZE – Less than 100K.

9. SCRIPT SIZE – Less than 20K.

10. CSS SIZE - Less than 8K.

11. MULTIMEDIA SIZE - Less than 10K.

What to Do to Achieve Higher Website Speed Optimization Index?

1. TOTAL HTML - Minimize the total number of HTML to 1

2. TOTAL OBJECTS – Reduce the total number of objects of your website to 20 objects per page. Try to combine, refine, and optimize your external objects. Replace graphic rollovers with CSS rollovers to speed display and minimize HTTP requests. Consider using CSS sprites to help consolidate decorative images. Using CSS techniques such as colored backgrounds, borders, or spacing instead of graphic techniques can reduce HTTP requests. Replace graphic text headers with CSS text headers to further reduce HTTP requests. Finally, consider optimizing parallel downloads by using different hostnames or a CDN to reduce object overhead.

3. TOTAL IMAGES - Consider reducing the total number of images less than 20 per page. Try to combine, replace, and optimize your graphics. Replace graphic rollover menus with CSS rollover menus to speed display and minimize HTTP requests. Consider using CSS sprites to help consolidate decorative images. Use CSS techniques such as colored backgrounds, borders, or spacing instead of graphic techniques to reduce HTTP requests. Replace graphic text headers with CSS text headers to further reduce HTTP requests. Finally, consider optimizing parallel downloads by using different hostnames to reduce object overhead.

4. TOTAL CSS – Make it less than 4 total number of external CSS files per page. Because external CSS files must be in the HEAD of your HTML document, they must load first before any BODY content displays. Although they are cached, CSS files slow down the initial display of your page. Remember to place CSS files in the HEAD and JavaScript files at the end of the BODY to enable progressive display.

5. TOTAL SIZE - Consider reducing total page size to less than 100K to achieve sub 20 second response times on 56K connections. Pages over 100K exceed most attention thresholds at 56Kbps, even with feedback.

6. TOTAL SCRIPT - Consider reducing to 1 or 2 external script files. Combine, refactor, and minify to optimize your JavaScript files. Ideally you should have one (or even embed scripts for high-traffic pages) on your pages. Consider suturing JavaScript files together at the server to minimize HTTP requests. Placing external JavaScript files at the bottom of your BODY, and CSS files in the HEAD enables progressive display in XHTML web pages.

7. HTML SIZE – Make it less than 50K. Assuming that you specify the HEIGHT and WIDTH of your images, this size allows your HTML to display content in under 10 seconds, the average time users are willing to wait for a page to display without feedback.

8. IMAGES SIZE – Make it less 100K. Consider switch graphic formats to achive smaller file sizes (from JPEG to PNG for example). Finally, substitute CSS techniques for graphics techniques to create colored borders, backgrounds, and spacing.

9. SCRIPT SIZE – make it less than 20K. Consider optimizing your JavaScript for size, combining them, and using HTTP compression where appropriate for any scripts placed in the HEAD of your documents. You can substitute CSS menus for JavaScript-based menus to minimize or even eliminate the use of JavaScript.

10. CSS SIZE - Make it less than 8K.

11. MULTIMEDIA SIZE – Make it less than 10K.

Useful Tools to Measure and Optimize Website Speed:

1. Page Speed- an open source Firefox/Firebug add-on that evaluates the performance of web pages and gives suggestions for improvement.

2. YSlow - a free tool from Yahoo! that suggests ways to improve website speed.

3. WebPagetest - shows a waterfall view of your pages' load performance plus an optimization checklist.

4. In Google Webmaster Tools, Labs > Site Performance shows the speed of your website as experienced by users around the world (requires Firebug and Page Speed Addons.

Is your website ready for the Speed Revolution?