Gradient problem.

Need help with Photoshop, the GIMP, Illustrator, or others? Want to show off your work? Looking for advice on your newest Flash stuff?

Moderator: General Moderators

Post Reply
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Gradient problem.

Post by JellyFish »

Hey. My gradient looks like:

Image

only when viewed in a webpage. And I want it to took more dithered if you know what I mean. Is there a specific file format that works best with the web in gradient wise? I'm using GIMP to author the image.

All post/comments on this are appreciated. Thanks for reading.
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

GIF is fine. Fewer bits per pixel will make it more quantized.
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Post by JellyFish »

The example above is a gif. How would I go about making it perfectly dithered and not choppy, so to speak?
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

Set the dithering percentage higher?
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Post by JellyFish »

Well the image looks perfectly fine in GIMP. But when it's view in the web browser the dithering is like in the example.
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

JellyFish wrote:Well the image looks perfectly fine in GIMP. But when it's view in the web browser the dithering is like in the example.
Your posted graphic looks fairly well dithered to me.

Maybe I don't understand. What specifically are you trying to achieve? Reducing the file size while maintaining a fair level of quality?
nickvd
DevNet Resident
Posts: 1027
Joined: Thu Mar 10, 2005 5:27 pm
Location: Southern Ontario
Contact:

Post by nickvd »

Yeah, it looks fine to me, nice and smooth even changes in colour... unless you are LOOKING for a rougher gradient that looks 'over dithered'... (unless i'm confusing what dither mean :))
User avatar
a.heresey
Forum Commoner
Posts: 59
Joined: Wed Dec 13, 2006 7:31 pm
Location: Chesapeake, VA, US

Post by a.heresey »

Your sample above looks like an immaculate gradation from dark green 100%green, which I understand is not what you want.

I know nothing of this GIMP you speak of, but have you tried reducing the number of colors used to generate the image, while keeping the dithering up? That's how I get a pixelated look in Photoshop.
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

a.heresey, I suggest you read your private messages before posting more.
Shaneckel
Forum Commoner
Posts: 48
Joined: Fri Sep 23, 2005 3:46 am
Location: Pittsburgh, PA

Post by Shaneckel »

Instead of using gif, and suffer the lossliness, use a jpg. It gradients well with a higher a quality. What you are seeing from the gif is the reduction of color numbers, which then makes the gradient look choppy. It really just seems like a quality issue, which there must be a setting in gimp to increase it.

It really matters on how much load time you're trying to save. You could save it as a PNG and get high quality.

hope this helps.
User avatar
onion2k
Jedi Mod
Posts: 5263
Joined: Tue Dec 21, 2004 5:03 pm
Location: usrlab.com

Post by onion2k »

Shaneckel wrote:Instead of using gif, and suffer the lossliness, use a jpg. It gradients well with a higher a quality. What you are seeing from the gif is the reduction of color numbers, which then makes the gradient look choppy. It really just seems like a quality issue, which there must be a setting in gimp to increase it.
Wrong. GIF uses run line encoding, which, for a vertical gradient such as this one, is absolutely ideal. A JPG file would be considerably bigger, and would only match the quality at a very high quality setting. There's no colour reduction happening because there's only 173 colours in the image (besides, GIFs can handle millions of colours if you're clever).
Shaneckel wrote:It really matters on how much load time you're trying to save. You could save it as a PNG and get high quality.
Saving it as an 8-bit 256 colour PNG is a good idea.
Shaneckel
Forum Commoner
Posts: 48
Joined: Fri Sep 23, 2005 3:46 am
Location: Pittsburgh, PA

Post by Shaneckel »

onion2k wrote: Wrong. GIF uses run line encoding, which, for a vertical gradient such as this one, is absolutely ideal. A JPG file would be considerably bigger, and would only match the quality at a very high quality setting. There's no colour reduction happening because there's only 173 colours in the image (besides, GIFs can handle millions of colours if you're clever).
Argue. Save the same gradient with 20 colors and see what happens. If there isn't a color value for each line of pixels, it will use its nearest neighbor. Which then will lead to horizontal lines. Non of this is important anyway since we all should be using vectors.

gasp!
Post Reply