Have you ever got frustrated that your high quality picture turn low quality when you shared them on Facebook? This is because Facebook is having a very bad compression system and low quality re-size method.
What happens here is when you post and uploaded non-treated photos to Facebook; The system will automatically re-size and re-compress your photos to smaller file to save resources. Sadly, there are no way we could bypass this at the moment, but there are some tricks on getting the best out of the system.
Like the most of you, I am very active in Facebook and sharing photos is now a part of my lifestyle. I found out that by preparing the photos to be Facebook-friendly prior to posting, I am getting much better picture quality in the album. They generally appear sharper, and clearer compare to non-treated photos.
How do I do it? Here’s my recipe for Facebook-friendly photos,
This tutorial is based on Adobe Photoshop CS5 and the steps are more or less the same with other editing software.
Step 1: If you need to make adjustments to your photos, just go through all the tweaks and settings.
Step 2: Once you have finalize your adjustment, go to ‘Image Size’ [Alt + Ctrl + I], and re-size your photos with the following settings.
*1 – Make sure the longest side of the photo is set to ‘720’, this is the longest supported size in Facebook currently.
*2 – Resample Image using ‘Bicubic (Best for smooth gradients)’ to get the best possible results.
*Notes: Resolution here served no purpose but I put it at 96dpi anyway, as most modern PC are now displayed at 96dpi.
Step 3: Once re-sized, you may view the photo at 100% by pressing [Ctrl + Alt + 0]. At the time being, you Photo may not look sharp enough as you lose details when re-sizing. So, in this step, we are going to sharpen the photo by using a filter called ‘Unsharp Mask’. You can call the filter out by going to ‘Filter > Sharpen > Unsharp Mask’. Adjust your setting with the following settings.
*Amount: 350% – 500%
*Radius: 0.2 pixels mostly and 0.3 pixels at most
*Threshold: 0 levels
*Notes: I usually start with 0.2 pixels in ‘Radius’ and 500%, if the photo appear over-sharpen (White lines around the subjects), then I will slowly lower the value of ‘Amount’. On some rare cases, I will use 350% & 0.3 pixels.
Step 4: Alright, now you got a good Facebook-friendly photo and now you are ready to save it for posting later. To get the optimum quality with smallest possible file size. I recommend saving the file using the following setting from ‘Save-For-Web & Devices’ by pressing [Alt + Shift + Ctrl + S].
*1 – I used Jpeg with custom setting. I turn on ‘Progressive’ option, but Facebook will make it into ‘Interleave’ anyway. I set the Quality to ’95’ instead of the usual ’60-80′ ranges recommended by most, as I noticed that at ’95’, after downgraded by Facebook, I am getting better photo compare to quality of ’80’. I do not use ‘100’ as I don’t see any difference between ’95’ and ‘100’ with my bare eye.
*2 – Some of you might have shot the photos with Adobe RGB profile. So, remember to turn on ‘Convert to sRGB’ for compatibility and since Facebook does not store and show exif data, so you can safely remove all Metadata here to conserve file size. You can safely ignore this setting if you have no idea what it is.
*Notes: Once you are done with the setting, press ‘Save’ and export your file.
Step 5: Now you got a Facebook-friendly photos, it’s time to post them. Make sure to select ‘High resolution’ option when you are uploading using the new Uploader.
Once uploaded, you and your friend can enjoy your photos at better quality now!
Thanks for reading and if you think this tutorial is useful, please share it to your Profile, sharing is caring. Stay tuned for more tutorials.
Updates (27th Oct 2012):
If you are sharing a lot of photos using Facebook, you may notice that facebook has done a lot of updates/changes since this tutorial, originally published on Feb 2011.
The sharpening tricks here still works basically, but the maximum size of the photos can now be as large as 1024px at the long side rather than 720px I mentioned earlier, I have yet to try anything larger yet, but at this moment, you can consider using 1024px with the same sharpening amount as above.
Do leave me a comment or two if you encounter anything interesting by using this tutorial on Facebook.
I am uploading at 1366-1440px width normally nowadays, as most laptop will be having a resolution somewhere 1366*768.
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:
1. Upload the photos in higher quality on Flickr.
2. Upload the photos to Facebook.
3. 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: http://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: https://www.facebook.com/media/set/?set=a.693119124077489.1073741836.171298276259579&type=1
Wow, thanks for nice plug in.
Just want to say thanks =) it works. But now no longer need to restrict to 720 pixels width anymore.
Pingback: How to Sharpen Images | A Revolving Wheel