Can you post a link to a page in your site where the problem can be seen?
Sure, sorry about that! My link is: http://thecommunaltable.net, and here’s an example post where it shows up:When you go to THIS post,and look at the any pictures, you’ll see that they have a kind of gray overtone. When you click on each of the pictures, they look how they’re supposed to look. For example, when you look at the 2nd large picture in the post, you’ll see a gray picture, but when you actually click on the picture, you’ll see something like THIS, which is a much brighter (and the correct) version of the picture.
Partly a guess, but I think the images are getting changed by being scaled down because they are too large.
Unless you are selling portrait quality photos online, it usually makes little sense to have an image larger than about 800 x 600px. The resolution should be no larger than 72 dpi for an image for the screen, and no larger than 300dpi for most printing. Try to keep the overall size of an image to less than 150k (some sources recommend a maximum of 50k).
One of your images that I examined on the link you posted was 3456 x 5184px and 5.1MB in size or approximately 34 times too large! When an image that large is displayed in a smaller area on a page, the browser will resize it, and every browser does this differently. Resizing the images yourself helps eliminate some of the variation.
If you have Photoshop, try using the ‘Save for web’ option to resize your images before uploading and see if this makes a difference.
If you don’t have Photoshop (or maybe even if you do), here is a free resizing tool that I use all the time: http://www.rjlsoftware.com/software/utility/resizejpeg/
You may have photoshop set to save the images using the adobe RGB colorspace whereas Browsers are usually happier with the sRGB colorspace. The colours can take on a grey appearance when shown in a browser when this happens. Try saving the images using the sRGB colorspace & upload the new versions to replace the old ones.
