View Full Version : Rollover Image problem.

06-19-2007, 07:44 AM
I want you to see two attached files with this thread. I dont have any idea why its giving me different results... look at the text in both the images ... u will see the difference watch 'vision' .... the only change is with color ... and I want to use this images as rollover ... what i did just change the color and 'save as Web' in Adobe Photoshop CS2. Any ideas where I'm wrong ?? :confused:

and yeah how am going to sliced a big image in Adobe Photoshop or any other recommended softwares which doesnt messup with image quality.



06-19-2007, 10:16 AM
Hm, I don’t see any difference except the background color.
A tip for exporting button graphics for use as rollover buttons: Put the two states in one image and apply it as background image to the links, just moving the position of the bg on :hover. There is a great tutorial (http://wellstyled.com/css-nopreload-rollovers.html) on that (although I prefer to put the link states underneath each other instead of next to each other).

As far as exporting graphics I’m most familiar with Fireworks and as this is made for web publishing it has good options for exporting graphics. Like you can declare certain parts of JPEGs to have a better quality than others (called “selective JPEG mask” - e.g. text in the image has a quality of 90% while background has 60%).
There you can slice the graphic (create web layers), optimize every slice for web export, and then export the slices altogether (or one by one).

Generally you use PNG 8 (8 bit) for graphics with plain colors (very small graphics in terms of dimensions may still be smaller in file size when saved as GIF) and JPEG for millions of colors (i.e. photos or graphics with a lot of colors). Depending on what kind of transparency you need you can also use PNG 24 or 32. With the latter two you also won’t lose any quality as they can store millions of colors, too, but they can get very big in terms of file size. You should keep your page graphics below 50KB.

06-19-2007, 01:11 PM
Thanks for your support VIPStephan

yeah ... there isnt any difference in between these two images... but when i was watching these two files in windows image viewer ... both of them were different ... text were not in same position.....

anyway .. thanks for your tip. :thumbsup: