Working out what image sizes to use on Facebook isn’t as easy as it could be and involves some wrangling to get the result you want. Each type of image on a page, profile, and timeline has its own size and quirks. And Facebook never has been very good about making its help pages easy to find.
So here’s my updated 2014 version of the unofficial guide for the sizes of Facebook photos on the various parts of the site. This post is the second in the series. You can find similar guides for Page Timelines, News Feeds, and display on mobile devices with the box at left.
Facebook Image Quality Issues
Something to be aware of is that Facebook compresses some images pretty aggressively when you upload and display them.
It makes sense–naturally, they want to speed page loads and reduce bandwidth by applying as much compression as they can get away with. I’m not the only one to wish they’d be less aggressive with their compression, but how noticeable it is will depend on whether things like the range of colors in your image and amount of detail in your photo.
In the examples above, the JPG compression is far more noticeable in the montage version than in the Sydney Harbour Bridge version. I set the quality and sharpening settings the same for each in the originals before they were uploaded. Some users have reported that images with lots of reds and oranges seem to show the effects of the compression more than ones with blues and greens, but it depends on the actual image.
It also seems to depend on what kind of image you’re displaying. Photo gallery images seem to have less compression applied in displaying than do design elements like the cover photo and profile picture.
There are some things you can do in prepping the images before uploading that can help reduce the chances that your image will come out looking crappy.
Upload images that are 99KB or less in filesize. Facebook should leave images less than that untouched, which gives you control over how the compression is applied.
Upload images that don’t have a lot of compression already applied. For JPGs, for example, try keeping the quality setting at 80 or above–Facebook is going to compress it again anyway. If you’re using software that factors in colorspace (like Lightroom or Photoshop), use sRGB colorspace. And uploading images that are already resized to close to or at the target display size and not overly sharpened seems to work well.
If none of these work, take a look at my post on how to get sharp text on Facebook images.
Getting Fuzzy Text, Logos, or Watermarks on Images?
If you’re including text, a logo, or watermark and finding that it’s ending up fuzzy and unclear due to the JPG artifacts, I’ve got a separate post detailing how to fix it: How to get sharp text on Facebook images.