- Facebook Photos Size Guide: Dimensions & Types (2013 Edition)
- How to Make a Facebook Cover Photo Collage with Lightroom
- How to Set the iPhone 5 Wallpaper Image: Size & Pixel Dimensions
- What TIFF Compression Type Should You Use? ZIP or LZW?
Facebook has made some changes to its image sizes and layout recently, so here’s my updated 2013 version of the guide for Facebook image and photo sizes and types. You can see the examples below in action on my Facebook page.
The cover photo is the large panoramic image space at the top of the timeline. It’s displayed at 851px wide by 315px high. The image you upload must be at least 399 pixels wide–one that’s at least 720 pixels wide will work best. You can upload an image already cropped and resized to precisely those sizes (here’s how if you’re using Lightroom). Or you can upload a larger image, in which case you’ll be given a chance to move the image to choose the crop you’d like displayed.
You can only designate one photo as your Cover Photo. Panoramas are ideal. But there’s nothing stopping you from assembling a collage in your imaging software, saving it as a single image file, and uploading that. Here are some examples. And here’s a guide for creating a Facebook Cover Photo collage using Lightroom.
If you don’t yet have a cover photo, just click on the “Add Cover Photo” button at the top of the page where the Cover Photo will go. You’ll then get this warning popup:
Once you’ve added your photo, you can change it easily. When you’re logged in to your account and on the Timeline view, if you hover the mouse over the Cover Photo you should get a “Change Cover” button at the bottom right of the Cover Photo. Click on that and you’ll get the menu item to choose where photo comes from. You can choose from existing photos you’ve uploaded to Facebook or upload a new one. And if you decide you want to reposition or remove the photo, you can use the same menu. It looks a little something like this:
Facebook offers this advice: “To get the fastest load times for your Page, upload an sRGB JPG file that’s 851 pixels wide, 315 pixels tall and less than 100 kilobytes. For images with your logo or text-based content, you may get a higher quality result by using a PNG file.”
The Profile Image is now the smaller, square at bottom left of the header, overlapping the cover photo. In the examples above, it’s my shadow. Its final display dimensions are 160px by 160px, but you have to upload an image at least 180px by 180px. The thin white border is added automatically and there’s no way to remove it. The profile image will display 23 pixels from the left side of your cover photo and 210 pixels from its top.
If you use a photo that’s not square, you have some control over which part of the image to use for the crop. When you’re logged in, hover over the profile image and choose “Edit Profile Picture” and then “Edit Thumbnail”.
You can then click on the thumbnail and drag. Alternatively, you can check the “Scale to fit” box, which will display the whole image but fit within the same sized square (that is, you’ll end up with white on the top and bottom of a horizontal image or on the sides of a vertical image).
Profile Image on the Timeline
The profile image that appears next to your name on comments and posts is the same image but is automatically scaled down to 32px by 32px.
Shared Link Thumbnails
The thumbnail for shared links is sized to fit in a box 155px wide and 114px high, regardless of the orientation of the original image.
If you use a thumbnail that is a different shape, it will still be sized to fit within that 155px by 114px box. This is an example with a panorama-shaped thumbnail.
Timeline Photo Thumbnail
When you upload an image to the timeline, a large square thumbnail is automatically generated and displayed on the timeline at 403 px by 403 px. The center of the image is automatically chosen by default, but you can reposition the photo by clicking on the pencil icon to edit, then choose Reposition Photo and drag. You’re limited to dragging along the longest dimension. Be sure to hit the Save button once you’re happy with the positioning.
You can upload an image 403px by 403px, in which case no resizing will be done. The entire image will show as the thumbnail, and it won’t be upsized in the image viewer. Here’s an example of what happens when you upload an image 403px by 403px.
The timeline thumb:
And in the viewer:
But if you upload rectangular images with a longest side of 403px or less, landscape (horizontal) and portrait (vertical) images get handled differently. When you upload a horizontal image 403px wide, the whole image displays on the timeline, like this:
And it shows in the gallery view like this:
But if you upload a vertical image 403px tall, Facebook still tries to fill the width and cuts from the top or bottom, like this:
You’ll notice that it’s actually upsizing the image to do that, which creates the ugly jagged artefacts. The same image shows in the gallery view like this:
If you’re CSS-inclined, it’s because this is being applied to the thumbnail: height: auto; width: 100%. That translates as the image filling the full width no matter what, but the height doesn’t have to.
What is the Biggest Photo You Can Upload to Facebook?
Facebook nominally has a maximum upload size of 2048px wide, but the practical limit is actually much higher. I’ve tested with images 3000px wide and a 6000px by 4000px image. There was no problem in either case–they uploaded just fine and displayed normally. Which makes sense–most cameras and phones these days take images far bigger than 2048×2048, and expecting the user to resize every image before they upload would make things unnecessarily complicated (or, in business jargon, would create too much friction), and people would become less likely to post images.
At the moment, there are limits to the usefulness of uploading images bigger than 2048px. Most of the visitors to your page don’t have larger than a 27-inch monitor–a 2048px image with the design elements Facebook puts around it will fill up most of the screen on a monitor that size. It might become more useful when very large high-density displays like Retina screens become more common.
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. To my mind, they compress too much, 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 JPEG 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 a bit 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 image.
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 don’t have a lot of compression already applied. For jpegs, 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.
Protecting Your Images
Once you’ve shared an image on Facebook you’ve pretty much given up any control over protecting it. Others can download the photo simply by right-clicking. And, annoyingly, Facebook strips out all IPTC metadata when you upload the image, meaning that any embedded copyright information, location information, or captions are removed. It also renames the image, so adding copyright information to the filename doesn’t work either.
So your options are:
1. Share your photo and not worry if someone “borrows” it.
2. Share your photo and add a watermark (recognizing that people still might “borrow” it).
3. Don’t upload it to Facebook to begin with.
|Profile Image in Header||160px||160px||Must be uploaded at 180px by 180px|
|Profile Image on Timeline||32px||32px||Same image as main Profile Image, automatically downscaled|
|Thumbnail for Shared Links||155px||114px|
|Uploaded Timeline Photo Thumbnail||403px||403px||See exceptions above for small images.|
|Video Preview Thumbnail||403px||226px|
Facebook’s Terms of Service
Just because you can add photos to Facebook doesn’t necessarily mean you should immediately start uploading your entire image archive. Facebook’s terms of service are closely watched and often controversial. So I’d definitely recommend reading the TOS carefully before uploading to see whether it fits with what you want to do. If you’re a stock photographer that needs to control dissemination (eg. if you have an exclusive contract with an agency) you’ll want to look into this very carefully before uploading any photos that might cause a conflict. At the time of writing, the terms pertinent to sharing photos are:
Sharing Your Content and Information
You own all of the content and information you post on Facebook, and you can control how it is shared through your privacy and application settings. In addition:
- For content that is covered by intellectual property rights, like photos and videos (“IP content”), you specifically give us the following permission, subject to your privacy and application settings: you grant us a non-exclusive, transferable, sub-licensable, royalty-free, worldwide license to use any IP content that you post on or in connection with Facebook (“IP License”). This IP License ends when you delete your IP content or your account unless your content has been shared with others, and they have not deleted it.
- When you delete IP content, it is deleted in a manner similar to emptying the recycle bin on a computer. However, you understand that removed content may persist in backup copies for a reasonable period of time (but will not be available to others).
- When you publish content or information using the “everyone” setting, it means that you are allowing everyone, including people off of Facebook, to access and use that information, and to associate it with you (i.e., your name and profile picture).
- We always appreciate your feedback or other suggestions about Facebook, but you understand that we may use them without any obligation to compensate you for them (just as you have no obligation to offer them)
Again, it’s a bit of a moving target–Facebook updates its terms from time to time–so be sure to check the current, full version. And it’s also entirely possible that the terms will change at some point after you’ve uploaded the images. Oh, and while you’re at it, why not use the panel at right to “Like” my Facebook page so you’ll be sure to get more handy hints like these.