Can anyone explain the difference of these 2? I haven't a clue, when i'm coding I just pick one randomly, whichever works... I know this isn't good, as there must be a reason they are different.

Can anyone please explain?

I don't know the exact differences myself. I am sure a quick google on the subject would find out for me but im now off so I'll be quick.

To me a class is like a category (i.e. we call some people chavs, emos etc lol) where as an ID is exactly that, a unique ID. (i.e. a social security number or fingerprint)

You're headed in the right direction Matthew.
An ID MUST be UNIQUE. In other words, you can only use an ID one time. (Many browsers overlook that for now, but the correct way to use an ID is to only use it one time in your html)
A class can be applied to lots of different elements in your HTML.
You can remember the difference between the two by thinking that there are many people in a class, but each person in the class has a UNIQUE ID.

Not the best definition for ID, CSS puts it as a unique identifier for an element, very vague, basically it doesn't mean one time only use, it means it can not be used on another element within the same document. You can use it more than once as long as it's a different document/page/markup whatever, just don't use it twice in the same document.

I usually use IDs to structure a page, since you usually only have 1 header in a page, 1 footer in a page, so an ID being used for these areas makes sense, because they only appear once on that page (well should only appear once)

Not only that, IDs can also be used as bookmarks within a page, meaning you can directly link to those certain areas, e.g. <a href="#footer">Check out my footer</a> will skip to my footer area, which is the location I gave the ID footer.

Classes can be used more than once, usually when you need multiple elements to take on the same styles. Though if you get comfortable with CSS Selector Specific, you can eliminate over using classes.

An example is using it to center text within block elements, you might have many elements that you want to center align the text, so you could have the style .center { text-align: center; } and can put that on multiple elements. When browsers get CSS 2.1 fully supported, you'll be able to add multiple classes to the one class attribute e.g. <div class="firstclass secondclass thirdclass"> and so on, just seperating them by a space.

Cheers,

MC