What exactly is a bitmap?
I'm using Photoshop. Basically I need to create a banner to use in a website. It is a 980x300px in size, with one image at the side and some text at the right. I could do this with CSS and achieve much crisper text, but since I'm using a JavaScript for an animation, it would require much more time to do it than just using Photoshop to create the whole image with text.
I have been able to get better results by starting with a much bigger document size (2940x900px) and then flattening the image and reducing it's size to 980x300px. Still, I haven't been able to achieve something like the one of Apple.
Basically a fancy word for an image. They're resolution dependent. You can't scale them up or down without losing some definition and/or detail in the process.
This is opposed to a vector, which is what the text tool produces. They're resolution independent, since they're not based around individual pixels, but rather coordinates that are being drawn by your CPU. You can take an itty bitty 2px "A" from the text tool and use the transform tool to scale it up to 300px, and still have a perfectly crisp "A".
That's why I asked if you're using a template for your letters. If your taking a bunch of bitmap letters, and scaling them around at random, you're losing definition along the edges, which could make them look blurry on the webpage. This is especially true if you're scaling up.
As for your banner, it never hurts to design it a little larger than what you need. Yeah, this sounds like it flies in the face of what I just said above, but browsers can scale images down nice and smoothly. Like look at the MacRumors logo above.
...well hell. It's April Fools, and they've messed it up. Figures. But the text still looks alright, so I can still use it as an example.
If you drag the image off onto your desktop, you'll see that the image is actually a fair bit larger than what it is on the webpage. Probably about 50% larger at a guess. That's because bitmaps scale down smoothly so long as they're aspect correct.
So what I'd suggest you do is create your image at 1960x600 (pretty much like what you did, but smaller), but don't reduce the size of your image when you're done. Set the scale on your webpage instead. That should keep your text looking nice and crisp (this will also make it look nice on retina displays).
....and of course experiment. Like the Apple guys used a 1:1 image for their website. That could be due to the type of text antialiasing they're using. Since I'm on a Windows PC, I couldn't do a perfect match with the font (Helvetica vs. SegoeUI semilight), but this shot should give you an idea of what I mean...
You can control text antialiasing from the little bar at the top, next to the little aa icon. I'd suggest playing around with that, too.
