Get The Right Colors – Firefox vs Safari

Say you were to export a simple gradient for a background on your website. You want it to fade into the main color of the background. It looks fine in Safari, but when you preview it in Firefox, you notice that the color you chose as the main background is different from the color that is supposed to be fading in to your main color. Or vice versa. Heres a small tip to make the image neutral to work in all browsers!

This is literally a tiny tip so here we go. Instead of being in Photoshop, and saving your image with ‘Save As’ – you want to scroll a little farther down in that file menu and select ‘Save For Web And Devices’. When the full screen dialog comes up, select your settings. PNG-8 with default settings works best. When you open your site in Safari, it will be the same as Firefox. There you go. Your colors are now neutral. For the most neutral colors, save all of your images with this method. Although its not always needed, why not create a traditional workflow?

This can also be done with images. You notice that your images always look better in Safari because of the different profiles of color they use. Something about the ICC. Just use the method i just explained, but you would want to export with JPEG compression. Its just better for real-photo quality pictures. They should look nearly the same when you put the on the web.

So there you have it, go have a blast with your beautiful neutral colors.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s