How can I get mu rounded corners less jagged?

B
Posted By
Barry
May 3, 2006
Views
608
Replies
1
Status
Closed
I am trying to create two simple rounded corner gif banners for a web page, but can’t seem to get the corners "un-jagged". I am by no means an experienced PS user but here is how I go about it: (PS 7.0 btw)

I create a new image 800X40 pixels to fit my web page, fill it with a gradient fill to match the web page colors and then create another image at 50X50 pixels with 72 ppi resolution. On the latter image I draw an circle on the canvas with the elliptical marquee tool with anti-aliasing checked off and feathering set to 0 and fill it with the foreground color, then I draw a square on 1/4 of the circle with the rectangle marquee tool, copy that and paste it into the 800X40 image as a new layer and move it to its corresponding end. Then I erase just enough of the first layer to get my rounded corner. The process is repeated for the other end switching to background color to match the other end. I then choose "save for web" with all layers visible, and save it as a gif file called "topbanner.gif" with the transparency button checked and no transparancy dither. I then flip the whole canvas and save it again as "bottombanner.gif" with the same settings.

The problem is it looks ok in PS, but when I view the page there is still somewhat jagged edges. (My monitor is set at 1280X960 32 bit color) I have played with the dithering options when saving as a gif, but to no avail. I have also used higher resolutions (eg. 100 ppi) for the circle image but that doesnt seem to help either.

What am I doing wrong?

Should I be using image ready to do this? (which I know even less about)

I can email a copy of the gif file or post it on a temp site if anyone wants to check it out.

thanks in advance!!

How to Improve Photoshop Performance

Learn how to optimize Photoshop for maximum speed, troubleshoot common issues, and keep your projects organized so that you can work faster than ever before!

K
Kingdom
May 3, 2006
TG wrote in news:Al46g.2473$:

I am trying to create two simple rounded corner gif banners for a web page, but can’t seem to get the corners "un-jagged". I am by no means
an
experienced PS user but here is how I go about it: (PS 7.0 btw)
I create a new image 800X40 pixels to fit my web page, fill it with a gradient fill to match the web page colors and then create another
image
at 50X50 pixels with 72 ppi resolution. On the latter image I draw an circle on the canvas with the elliptical marquee tool with anti-
aliasing
checked off and feathering set to 0 and fill it with the foreground color, then I draw a square on 1/4 of the circle with the rectangle marquee tool, copy that and paste it into the 800X40 image as a new layer and move it to its corresponding end. Then I erase just enough
of
the first layer to get my rounded corner. The process is repeated for the other end switching to background color to match the other end. I then choose "save for web" with all layers visible, and save it as a
gif
file called "topbanner.gif" with the transparency button checked and
no
transparancy dither. I then flip the whole canvas and save it again as "bottombanner.gif" with the same settings.

The problem is it looks ok in PS, but when I view the page there is still somewhat jagged edges. (My monitor is set at 1280X960 32 bit color) I have played with the dithering options when saving as a gif, but to no avail. I have also used higher resolutions (eg. 100 ppi) for the circle image but that doesnt seem to help either.

What am I doing wrong?

Should I be using image ready to do this? (which I know even less
about)
I can email a copy of the gif file or post it on a temp site if anyone wants to check it out.

thanks in advance!!

Try this
http://user.fundy.net/morris/?photoshop10.shtml


‘Mirror mirror on the wall who is the prettiest of them all?’ ‘Snow White you dirty bitch and don’t you forget it!’

MacBook Pro 16” Mockups 🔥

– in 4 materials (clay versions included)

– 12 scenes

– 48 MacBook Pro 16″ mockups

– 6000 x 4500 px

Related Discussion Topics

Nice and short text about related topics in discussion sections