I am having trouble trying to decide how to put a text based logo together.

Basically, i have a bit of knowledge regarding graphics and graphic formats when relating to design. Like what gif and png files are best for.

I have photoshop, which i have a basic knowledge of and use for simple graphic creation. I also have illustrator which i have a very minimal knowledge of.

I have read a good few tutorials on text based logo's using photoshop.

So far, i have been able to throw together some simple logo designs using photoshop before.

I am not an arty person, although i am creative.

What i am having trouble with at the moment, is making a scaleable text based logo.

What i basically mean by this, is the format of the website i am working on is scaled in percentages. This includes the logo which is 20% of the page width. The page is 90% of the screen size.

Now using photoshop i have made a simple logo, its dimensions are 1000x200px. So basically, it looks decent at a resolution of 1024x768+.

But the smaller the viewport, the uglier the logo becomes. So basically, if i look at the logo at a screen width of 1980px, it looks pretty good, as nice nice and smooth, but at a screen width of 800px is well... Just doesnt look right. Then on a netbook or mobile screen it just looks terrible.

What would the best solution be for this type of graphic?

Should i be reading up on vector graphics, because from my limited understanding this is what i am looking for pretty much.

Or should i rather be creating seperate images for different resolutions?

Would someone be able to share some understanding in this regard?

I would greatly appreciate it,

Thank you!