Image editing question

Started by Monster Dave, July 31, 2009, 12:12:12 PM

Previous topic - Next topic

Monster Dave

Hey everyone,

I'm working on a project for work and creating a concept website, I have several images which I would like to use as buttons/links, however, the challenge that I'm facing now it how to "blend" the image edges in with the background color which is similar but has a slight shade variance from the buttons making the images look really square at the edges.

I have Photoshop and Fireworks to work with (CS4). Can anyone help me out with the blending problem? I can't just edit them together because the background for the website and the buttons have to operate seperatly (ie I have to be able to move them around in DreamWeaver to adjust the layout).

Thanks everyone!


Dave.

Slide Panda

Can you use transparent PNGs? (PNG-24) if so, problem solved.  If you've got to suck it up and use GIFs, tweaks the matt colors for the transparency of the give to match the background color they will be over.
-Throttle's on the right, so are the brakes.  Good luck.
- '00 M900S with all the farkles
- '08 KTM 690 StupidMoto
- '07 Triumph 675 Track bike.

Monster Dave

Quote from: yuu on July 31, 2009, 12:39:10 PM
Can you use transparent PNGs? (PNG-24) if so, problem solved.  If you've got to suck it up and use GIFs, tweaks the matt colors for the transparency of the give to match the background color they will be over.

I'm not exactly clear on what you're suggesting....

Slide Panda

How familiar with photoshop are you?  And the various versions of images you can use for the web and the limitations of various browsers?

PNG-24 supports full alpha channel transparencies.  So any shadow effects etc will look correct no matter what the background.  But  not all browsers handle them so well.  For example, the bastard step child of the web IE 6 chokes on just about anything cool, including transparent PNGs.

GIF images can handle tansparency, but not as deftly.  It needs to be keyed to a specific color - this is done in the 'save for web' stage.  If you had a transparent GIF with a white matte, on a black background, you'd have a jaggy white halo effect.

Make sense?
-Throttle's on the right, so are the brakes.  Good luck.
- '00 M900S with all the farkles
- '08 KTM 690 StupidMoto
- '07 Triumph 675 Track bike.

Monster Dave

I think so - I've not done too much yet with transparency manipulation. I'll have to look into that.

Thanks!  [thumbsup]

Slide Panda

BTW the PNGs and Gifs a are what you'd save slices of the photoshop file as for use on the web.  if you're having that issue in photoshop itself you mmight just need to clean up and or work on different layers and or use a mask.  Really there's like 20 ways to do anything in the program.  If you're still struggling drop me a PM 
-Throttle's on the right, so are the brakes.  Good luck.
- '00 M900S with all the farkles
- '08 KTM 690 StupidMoto
- '07 Triumph 675 Track bike.