In many insances I use Adobe Dreamweaver. This is bacause of it’s instant-ftp upload facility which is ideal for wring and testing on the fly. One thing that became aparent yesterday was my Dreamweaver automatically sets the document encoding to ‘iso-8859-1′ and a great deal of the time we want to use ‘utf-8′.
Set ‘uft-8′ encoding as standard by going to Edit > Preferences. Select New document and the option is here:
Now Google haven’t quite said how much site speed is a factor in their search rankings algorithm, and have confirmed that quality content is still the most important thing, but they have confirmed that speed is an algorithmic factor none the less.
So I’m going to show you some tools that will help you speed up your website, but before I do that I’m just going to discuss the following two points.
Site Speed is Relative
First of all it’s important to understand this point. A website that has 70 images on their home page will never load in 0.00001 second. This is becuase the browser cannot and will not load all the images at once and even if the images are only 3K each, they will still be downloaded two or three at a time.
Site speed is relative in that when we talk about site speed we have to make concessions for what is actually on the web page at hand.
First Page Load vs Repeat Page Load
We are presuming at this point that Google will make allowances for the first page load against the second page load. This is bacause we all know that in the first page load on a website sets cookes and creates sessions etc. which are things it does not do on the second load. This is relevant for tool number 1 below.
The first step to speeding up your website is looking at what exactly it’s loading. This tool will show you what images, javascript etc. your website page is loading and it also does a second page-load test as described above.
Once this tool has done it’s test it shows you how long it took to start rendering your page and how long it took in total to complete loading. In my opinion if your page takes any longer than 2 seconds for an basic HTML website and 5 seconds for an e-commerce website, this is too long and you should look at ways to speed up your site. Tools for doing so can be found below.
2) Suggestion: Move Javascript Files to The Bottom
Okay so this one isn’t a tool. It’s a suggestion. Move your javascript files to the bottom of your HTML document. Doing this will allow your images and stylesheet(s) to load first and render your page faster. There are some instances where this is not possible, in that case use the tool below to compress your JS.
3) Tool: Javascript Compressor
Compressing your Javascript can reduce the size of your javascript files. Just compressing one small javascript file can reduce the file size (and subsiquently load time) by up to 80%. This is a significant improvement and you will see speed differences straight away.
4) Suggestion: Use CSS Sprites
Using CSS sprites is a great idea. By using css sprites you combine all your background images into one single image. This allows your browser/css file to download one single image and not download multiple images, hence being faster.
CSS Drive from Dynamic Drive have an amazing tool that allows you to compress your css files. This is someting I only recommend doing once you have finished developing your website as it will remove all extra white space and it will also remove your css comments if you tell it to. CSS Compressor
6) Suggestion: Different Domains
Host your images on another sub-domain or a totally different domain. Most browsers will only load two or three components at once. For example, Firfox may only load three images at once even if your internet connection speed would allow you to download 2000 images at once.
Hosting your images on a different sub-domain or domain will allow you to almost fool your browser into loading more components simultaneously. An example would be to create an image sub-domain, img.example.com when your website is hosted on www.example.com.
SmushIt is an image optimisation tool that will “smush” images with no loss creating smaller, better optimised images. SmushIt can be used as a firefox flugin.
Okay, so as you will be aware, the last few days have seen the release of a new search engine from Microsoft called Bing. An exciting time for searchers and webmasters alike.
However, something that did occur to me is that we haven’t yet talked about how to track traffic from Bing in our favorite free website tracking software, Google Analytics.
I’m absolutely sure that in the next few days Google Analytics will start to automatically regognise Bing as a search engine but in this post I am going to talk you through making Google Analytics recognise Bing as a search engine so that it does not track as a referring site in the mean time.
Let’s start by examinging you already installed Google Analytics tracking code, you will already have this in your html header:
var pageTracker = _gat._getTracker(”UA-xxxxxxx-x”);
pageTracker._trackPageview();
</script>
This is the “set-up” line of code to initialise Google Analytics on your website. All you have to do is simply add one extra line of code to this javascript as follows:
<script type=”text/javascript”>
var pageTracker = _gat._getTracker(”UA-xxxxxxx-x”);
Posted May 29, 2009 by Spartacus under under Search Engines
Bing!
Wow! What an extremely exciting time - a new search engine!
Every time a new search engine is released, they all seem to do exactly the same thing, look the same and feel the same. There’s no wonder that most of the world is using Google, it’s the simplest thing ever - a simple one line input box and a button.
But aparently Microsoft don’t think the simplicity of Google is enough. Their answer is to bring you a fully featured search engine with all the features of sites like TravelSupermarket.com, Kelkoo Shopping & Weather.com all on one site.
In this new search engine venture Microsoft have aparently realised that there is really no way to compete with such companies as google for relevance based search, which is what has dominated the internet for the last 10 years, but bring you a “simple, organised and consistent” search engine which helps you to make the choice of what it is that you want to find - whatever it is.
For this approach, Microsoft have called this one a “Decision Engine”.
Bing has extraordinary features, many of which you will find on Google and indeed Yahoo!, however Microsoft’s approach is to organise it in such a way that the Bing approach feels much different.
Here are some videos about Bing. Feel free to leave your comments below.
And finally, here’s something to to make you laugh. You will have this in your head forever now!
So over the last 4-5 days I have been hapily browsing, not noticing that the result at page one has site links.
So what’s so strange about that - you ask?
Well… as we all know, Google has site links for almost every website that sits at position one in the SERPS, but usually when the search term directly matches the websites’ theme or name. - See the image on the right…
(What’s also worth mentioning, is that site links only seem to appear when a website’s “home page” is the SERPS result - and research shows, so far, that it’s only the top result that seems to have the google mini site links)
BUT…
As a search engine user you will have noticed that many result pages on google where the website theme did not directly match the search terms do not have these site links.
Mini Site Links
Well, now they do!
See the screenshot on the right: Google have finally decided to show a few of the site links.
This is great news for webmasters as now some of the inner pages of the site are being shown along side their home page.
Site links & mini site links on Google will usually appear when the home page is the page shown in the SERPS.
Posted March 1, 2009 by Spartacus under under General Tips
Microsoft Visual Studio 2008
I have agreed and disagreed with so many people about this point.There are so many arguments as to what is correct when formatting code.
I have always believed that making your code readable is more beneficial that saving disk space in reducing white space in your code etc…
The fact remains that to be able to read your code with ease is it nessecary to correctly format it.
Therefore I am suggesting a formatting style that is now native to quite a few coding & program design programs, such as Microsoft Visual Studio.
The code formatting style of subject is Allman Style.
If you take a look at the attached image (top right) you will see how neat code looks when coding in this style.
This style puts the brace associated with a control statement on the next line in the same column. Like so:
while
{
somefunc();
somefuncelse();
}
finalfunc();
A great advantage of this style is that the control statement is seperated from from the flow of the code, this means that you could easily do something like this:
//while(x == y)
{
something();
somethingelse();
}
This allows you to comment out the control statement and leave the curly braces in place. This is also beneficial in comparison to other programming styles as with the curly brace on the same line as the control statement is easy to loose track of, particularly when you have many nested statements.
Posted January 16, 2009 by Spartacus under under SEO Techniques
This is an interesting subject that has been at the forefront of my SEO meetings all week. Page Rank dilution is when you are linking to what I call an ‘Overhead Page‘ from every other page on your website.
To follow me in this article you will need the following:
I’m going to start with an example of how exactly PR dilution occurs.
Standard Page Rank Distribution is shown above. This is how a typical website works, for example a standard online shop website.
The home page, which caries the most page rank of the whole website, links to every category page, which then links to every product or post page. This is called standard website hierachy and is reflected in most websites including one of the biggest websites in the world, Amazon.
So what’s the problem? You may ask!
Well here’s an example of what the problem is…
Click here for the home page of one of the UK’s leading audio/visual company’s website’s home page. Now, click here for their returns page. Their home page has a page rank of 4. Their returns page has a page rank of 3.
Let’s just think about this for a second. Their returns page is the second most important page on their website! That’s not the page you want Google to show to customers, it’s boring, and I bet that if you “landed” on that page, you would click the back buton. BOUNCE!
So why is this page a PR3 page?
The reason is that this page is linked to from every other PR1, PR2, PR3 & PR4 page accross the entire website! So the link from the home page is passing PR0.5 and a link from other PR2 pages within the website is passing PR0.25. They all add up to PR3.
Why is this a bad thing?
Well, you should retain all sources of Page Rank at all costs. Every link internally is passing PR from one page to another. What you need to do is pass page rank to the more important pages on your website, like your landing pages (like this one) and your product or article (money) pages.
So what’s the solution?
The main solutions is to ensure that no link juice is being sent to these ‘Overhead Pages’ in the first place by adding a NOFOLLOW to your links:
Did you notice the rel=”nofollow”? This instructs Google and other search engines not to credit this link with any “link juice”. Hence imediately all links pointing to this page, will no longer pass it any page rank and subsiquently the pages which would have lost page rank before have now gained more importance.
You should also add the followign line of code to the HTML head of all your ‘Overhead Pages’ on your website.
<meta name=”robots” content=”follow,noindex” />
This is the result:
You should make sure that every page that is a user only page, such as your About Us, Privacy Policy, T&C etc. is classed as an ‘Overhead Page’ and deal with them as such.
I used to rant on about a great piece of software called Multiple IE. It was like a life saving piece of software for designing websites with backward compatibility.
But since the Beta release of Internet Explorer 8, you have had the choice of either designing your website in IE7 or IE8 and doing a few backward compatible fixes for IE6. You couldn’t have IE6, IE7 & IE8 all running at the same time.
Suddenly you can test every Internet Explorer browser from IE 5.5 to IE8. A firefox plugin that can do this would be great, but this is definitely a second best choice.
I still use browsershots.org but without paying their fees, you have to wait hours for the screen shots to appear.
With this software you can simply refresh the page and see it rendered in your chosen Internet Explorer version on the fly!
You will need to have at least IE7 installed on your system and there is a support forum for any problems which you might have.
Absolutely Excellent! - Do you have any comments? Feel free to post them below.
Okay, so that was a bit of a title. But since I wanted it to cover every possible key phrase combination you could have possibly typed in to google I had to write it like that.
Anyway, on to the Firefox Tools:
The first and most important thing you will need to use these tools is the latest version of Firefox.
Web Design Tools:
Firefox Web Developer Toolbar
1. Web Developer Toolbar
Written by Chris Pedrick this tool is absolutely essential for website development.
The web developer toolbar allows you to disable cache, CSS, images or form elements real time allowing you to test and debug your projects on the fly!
You can also use some of it’s amazing other tools like instantly clearing your cache, cookies etc. You can show hidden elements and even show block elements to work out why they aren’t displaying correctly.
With the view source tools you can view standard source, view selected source and even view Javascript generated source - now that is a cool tool.
Firebug is a great tool that places a small “BUG ICON” in the bottom right hand corer of your browser which, when you click on it, allows you to debug HTML and CSS code, and even do CSS and HTML code updates on the fly!
What’s really great about this tool is that there is also a version available for the all new Internet Explorer 8. (IE8 may be the first browser that Microsoft have got right!)
If you are an SEO looking for links and researching your competition then this is an absolute MUST. I dicovered this tool some time ago.
SEO for firefox is a small button that sits at the bottom right hand corner of your Firefox browser and you can switch it on and off as required. If you switch it on whilst searching on Google it will tell you everything you need to know about every page returned. PR, cache date, Y! links, G Links - everything!
There is a smiliar tool to this one called SEO Quake, which I also have installed and I will cover below. Just, this list is in order of my favorite and most used tools.
Search Status for Firefox
2. Search Status for Firefox
Search status employs the work of the Alexa toolbar technology along with that of calculating Google PR and compete’s rating.
Search Status will, like the Google Toolbar, tell you the Google page rank of any page you are currently viewing amongst other built-in features.
I know that loads of people LOVE this tool and probably prefer it to the SEO for Firefox tool but before I get a millione and one people commenting at the bottom saying that this tool is better, remebre, this list is in order of how often I use these tools, not how useful I think they are.
SEO quake, like SEO for Firefox will show you the PR, Alexa Rank, Y! Links, G Likns etc. for every link on a full search results page.
What is a great feature of this tool is that, unlike SEO for firefox, it will show you all this info for the page you are viewing at the top of the page.
I have not really used this tool much but from what I can make of this SEO tool, it adds extra information to Y! Site Explorer and Google Webmaster Tools.
This is a great tool. It is used to measure the performance of a given page on the four biggest social bookmarking websites. Included are Reddit, Digg, Stumble Upon & Delicious.
I have never used this tool. It is installed on my Firefox browser, but from what I understand: Search engine Rank checker is great for recording your performance in the SERPs. You can also create a list of keywords and save as a predefined list for a given website as well as schedule automatic checking.
One thing that people completely forget when planing their SEO campaign is just how important their url structure is to their on-site Search Engine Optimisation.
Google’s webmaster guidelines say the following: (External Link)
A site’s URL structure should be as simple as possible. Consider organizing your content so that URLs are constructed logically and in a manner that is most intelligible to humans (when possible, readable words rather than long ID numbers). For example, if you’re searching for information about aviation, a URL like http://en.wikipedia.org/wiki/Aviation will help you decide whether to click that link. A URL like http://www.example.com/index.php?id_sezione=360&sid=3a5ebc944f41daa6f849f730f1, is much less appealing to users.
Therefore, Google themselves are telling website designers to build websites with urls that are descriptive and logical, therefore entycing the click, you could call this a subtle call to action.
Many people have a PHP or script based website that requires input perameters to produce the page they requested.
With this in mind I am going to show you how to “rewrite” your urls to be search engine friendly.
So does that just look like a bit of a mess? - Let me explain:
Options +FollowSymLinks
RewriteEngine on
These two lines of code tell Apache to switch ON the rewrite engine. Thus telling Apache to interpret the incomming links and resrite them with this rule:
Tool: 
that sits at the bottom right hand corner of your Firefox browser and you can switch it on and off as required. If you switch it on whilst searching on Google it will tell you everything you need to know about every page returned. PR, cache date, Y! links, G Links - everything!
