SEO – Page Speed Analysis

 

Search Engine Optimisation has and always will be a big issue for webmasters. Becoming an easy to find website and highly ranked in the search engine results is on the ‘must list’ for all developers.

Google recently announced that Page Speed will come into their algorithms for search results ranking, which brings worried looks all round.

Besides decent markup for code, well thought web page layouts, linking, alt tags and everything else which goes into creating a great performing website. We now have to think about page load speed as well, thanks Google.

But fear not, Google have released a powerful extension to the Firebug Add on for Firefox to monitor the Page Speed for web pages. If your looking for either click on these links… Firebug | Page Speed


Ok, now your setup we have some work to do on analyzing the page load and problems. Firstly open the page in question, and run the page speed analysis. This will present you with a score for your page and shows problems. Personally I am happy with 90+ (out of 100) for load speeds per page.


Here are a list of some common issues I run into, and how to resolve.

Resolution: This problem often occurs when multiple calls are made to the same domain for information. For example, your code looks for the CSS file and multiple image files from the same domain.
The easiest way to resolve this in my view, is to create some sub-domains which point to your image directories. Such as images.domainname.com, then use your CSS file to put to these links instead. This then means the calls for information is cut down and spread out dramatically.


Resolution: Google is very helpful here. If you have multiple images which can be optimized, the Page Speed Extension will show you the optimized version and option to save. Review the image, save it in place, upload again and Google becomes happier.


Resolution: This is a popular issue for older websites. The problem is that most web pages use resources that change frequently, such as CSS, images and JavaScript. These files take time to download across the network, which will increase the page load time. To fix this and proxy caching I would advise to add the following the HTML head.
<meta http-equiv=”cache-control” content=”public” />
To resolve the image, css and JS cache this can be completed via your htaccess file.
<FilesMatch “\.(ico|flv|jpe?g|png|gif|js|css|swf)$”>
ExpiresActive On
ExpiresDefault “access plus 1 month”
</FilesMatch>
Which in turn should change your score to 100/100 unless there is any other files which may need including.


Resolution: Compression is used to make the files that are being accessed smaller when the browser downloads them. This means they can be downloaded quicker, and in turn page load speed faster. Adding the following to your htaccess file, enables gzip on specific browser and compresses the text based files for download by browser.
SetOutputFilter DEFLATE
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ \
no-gzip dont-vary
SetEnvIfNoCase Request_URI \
\.(?:exe|t?gz|zip|bz2|sit|rar)$ \
no-gzip dont-vary
SetEnvIfNoCase Request_URI \.pdf$ no-gzip dont-vary
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml

AddOutputFilterByType DEFLATE image/x-icon

AddOutputFilterByType DEFLATE text/css

AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE text/x-js
AddOutputFilterByType DEFLATE text/ecmascript
AddOutputFilterByType DEFLATE application/ecmascript
AddOutputFilterByType DEFLATE text/vbscript
AddOutputFilterByType DEFLATE text/fluffscript

AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/vnd.oasis.opendocument.formula-template


Resolution: Another great fix by Google, they supply the minified CSS files for download. This removes whitespace from the CSS file causing faster download for the files. Again download, review and upload the new files. In future, its best practice to do this on design :-)


Resolution: This is caused by looking up external content from elsewhere, such as links to JS files or JQuery. This can easily be fixed by copying the files to the local DNS (your domain name) and reading the files from here.


Resolution: Having multiple CSS files means the browser has to download each in use to find the information for the page. Including all the CSS files into one file can often help on speed. If you have CSS information which is only used on limited pages, I like to leave this not included and link to the CSS file as normal for the pages which it is required. On all other CSS files try to combine this as much as possible and a good score will follow.




Other Aspects: Most other aspects of good Page Speed come with good markup. Keeping the CSS referrals in the head, specification image dimensions, serve scaled images, serve resources from a consistent URL, specify a character set early, combine external JavaScript files, and so much more all comes with great code markup. Having problems? Let us know, or let us do the hard work for you. Website Design | Website Design Quote Form


Let us know your thoughts. Hope this helps.

Tags: , ,

This entry was posted on Friday, April 9th, 2010 at 12:08 pm and is filed under Website Design, Website Development. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

2 Responses to “SEO – Page Speed Analysis”

  1. Steve says:

    Of course, what a great site and informative posts, I will add backlink – bookmark this site? Regards

  2. David says:

    very good information you write it very clean. I’m very lucky to get this info from you.

Leave a Reply