10 Steps – SPEED up your WebSite

Gary Eckstein Search Engine Optimization 7 , , , , , , , , , , , , , , , , , , , , , ,

Print Friendly Print Get a PDF version of this webpage PDF

Load speed of WebPages is increasingly becoming important, not only for Search Engine Optimization (SEO) but also because people are becoming ever more intolerant of slow Websites. As Internet network speeds have increased (ADSL, 3G, WiMax etc.) so content of Websites has increased therefore negating some of the benefits of faster networking.

The obvious question that many people on my SEO and Web related courses ask is how to improve Website Speed. There are two factors here; Website speed and Webpage speed. Both are interrelated but probably best described separately (recommendations include on-page and off-page factors and range between non-technical to fairly technical):

1. Improve Website Speed

Website performance includes factors that will influence the entire site and every affected Webpage. The obvious candidates for improvement are hosting your Website with a high availability provider, ensuring that your Website host has high-speed servers and so on. Some other factors to consider are:

1.1. Host in the same country as your primary target audience

Having your Website hosted close to your target audience can realize big benefits in Website speed. Website I have targeting the U.S.A. are hosted in the U.S. whereas this Website is hosted in Australia due to my primary audience being located in Australia. There are various good cloud hosts such as Amazon EC2 which simultaneously host and deliver from multiple geographic regions. Although often more costly, for busy Websites with multiple targeted countries Cloud hosting is likely beneficial.

1.2. Use Expires header.

Expires header instructs compatible browsers to store the file and use that local file for reuse instead of downloading the file from the Website. An expiry date and time is added according to settings in the .htaccess file and the file is only downloaded again if the expiry date and time has passed or if the browser is otherwise instructed to download all files again (e.g. ctrl + F5 in Firefox). Expires Header settings hugely benefit visitors that revisit your site.

Here is how to enable Expires Header for gif, png, jpg,jpeg, ico, css and javascript:

1. Copy the blue text below

# BEGIN Expires header

ExpiresActive On

ExpiresDefault A0

ExpiresByType image/jpg A1209600

ExpiresByType image/jpeg A1209600

ExpiresByType image/ico A1209600

ExpiresByType image/gif A1209600

ExpiresByType image/png A1209600

ExpiresByType text/css A1209600

ExpiresByType text/javascript A1209600

# END Expires header

2. Open the .htaccess file of your Website which will be in the same folder as index.php or index.htm or similar (open .htaccess with notepad, notepad++ or similar).

3. Paste the copied text into .htaccess at the next line after text already in .htaccess and save changes.

The A1209600 text as entered into .htaccess determines the time for the files to be stored by the browser. 1209600 is calculated as 60 seconds x 60 minutes x 24 hours x 14 days. If you don’t amend affected files often then I recommend increasing the time to, say, 31 days (of course, renaming files on your Webpage/Website will make browsers download the file).

1.3. Use caching

Server-side caching benefits include the minimising of code execution. For example, on almost all websites that include multiple pages and/or anything beyond just plain text multiple files are referenced in compiling the final Webpage. This means that every time a request is made to view a webpage, multiple files are run to produce the output which all results in execution time. One way of eliminating the need for the running of all the files every time a page is viewed is to use caching. Caching stores the files and/or output in a very easily and quickly accessible ‘dynamic’ memory/storage for a period of time. Although caching may not provide significant performance enhancements for Pages accessed infrequently, for busier sites, caching provides considerable speed benefits.

The ‘WP Super Cache’ WordPress plugin is popular in order to enable Website caching.

1.4. Minify

As described on the main minify page; ‘[minify] combines multiple CSS or Javascript files, removes unnecessary whitespace and comments, and serves them with gzip encoding and optimal client-side cache headers’. I use the ‘WP Minify’ WordPress Plugin and have measured good speed improvements using this performance enhancing Plugin.

1.5. GZIP

Most browsers support GZIP compressed content. HTML, CSS and script files are made far smaller when zipped. When configured, content which may be compressed is zipped at the server prior to being send to the browser. As the filesize being sent is often more than 70% compressed the speed of transfer is quicker than with a non-compressed file.

Unfortunately the ability to implement server side compression is occasionally restricted by hosts however on Apache servers is it worth attempting enabling GZIP as described at the Apache mod_deflate page. I use the

‘WP HTTP Compression’ WordPress Plugin which does a great job by just enabling the Plugin.

Note: Minify and GZIP can work well together however always test that there are no conflicts or adverse affects introduced through performance enhancing measures.

2. Get Better Webpage Speed:

2.1. Less is more

Don’t put large amounts of content on a single page; rather split large pages into multiple pages (e.g. sub-pages or parent/child pages). The larger the page size (in kb) the slower the load-speed. Simple!

2.2. Image Size

Images on Websites are effective and used for multiple purposes from photos to maps to logos and so on. Images are usually the biggest on-page means of either slowing down or speeding up a Webpage. An image should always be as small in size as practical (in kb). Ways of making images more Web friendly are; select the most appropriate image filetype to use, Use the lowest resolution while maintaining acceptable quality, use multiple smaller images rather than a single large image and reduce image dimensions.

2.3. Host Images Locally

There are two basic reasons why it is better to host your own copy of an image rather than link to an external image; external images not hosted by you may be removed by the owner at any time and locally hosted images are faster to render due to no DNS resolution being needed. Of course, always ensure that any images used are either your own or are licensed

2.4. Better/Less Code

The word ‘code’ frightens many people however there is no need to panic; there are two basic code related best-practice activities which will help Site speed.

1.) Unnecessary code must be omitted: The best way of doing this is by using a standards compliant Web-management system such as Drupal , Joomla or WordPress. The likes of these three, and others, are continuously improved to make them faster and more code efficient.

2.) Put JavaScript last: Wherever possible, place JavaScript after content e.g. MyBlogLog requires a line of code to be placed on the WebPage so that some JavaScript is run every time the page is viewed (this enables visitor tracking by MyBlogLog). JavaScript such as this takes time to run and there is no benefit in having it run before content that is viewable to your visitors. By placing the JavaScript after content, the viewer of the Page is served content faster.

2.5. Measure

Use the free tools by Google (Page Speed) or Yahoo (Yslow) to determine just how slow or quick your Page load speed is. These Firefox add-ons (both also require the Firebug Add-on to be installed) provide recommendations for improving load speeds. All the recommendations in this article will assist in getting a higher score with Yslow and Page Speed however it is always advisable to seek bottlenecks and continuously improve load speeds.

On various WordPress and non-WordPress sites on which I have implemented these recommendations I have seen a 50% improvement in Webpage load speed as measured by Yslow.