Best way to learn is to just start goofing around with simple stuff, or grab any of the hundreds of online tutorials and give it a shot.
That said, here's a VERY rough example of your "about" page redone with CSS:
http://steelbluepanic.com/schafergoofing/
It is HORRIBLY ugly under the hood, and I just used some really stupid stuff to get it lined up more or less like your original page. It's going to totally break in anything but Firefox, Opera, or Safari--I'm not even going to bother looking at it in IE, since I used enough features that it supports badly that it's guaranteed to be seriously messed up.
I do not recommend doing it this way, but maybe if you look over how I did it you can get a very general idea of how that sort of layout can be done; for example, the gradient background is VERY simple (you can see how I did it in the code), and only takes a single 1K image. In fact, the whole page is only about 3K now (1K page, 1K CSS, 1K image), and only uses the one gradient image for the background; something of an improvement over the 80K or so of your entirely image-based original. Plus, since it's "real" text instead of a picture, it's more likely to get noticed by search engines.
I used Trebuchet MS, which looks moderately close to whatever you're using there, but if you wanted to have, say, your name at the top or the navigation buttons in a specific font, you could always make JUST those images--saves a lot of space over doing the whole thing as an image.
That said, here are some tips that as a designer you're probably not going to like:
Working with HTML/CSS isn't the same as working with page layout, and trying to force it to be is sort of going against the grain. For example, you can set exact pixel widths and absolutely position everything, as I did in this example, but it would be much better to use a more "fluid" layout that is more flexible when the window is resized, etc.
Also, vertical centering just does NOT work well in CSS; I used a crude trick to get the stuff in the main box roughly centered, and you could get approximately the same effect by setting a top margin of about the right amount to move it halfway down, but it's going against the grain.
I find it's better to "think web" instead of coming up with a print design then trying to apply it to the web--remember that not everybody has the fonts you want, or the monitor size you wish they did, or has good eyes, or whatever--a LOT of people like bigger text because they've got bad eyes or a high resolution monitor (for example, my laptop has higher resolution than my desktop, so I crank up the font size on web pages so I can read properly). If you try to force a very precise font size or design around text being exactly X pixels high or whatever, you're just going to annoy folks with bad eyesight or high-rez monitors.
Be flexible, think web.
