Understading Blogger themes - #1 - The freakish code

Quite honestly, Looking at my blog's current previous face [Simple] makes made me puke. [By the time I was writing this, I found an old theme that was fav of mine, and tweeked it, Still not good enough...]
And I have some ideas as to how to make a better theme, involving Flash, images, hacks and ... .
So, continuing the "Do it Yourself" and "Be curious" approach of this blog, I decided to read my blog's template code and attempt to make heads or tails of it and make it awesome and grouunnnd breaakinggg!

So, here link it is! [That's my current ugly disgusting theme I have, thought it's the new revolutionary one? Got ya! No?]
I recommend opening the file in Notepad++

So, Line 1 says: <?xml version="1.0" encoding="UTF-8" ?>

OK, so far so good. I understand what the attributes are saying, but what's the <? ?> tag does? *A Google search later*
OK, So, The website w3schools.com is apparently the place to learn everything webdesign related.
Hmmm... Still can't find what the <? ?> tag means...

OK, Let's see where searching "understanding blogger templates" goes.
*searches it* Hmm, interesting stuff!
I'm gonna see what this one and this one says.

Hmm, So all the CSS goes in the head and all the widgets go into the body...
What a freaky mixed up code...
What if I want a widget to dissapear in a specific page?...

Hmm, The code is fairly nice to read and well documented... Thought I can't do anything with it until I learn HTML and CSS...

OK, On to a new category then!