Mobile app version of vmapp.org
Login or Join
Turnbaugh909

: Facebook: Ways to preserve image quality of uploaded images? After uploading an image, Facebook converts it to a new image. Their conversion process introduces artifacts and mottling to the magenta-ish

@Turnbaugh909

Posted in: #Compression #Gif #ImageFormat #ImageQuality #Jpg

After uploading an image, Facebook converts it to a new image. Their conversion process introduces artifacts and mottling to the magenta-ish parts of the image.

Original image:


Facebook's conversion:


Are there ways to preserve the original quality of this image and have the image appearance on Facebook reflect more of the original quality?

10.09% popularity Vote Up Vote Down


Login to follow query

More posts by @Turnbaugh909

9 Comments

Sorted by latest first Latest Oldest Best

 

@Odierno310

Facebook : Cover photos size = W:851px x H:315px , and it has to be under 100Kb.
This will help!

10% popularity Vote Up Vote Down


 

@Nimeshi706

I don't know how to put this. Because I don't want it to look like another commercial link toward a product one wants to sell.

The last years I have seen many complaints from users about photo quality degrading when uploaded to Facebook. As a photographer, I must say that I've been spending a lot of time to analyze the compression algorithms and how to prepare a photo in order to reach best results on Facebook. I personally agree with Facebook's policy regarding the "quality vs. bandwidth". If you are in a part of the globe where bandwidth is not an issue you can almost not imagine what would be to get back on your old modem speed. And still this is the case for many FB users.

Nevertheless, we all have to admit that Facebook offers a great visibility. But it could turn against us if the quality degrades so much that the photo brings eventually a bad image. So I started thinking about a project that would allow users to upload photos with a personalized text and a caption including an URL to the same photo on a site that supports higher quality such as Flickr, 500px, 1x, etc. I have finally started a development on a plugin that allows us basically to do next:


Upload the photos in higher quality on Flickr.
Upload the photos to Facebook.
Add the user's caption to Facebook, along with a direct URL to the Flickr photo.


If you are somebody that uploads one photo at the time, don't read any further. You can do this manually. But what if you are uploading many photos at the time?

This Lightroom plugin does the work for you. For more details and installation instructions, see here: shootix.net/plugins
I appreciate your gentle and constructive feedback. If you don't like Lightroom, it makes no sense to criticize it here, I can't help that.

An example is sometimes worth a thousand words. See here what it can provide as result: www.facebook.com/media/set/?set=a.693119124077489.1073741836.171298276259579&type=1

10% popularity Vote Up Vote Down


 

@Harper654

From Facebook's help center:


How can I make sure that my photos display in the highest possible quality?

To avoid compression when you upload your cover photo, make sure the file size is under 100 KB.

10% popularity Vote Up Vote Down


 

@Dunderdale640

Having the same problem with a white text on a solid red background. My solution was to replace the solid red by a gradient of to reds. Afterwards I also added a Noise filter (or grain filter (7) in the filter gallery) in Photoshop. The improvement was very noticeable and the result was perfect. In attachment you can see the original and the finished result.

10% popularity Vote Up Vote Down


 

@Dunderdale640

MAKE YOUR PHOTO LIGHTER TO REDUCE CONTRAST

I've pretty much tried EVERYTHING (adding noise, increasing quality, decreasing quality, changing dimensions) The only thing that has worked is to increase the brightness/lightness of the photo. I was having issues with the banner of this page: (High contrast between bold colors and white text) www.facebook.com/pages/UMass-Board-of-Entrepreneurship/533534090049983# If you click on the cover photo, check out the current and previous one.

In Photoshop: Image>Adjustments>Hue/Saturation, I raised the "Lightness" bar. All it really did was decrease the contrast. This seems to have helped - the artifacting was still there, but it is less noticeable.

BTW, I did "Save as/for Web" in PNG-8. I think this is less important though.

GOOD LUCK

10% popularity Vote Up Vote Down


 

@Moriarity648

Rule number one..

Don't save up in format quality.

That means.. Don't take a GIF, resave it as a JPEG, then save it as a PNG and think you are going to have a high quality image. All you have is a larger K version of that original GIF. Downsampling is the way to go. Upsampling seldom works to well.

I suggest that you just keep all your original photos as PNGs, and then save out from there the to the correct format that seems fit for the subject matter.

These are my suggestions.

John

10% popularity Vote Up Vote Down


 

@YK2262411

If you use images with large tone surfaces - especially red colors - you can add noise to the image. It'll make the image look a lot better. If you use Photoshop add 2-3 times 4 gaussian monochromatic noise. You won't notice the pixelation... as much.

10% popularity Vote Up Vote Down


 

@Michele215

Here is an article on exactly your problem. Been having this problem as well. Hope this helps!

Facebook uses a low quality jpg compression so any solid colors end up looking heavily pixelated. Solution is to add images at double the size with noise.

10% popularity Vote Up Vote Down


 

@Hamaas979

In short, Facebook is converting your image to the JPEG/JPG format (Join Photographic Experts Group). There seems to be no current way to upload images to use as a profile picture or to your photo album which Facebook will not convert to JPEG.


...a commonly used method of lossy compression for digital photography
(image). The degree of compression can be adjusted, allowing a
selectable tradeoff between storage size and image quality

...On the
other hand, JPEG may not be as well suited for line drawings and other
textual or iconic graphics, where the sharp contrasts between adjacent
pixels can cause noticeable artifacts. Such images may be better saved
in a lossless graphics format such as TIFF, GIF, PNG, or a raw image
format.

en.wikipedia.org/wiki/Jpeg

Also:


JPEG is not suitable for images with text, large blocks of color, or
simple shapes, because crisp lines will blur and colors can shift.
graphicssoft.about.com/od/graphicformats/f/summary.htm

Suggestions:

The above quote “JPEG is not suitable for images ... large blocks of color” pinpoints your issue. In a photograph, colors tend to have some variation and/or shading. JPEG introduces what has been called, ‘noise’, ‘artifacts’, 'mottling', etcetera.

Tip for saving JPEG Images: As JPEG is a lossy image format, try to preserve as much of the data of these type of images as possible. When saving an image with blocks of color in the JPEG format, your software should give you an option for image quality. This is usually a slider you set to 100 to save the maximum data quality.

Tip for uploading JPEG images: When uploading to Facebook, check the radio button: “High Resolution(takes ~10x longer)”.

Easiest solution (convert the block color): Try converting the image to solid black. This usually lessens the mottling effect (though doesn’t totally eliminate). Certain colors tend to show the mottling effect, instead of black you could try other colors and see if the mottling effect is less noticeable.

More advanced solution 1 (introduce texture via noise to the solid color): The problem is that JPEG doesn’t deal with solid colors well. A solution would be to make the color less solid. One standard way to doing so is to use the noise filter in your image editing program. Noise can introduce new jarring colors. Because of this, noise filters often have a way of protecting hue, or one can turn down ‘color saturation’, or some such. This step in a Photoshop tutorial shows the Add Noise Dialog, which uses a Monochromatic setting to preserve hue. I personally tend towards Gaussian, but try both settings to see which yields better results.

More advanced solution 2 (introduce texture to the solid color): Most image editing programs have filters which can alter images. Some ‘artistic’ filters do this. The goal here is to break up solid colors so that the imperfections of JPEG are not noticeable or displeasing.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme