Facebook Banner Sizes

Why bigger images are better in Facebook cover styles (complimentary template & ideas to prove it). Facebook Banner Sizes, After substantial screening, I've found that profile pictures are displayed at 160 × 160 pixels at the top of your main profile page-- as they are in every Facebook design template I've ever found on the Web.


Facebook Banner Sizes


However, if you attempt to publish a profile photo that's 160 pixels large, you'll receive a Facebook error mentioning that your profile image should be at least 180 pixels broad. Confusing, right?

Here's the deal-- You can't submit profile photos that are smaller than 180 pixels, however you can upload images that are bigger.

For finest results, upload images that are bigger than advised.

The majority of the guidance you'll discover about Facebook's cover images is even more complicated. Facebook's Assistance files (and most design templates) state that your cover image ought to be exactly 851 pixels broad by 315 pixels tall.

But larger is much better since when you click on a cover photo and the image opens in a brand-new window over the profile page, your picture is shown in its real size (or as near full size as the area in your browser window enables). And larger images certainly look much better on the huge displays numerous people utilize.

Here's exactly what I discovered: If you upload a cover image that is smaller than 851 × 315 pixels, Facebook will extend it to fit the screen area. But if you upload a larger cover image that's bigger, Facebook will minimize the image so that it shows simply great in your profile page, and you'll have the benefit of the larger size when somebody clicks on it. Note: For best outcomes, keep your cover image the same element ratio as the advised 851 × 315 or it will get cropped to fit.

Caution: The most limiting factor when it concerns develop cover images is that you have to keep the overall file size of each image less than 100 KB. If the file size is larger, Facebook will compress it for you, and you'll practically certainly improve outcomes if you enhance your images using the Save for Web dialog in Photoshop.

How to use this Facebook Timeline template.

The template is created to function as a standard to assist you get your pictures into the appropriate sizes and see how they fit together.

  • Download the template in the format you prefer utilizing the links below.

  • Open the template in Photoshop, Photoshop Aspects, or your preferred image editor.

  • Open any image( s) you wish to utilize in your Timeline and copy and paste them into the design template.

  • Resize and adjust your images, using the design template as a guide for how they will fit together on Facebook.

  • Once you get the images the method you desire them, crop out each image individually (turning layers on and off as needed).

  • Export the smaller profile image and the huge cover image as 2 different pieces (as jpegs) and submit those to Facebook.


Note: You do not need to resize your images before exporting them. If you create your page at the size of this template, Facebook will make them fit nicely in your profile.

Keep in mind: Profile photos display at 160-pixels broad, however Facebook requires that you upload a photo that is at least 180-pixels large. Facebook accepts profile images that are even larger, and they typically look better that way, which is why this design template is twice the size of most Facebook templates.

Download Facebook Timeline Design Template.

To save the jpeg variation above.
Click on the template image at the top of this page to open the complete size variation, then Right-click (option-click on a Mac) and choose Save Image.

Download the Facebook Design template in layered PSD format.
Download the Facebook Design template in layered TIF format.

Enhancing JPEG Images with the Save for Web dialog in Adobe Photoshop


The JPEG format is the very best option for optimizing continuous-tone images, such as pictures and images with numerous colors or gradients. When you optimize a JPEG, you can make the file size smaller sized by using compression. The more compression, the smaller sized the image, however if you compress the image excessive, the image can look terrible. The technique is discovering the right balance, as you discover in this section.

If you have a digital photo or another image that you desire to prepare for the Web, follow these steps to optimize and save it in Photoshop (in Photoshop Aspects or Fireworks, the procedure is comparable although the specific steps might differ):.

1. With the image open in Photoshop, pick File > Save for Web & Gadget (or Submit > Save for Web).

The Save for Web & Devices dialog box appears.

2. In the top-left corner of the dialog box, select either 2-Up or 4-Up to display numerous variations of the very same image for simple side-by-side contrast.
In the example shown here, I picked 2-Up, which makes it possible to view the initial image left wing and a sneak peek of the very same image as it will appear with the specified settings on the right.

The 2-Up option, as the name suggests, shows 2 various versions for comparison, as you can see below.



3. On the ideal side of the window, simply under Preset, click the little arrow to open the Optimized File Format drop-down list and select JPEG.

4. Set the compression quality.

Use the pre-programmed alternatives Low, Medium, High, Very High, or Maximum from the drop-down list. Or utilize the slider just under the Quality field to make more accurate changes. Reducing the quality reduces the file size and makes the image download quicker, but if you lower this number excessive, the image will look fuzzy and blotchy.

Photoshop utilizes a compression scale of 0 to 100 for JPEGs in this dialog window, with 0 the most affordable possible quality (the greatest amount of compression and the smallest file size) and 100 the highest possible quality (the least quantity of compression and the greatest file size). Low, Medium, and High represent compression worths of 10, 30, and 60, respectively.

5. Specify other settings as wanted (the compression quality and file format are the most important settings).

6. Click Save.

The Save Optimized As dialog box opens.

7. Get in a name for the image and wait into the images folder in your Website folder.

Photoshop conserves the enhanced image as a copy of the initial and leaves the original open in the primary Photoshop work area.
Repeat these steps for each image you wish to optimize as a JPEG.

At the bottom of the image sneak peek in the Save For Web and Gadgets dialog box Photoshop includes an estimate of the amount of time the image will take to download at the defined connection speed. In the example shown in the figure above, the quote is 7 seconds at 56.6 kbps.

As you change the compression settings, the size of the image will change and the download price quote will automatically change. You can change the connection speed utilized to make this computation by clicking the small arrow just to the right of the connection speed, and utilizing the drop-down list to select another option, such as 256 kbps for Cable Modem speed. Utilize this estimate as an overview of help you choose how much you ought to enhance each image.

Thanks for reading Facebook Banner Sizes!

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel