Photoshop CS4 Save for Web JPEG Colors are Off

Ok, I've scoured the web to see about finding a solution for this and tried every possible option and still I'm coming up empty handed. I have a website that I'm developing for a painter and have an image converted to sRGB, and the colors are where I want them to be. I use Save for Web, and every iteration suggested online for the, embed and don't embed, convert to sRGB and dont' covert, use document color profile, use windows, yada yada. Here's a recent example:
when i preview the image with Firefox, here's the difference:
The photoshop version is on the left and is the color that I want/need. The image on the right is firefox and saturated. If I save for web with embedded profile, safari is accurate, whereas firefox is saturated, so it's obviously discarding the icc and using some color space that I can't see in my file. I did notice that if I have my Custom, Proof and select Monitor RGB, then I can see what firefox will ultimately display and also what Safari will display if i have Embed ICC Profile unchecked in the save for web dialogue box.
I know that CS2 and CS3 were easier and less squirrely with color managing web files, but I think CS4 has some juju under the hood. Am I the only one out there frustrated, or like other web developers just accept the inaccuracy and move on? Since this is fine art, I'm doing my best to dial the color in, but it's been all afternoon beating on this.
Any ideas, I'm ready to install CS3 and see if my life will be easier, but I'm wondering if having Photoshop CS3 and CS4 will cause any issues.

>> your logic
That's my rant and I'm sticking to it.
The OP wrote he doesn't want or need to discuss the pros and cons of embedding profiles in Web images, but for the sake of anyone else reading this:
1) Embedded ICC Profiles increase file sizes (about 4K per image).
a) I may have over 100 thumbnails and dozens of photos on one page,
b) Plus, I may have an image sliced into many pieces.
c) That additional 4k per image, per slice, will add up fast and may kill dial-up traffic.
2) Very few computers use color-managed web browsers or calibrated monitors anyway, and
3) Problems with matching/blending image's edges or background color with a filled box or page color.
d) If I tag the image — on Mac colormanaged browsers — the color will mismatch the box/page color on managed browsers because the tagged image is being Converted to MonitorRGB, and the untagged page or box color is having MonitorRGB Applied.
e) This matching or blending a pixel-based graphic to page color is a pretty big deal to do correctly in professional web publishing.
f) If I publish untagged sRGB images/graphics, the box/page color will match the images and blend correctly in all browsers.
I WILL QUALIFY my general recommendation about embedding profiles in pixel-based web images for the following reasons:
1) You are posting fine-art images, creative portfolios, and are not worried about adding 4K additional data per image, per slice.
2) You are not worried about having Mac visitors seeing graphic blends or photos mismatched to a background color.
3) You understand only properly-profiled monitors and color-managed web browsers will benefit from your embedded profile — and it is likely 99% of web surfers don't have either — however, if you are targeting the one percent who do, then there is your number one best reason for tagging web photos with embedded profiles.

Similar Messages

  • Photoshop CS6 save for web some colors change?

    I have a picture with large area of color: #fffdfd, when I save it for web (jpg) this color is changed to #fefcfd (in JPG).
    I just can not save as JPG with #fffdfd.
    (was trying uncheck convert to sRGB, do not embed color profile - always #fffdfd changes to #fefcfd when save for web)
    However, color #fefcfd when save for web , does not change.
    Why some colors change and some not? Is it a bug ?
    Window7 64bit, Photoshop CS6

    Save for Web & Devices will strip some color data from the file.
    Browsers aren't color managed. Most file formats on browsers assume they're sRGB. While Photoshop gives you an option of embedding sRGB to the document color space, it also strips off data that is not relevant. This is a common occurence.
    PNG-24 on the other hand will give you the exact color match.
    Also, Save for W&D, JPG quality matters a lot - The same color at Quality 10,20,30,40,50...100 wil give you different color reproductions on the JPG end output.
    If you're concerned that much about an offset of +/- 1 hex value to your RGB colorspace, dont save for web & devices. Do a 'Save As' instead. Then use an image editing/ resizing application such as ResizeMe to resize the quality of your document. This, in most cases will retain colorspace information but just drop the resolution and quality of the image - giving you a lesser filesize.
    On a sidenote, You may also want to read this article on how to best manage color spaces: http://viget.com/inspire/the-mysterious-save-for-web-color-shift

  • Blurry smart objects in Photoshop Save for Web jpegs

    I create graphs, etc in Illustrator, place them as Smart Objects in a master Photoshop file before outputing Save for Web jpegs to use as PowerPoint slide backgrounds. Everything created in Illustrator or Photoshop through that process (Quality 80 or 100 with any of the SfW options on or off) Save for Webs are blurry when imported (at 100%) into PowerPoint. The only way I have been able to get anything crisp in PowerPoint was saving a Photoshop pdf. However, that was only the text created in Photoshop. The Illustrator Smart Object part was still blurry. Anyone have any idea on the best process to combine Photoshop and Illustrator files into one file for import into PowerPoint as a clean, crisp background? At this point I am open to all suggestions.

    There are parts that are being added in Photoshop, hence going from Illustrator through Photoshop as a Smart Object and then onto PowerPoint. If I wasn't 5 months down the line and just nearing deadline, I would recreate everything in Illustrator. Assuming that I have to continue at this point down the Illustrator through Photoshop line of working, how do you designate pngs or jpegs to be 220ppi. Jpegs have a 1-12 quality (and 12 is still blurry).
    Note regarding PowerPoint, I embed the full-page image into the background so others that are using this can't move (by accident or on purpose) the background.

  • Rescuing my RAW color from Photoshop's "Save for Web"

    Hi,
    I love the depth of colors the images have in RAW format (with 16bits per channel). However, when I go to Save for Web, the color profile gets trashed (in the preview as it would in a browser) and I'm left with a lifeless image that pales in comparison to the original. To prepare for this, what I've been doing, is switching to the 'Monitor RGB' Proof Setup and adjusting Brightness & Contrast. Is there a better way? Thanks.

    >If I'm not embedding the ICC profile in the JPG, won't Save for Web/Monitor RGB show me what the file will look like in a browser?
    No, it will only show you what it looks like on
    your monitor in an unmanaged app. It will
    not show you what it will look like on other people's monitors. sRGB was designed to resemble an average monitor, so if you want to know what your image will look like on average on other people's monitors in unmanaged apps/browsers/flash, you need to look at a sRGB version in a managed app. Otherwise you're just targeting your specific monitor and actually causing a bigger difference on other people's monitors because of it.

  • CS4 - Save for Web settings

    I'd be grateful for confirmation that I am using the correct Save for Web settings to achieve the colour effect I want.
    I am using an sRGB workflow as my output is for the web. I am using a NEC 2690 LCD display which is wide colour gamut but I am using in its factory set sRGB (and non-calibratable) mode. I have calibrated the NEC using my Eye One display and this shows as the default monitor profile in the vga card's driver but what effect it is actually having I am not sure (OS is Vista 32bit). My CS4 colour management settings are based round the sRGB Working Space. Normally I convert to sRGB all images before saving them in Save for Web.
    I am trying to ensure that the colours I see in images at the Save for Web stage preview are what I will see on the web and in other non colour managed environments. Specifically, I'd be grateful to know if the following settings seem right for what I am trying to achieve:
    Preset: JPEG High
    Quality: High
    Optimize selected (but not Progressive or Embed Colour Profile)
    Convert to sRGB selected
    Preview: Use Document Profile
    In the past (pre-CS4) I've had problems with images outside of CS3 looking over colour saturated and I want to avoid this now.
    Thanks for any help with this.

    > I am trying to ensure that the colours I see in images at the Save for Web stage preview are what I will see on the web and in other non colour managed environments. Specifically, I'd be grateful to know if the following settings seem right for what I am trying to achieve:
    > Preset: JPEG High
    > Quality: High
    That's good, though you you should still try to get the image filesize as small as possible without losing important image details. Many images can support a lower quality JPG setting so you should see how low you can go before you visually see a problem. No sense delivering a higher quality JPG if it's not needed. Higher quality = larger file sizes = longer download time for the webpage.
    > Optimize selected (but not Progressive or Embed Colour Profile)
    I prefer 'Progressive' as that loads an image in 3 stages (low->med->fullRez) and looks better on webpages instead of having images load top-to-bottom like a window shade.
    > Convert to sRGB selected
    Doesn't hurt to leave it on. Though you said you already converted them before saving for web.
    > Preview: Use Document Profile
    I think that "Windows (No Color Management)" will display a better preview of what to expect when the image is displayed on a Windows computer (95% of your visitors) using a web browser that's not color managed (ie: 99% of the windows web browsers - are there any?).
    > In the past (pre-CS4) I've had problems with images outside of CS3 looking over colour saturated and I want to avoid this now.
    The previous step should help with this in that you'll at least see what visitors using a decently calibrated monitor will see. But since there really is no standard that most of the world adheres to, you can only do your best to get things right at your end. You cannot control how the rest of the world adjusts or miss-adjusts their equipment.
    Russell

  • Photoshop CS6 Save For Web UI extra border Bug

    Last week we finally got upgraded to CS6, and I'm dissapointed to see the visual defect I reported in CS5.5 still exists in Photoshop CS6 Save for Web. The details and screenshots are all the same as in my previous thread. http://forums.adobe.com/message/3843054#3843054
    Isn't there a way to fix this?  I rely on PhotoShop to be pixel perfect, not to add extra distracting lines and borders to my work.

    FYI, just to test I just did a crop of an image, then screen grabbed the result.
    To ensure the edge is visible, I changed the workspace background from the dark gray I usually use to a lighter gray...  Here's the pertinent part of the workspace...
    A closeup of the upper-right corner:
    Notably, I don't see any black line around it like you showed.  This leads me to wonder whether I interpreted your screen grab properly...
    -Noel

  • Illustrator CS4 - when I save for web my vectors are pixelated. Help!

    I recently updated to CS4 (I know, I'm still behind the times) but ever since when I 'save for web' my vectors appear pixelated. It seems worse when I want a transparent background. My images are for web and this just won't do. 
    I've read a lot on this and can't seem to fix my problem, but here is what I have tried: Anti-Alias is checked, view > pixel preview, view > overprint preview, object > rasterize, and probably a few other things. If anyone can help me with this issue it would be GREATLY appreciated!! I've attached an image so you can see what I'm talking about. I created this schematic in Illustrator CS4 and saved for web with a transparent background and, as you can see, it appears pixelated everywhere.

    I'm not sure what you're looking for but here is my save for web options. Let me know if you're looking for something else. And thank you for trying to help!!

  • CS4 save for web - jpg are pixelated

    Hi all,
    I'm attempting to save an AI file for web use with "Save for Web & Devices" for use in a web browser. Somehow my jpgs (quality is set at maximum) are pixelated.
    here's a screen grab to see how the selections are set.  There are a few new fly-out menus that I don't fully understand so maybe something in there needs to be tweeked.
    thanks for the help
    Pierre

    Thanks for pointing me in the right direction.
    Under the Image Size tab, Anti-Alias needed to be checked.
    thanks for the help Silk!

  • Deleted default Photoshop CS5 Save for Web settings, but they return after a restart

    How do I permanently delete the default Save for Web settings that come with Photoshop CS5? (Default Settings.iros, Background Image.iros, etc)
    In CS4 you deleted them once, and they were gone. In CS5, if you delete them, they are recreated when you restart PS. Same goes for any Optimized Settings (GIF 32 Dithered.irs, JPEG Low.irs, etc), they simply can't be permanently removed, and I'm left scrolling through a long menu of things I'll never use.
    I have no use for XHTML.iros, GIF 32 Dithered.irs, or any of these settings, just like I have no use for most of the stock presets in PS, why can't I customize these presets like I can customize everything else?

    BlowPurp wrote:
    >It's my observation that many of these files are auto-generated on the first run of Photoshop. 
    >It's possible the specific files you've referred-to are now simply auto-generated when they are found to be missing.
    Yes, they are, how do I stop that?
    I don't know that you can.
    Ok, we have a way to save them, but not delete them, so what if I accidentally Save one I don't want? Or what if I Save one now, but later don't want it anymore. We're supposed to infer Adobe didn't intend us to ever Delete custom settings we Saved ourselves?!
    I suppose there's an implication that you'll be given the defaults by Photoshop, but that anything you create yourself can be deleted by yourself.  I admit it's not a very clear interface.  For what it's worth, my own applications provide an explicit "Delete" capability, have defaults that don't manifest as actual files (and are always at the top of the list), and the app doesn't allow you to even try to delete the application-provided settings (Delete is grayed-out).  I thought the whole settings thing through and tried to make sure it was more clear than parts of the Photoshop interface:
    > Have you found some documentation from Adobe that states that you can effectively customize your installation by deleting these files?
    Yes, in the FAQ: http://forums.adobe.com/thread/375776?tstart=0
    Well, from what I can see that thread was written by someone other than an Adobe Employee, and it doesn't mention .iros files at all.
    And what it seems to say is that you can reset your preferences to defaults (i.e., invoke auto-generation of a new prefs file) by deleting the old prefs file, which is what's happening for you.
    -Noel

  • Photoshop CS6: Save for Web Automatic Resize Issue

    Some my .psd files (CS6 Photoshop, MAC OSX 10.7.5, Processor: 2.5 GHz Intel Core i7) automatically resize to a percentage. I can't figure out what the cause is, and it will not allow me to change it back to 100% to slice out images for web.
    File Type is .psd - RGB 8 bit/color
    Fie Dimensions are 1400px by 10,800px.
    File Size is 60MB
    The file is extremely slow to open and adjust anything within the file as well, not sure if the issue is related.
    I am working off of my desktop not off of a server.
    Attached is the save for web issue.

    I have the exact same issue, just on certain files?
    I have to 'save as' instead of 'Save for Web'?
    What causes this to happen?? I also have the preview window displaying a gif when I've got the PNG option selected???

  • VERY slow performance with CS4 + Save for web

    Note: I have done a search for similar issues but can find nothing regarding CS4 and this particular issue. I'm using a MacBook Pro 2.4Ghz w/4GB of RAM and resources are aplenty when the issue occurs.
    Issue
    My problem is that under certain circumstances the 'save as web' function can take upto 3 minutes before the diaglog box appears. I've had this for some time but only in the last couple of days did I notice something that might be relevant:
    Works
    1. Open 3 large TIFF files @ 120mb approx (mine are 3 processed RAW files from Capture One / 4200x5600@300dpi)
    2. Create a new adjustment layer for each image
    3. Resize each image to 72dpi @ 800x600
    4. Run a SmartSharpen & flatten layers
    5. In each tab (for each image) do 'save as web'
    6. 'Save as web' dialog appears in expected time
    VERY slow
    1. Open 3 large TIFF files @ 120mb approx (mine are 3 processed RAW files from Capture One / 4200x5600@300dpi)
    2. Create a new adjustment layer for each image
    3. Resize each image to 72dpi @ 800x600
    4. Run a SmartSharpen & flatten layers for each image
    5. In first tab do 'save as web'
    6. 'Save as web' dialog appears in expected time
    7. Close this document (tab)
    8. Go to the next image (tab) and do 'save as web'
    9. Dialog box can take anything from 20secs to 3mins to appear.
    10. Close this document (tab)
    11. Go to the last image (tab) and do 'save as web'
    12. Dialog box can take anything from 20secs to 3mins to appear.
    As I can easily go through this process for 50-60 images you can imagine that it can waste over an hour of my time waiting for Photoshop to get it's act together. I assume it's something todo with memory allocation, or that it's processing previews for all three tabs on the first 'save as web', but in any respect it's very annoying. There seems nothing obviously wrong resource-wise at the time of doing these.
    Would be interested if anyone else has this issue!
    Thanks!

    I had the same problem when I setup a new computer this week. Here's what I had installed:
    Photoshop CS5
    Suitcase Fusion 3
    The problem was that when I was in Photoshop and used the "Save for Web" export screen, the dropdown menu for the different export types (JPG, PNG, GIF, etc) would take an extremely long time to update the preview of the graphic.
    After a few days of research , I found that Suitcase was conflicting with Photoshop. Here's how you fix the problem (or at least here's what I did with my situation):
    Open Suitcase
    Go to "Tools", click "Manage Plugins"
    Deactivate the Photoshop plugin
    This fixed the problem immediately and now my Photoshop" Save For Web" feature is working really fast. Hope this helps anyone else in the same boat.

  • Photoshop CC Save for Web Incorrect

    Hi everyone,
    I recently purchased the Adobe CC suite for my Mac, OSX Mountain Lion.
    Trying to Save for Web (which works) but I'll select an option on the top right, lets just say JPEG 70% (or PNG or anything) for arguments sake and on the bottom left where it displays the potential file output information it'll always show GIF, the GIF output size, etc.
    I'm not sure whether I've got a setting wrong but I haven't had to change anything since I started using Photoshop back at PS7.
    Wondering if its a bug or not or if anyone knows a potential fix?
    Thanks!

    Hey ckocho,
    I can confirm this is a bug.
    My belief is, it may have triggered after attempting to export a very large sliced document with "Save for web..." and then become stuck in this mode.
    Here's a list of my symptoms (so others might stumble accross the solution):
    - Photoshop CC (updated to version 14.1.2 x64), Windows 7, 64bit
    - Save for Web... interface fails to correctly show "Optimised" view
       - No estimated filesize displayed for slices
       - Optimised preview not rendered using selected filetype (gif/jpeg/png) ie, all slices look like GIFs, and don't change when other selections are made
       - Selected slices do not "highlight" (outline) correctly, so you can't tell which ones you have selected
    So by guesswork alone, you can still make selections and choices. The output is perfect, but working blind regarding the look and filesize quite defeats the purpose of the tool.
    Now, the good news.
    The above trick corrects the problem! Thank you ckocho!
    Simply open the "Save for Web..." dialogue and change views from "Optimised" to "2-Up", "4-Up" and back to Optimised, and the problem is gone. No reinstall required, whew!
    Dear Adobe, please look into a fix
    Cheers,
    Anthony

  • Save For Web Saturates Colors

    Hello,
    I've dealt with this before and searched the internet for a solution/fix, but still have the problem of JPG images appearing over-saturated when viewing them in a web browser compared to the way they look in PS CS4 or in the windows "preview" application.
    Here's the workflow:
    Work with an image in PS CS4 (Vista) with an assigned color profile of sRGB. Use the "save for web" dialog to create a JPG (with the "convert to sRGB" box checked). View the image in Windows by right-clicking and selecting "preview," and it looks fine (looks same as it does within PS). View the same image using Firefox 3 or Internet Explorer 7, and it appears oversaturated (mosty too reddish) as compared to the original.
    I've tried various permutations to the above (e.g., turning off "convert to sRGB") with no avail. However, if I convert to LAB color, and then save for web, the resulting image appears less saturated overall, even though it still appears more saturated as viewed in a web browser as compared to PS/Windows-preview.
    Does anyone have any further suggestions to get the images to appear the same in a browser as they do in PS or in the Windows Photo Gallery (preview)?
    thanks,
    JP

    Silkrooster wrote:
    What happens if you use save as? I believe that save for web does not save the color profile therefore firefox or IE might assume a different profile thus over saturated images. I have read someplace that firefox uses color profiles but I am not sure about IE.
    Firefox is not colour managed by default. It has to be enabled by the user.

  • CS4 Save For Web not the right size

    I'm having problems with Illustrator images when I use the Save For Web. The image size always comes out the same size as my artboard. In other words I set up a new document to be letter size, create my drawing within that document. My drawing is only about 300 px by 150 px. When I Save for Web my image is the same size as the document or artboard not my drawing. Is this something new in CS4? Do I have a preference set incorrectly? The only way I have found to get rid of the background is to adjust the size of the artboard manually. Is there a way to adjust the artboard to fit my drawing automatically, like cropping to an object in Photoshop?

    CS,
    Basically the same issue was up, and answered, recently here:
    http://forums.adobe.com/message/2667045

  • Photoshop CC Save for Web Greyed out

    After the last Creative Cloud Photoshop update my Photoshop CC 64 bit save for web is greyed out and I can no longer save as a png. Using Windows 7
    How can I correct this.
    thanks,
    Buddy

    I have the same problem. Save for web grayed out no matter what. Also photoshop denies opening any png file, also the png format sometimes doesn't even appear in Save as.
    I can import png by choosing Open As and selecting Camera Raw. But then I can't save as png again. QC slacking at Adobe or what? Never experienced these kinds of difficulties with earlier versions. Might just as well brush off my old CS4 masters collection.
    Will try a reinstall although I frankly don't have the time to wait for the endless download.

Maybe you are looking for

  • How can I know that the listener is starting up?

    Hi, I follow the instruction in ACS Oracle Installation guide. I believe that many of you use the document to install oracle. I have a question when I try to start the listener. when I execute ./listener8i stop or ./listener8i start I got the same me

  • Problem with image map

    I am trying to create an image map for the map found on my homepage - http://www.smartcharteribiza.com/ I have followed a couple of tutorials and everything seems to be working in photoshop, but when I upload the image to wordpress, the map does not

  • Google search window disappeared

    My Mac-neophyte father tells me that the Google search window has recently disappeared in Safari. Any suggestions on how to get it back? Unfortunately, I forgot to ask him which OS he's using. TIA, Nick D.

  • The Invisible Boot Camp Partition

    Basically, my Windows partition does not show up on my Mac side of things. It shows up in Disk Utility as "disk0s3" but is not mountable. It cannot be mounted if I use the MacFuse and NTFS-3G solution. It cannot be mounted with Paragon's NTFS for Mac

  • HT3302 My iphone is dropped in a glass of water. Would it be covered by  apple care?

    Iphone4 is dropped in a glass of water. Would it be covered by  apple care? Any input is appreciated! Thank you