save for web--gif
<-- that right there.
Gifs have a limited number of colours, and the transparency is only either on or off. No in-betweens. What you saw IN your image editor was a full alpha channel: various levels of transparency on all those pixes on the edge. I almost always use PNGs, but if they are indexed (which I do whenever I can get away with it, reduces filesize like mad), they have the same problems, visually. It's just with Gif there's no other option.
I use the Gimp, which (so far as I know) doesn't have a matte option as some special option. But i always do this:
If the image sits on a solid colour, and esp if I'm using Gilder-Levin or similar (where the image MUST cover up text etc) then I just add the solid colour to the image. This does mean the image cannot be placed in other places where the background colour is different. But it does mean I can make the file quite small. I can index it (limit the number of colours) and avoid transparency completely.
I won't mention how certain browsers will make sure the background colour you use will never match the CSS colour because they are retarded blah blah... but this can be a problem. I fix with pngcrush.
If I have a pattern behind the image, then a solid colour is of course a no-go. So instead, I would
- create the image with a solid background like above
- select the background area by colour using the colour select tool and remove it.
This leaves a "matte" at the edges of the image, so instead of say black pixels going to semi-transparency, I not have a bunch of solid pixels are just black, black-to-brown, and finally brown (the background colour). So no alpha transparency is needed, and the image can be indexed. Instead of a white edge or a jagged edge, you'll get what looks like a smooth fade-to-brown edge and a pattern would mostly look ok behind it.
If I must have a pattern behind with a very contrasty colour, the matte will show too much, or if the image might be placed either on a dark surface (like brown) or a light surface (like white) then I'd have pure non-indexed PNG with the alpha layer. Those are the largest files in terms of size, and IE6 will show whatever background colour was sitting in your pallette when you saved the image, instead of the transparency.
Of course every place here I'm saying "solid colour", if the image does not have the ability to move over the pattern, then transparency still isn't needed. The pattern goes in the background and matches up the pattern on the page.
These are all for things like logos where generally I don't use jpg.
I was told by someone that it should be more "graphic intensive" like I paid someone to do it. So I get conflicted over that.
I suspect that would end up cluttering the page and right now it's a good level of readability/findability. You have little icons in places to liven things up. I wouldn't make it more graphics-intensive unless indeed someone professional was able to give you a (different) design that could accommodate more images without turning into garbage. People aren't coming to marvel at how your site looks, they're coming to see if you are who they want to walk their dogs.