Social share images are one of the most important parts of your viral campaign. A carefully crafted image can boost engagement and increase the number of clicks you get from people sharing with their friends.
This quick guide shows you how to create high-converting images optimized for social sharing.
Facebook Sharing
If you share a link to Facebook, the image associated with the link can be displayed in a number of ways. This depends on the image size (pixel width and height) and shape (orientation).
Facebook recommends using images at least 1200 x 630 pixels for the best display on high resolution devices, with images up to 8MB in size allowed.
At the minimum, you should use images that are 600 x 315 pixels to display link page posts with larger images.
Images smaller than 600 x 315 pixels will display in the link page post, but the size will be much smaller.
Try to keep your images close to 1.91:1 aspect ratio to display the full image without any cropping. This means the width should be roughly 1.9 times the height.
If the image does not fit these dimensions or is not large enough, it will not display full-width.
Instead, a thumbnail image will be placed in a small box to the left of the link text scaled and cropped to fit a 158 x 158 pixel square.
The minimum image size is 200 x 200 pixels, any image smaller will not appear on Facebook.
Optimal Facebook image size
We’ve found creating an image sized at 1024 x 512 pixels, but remaining within the boundaries of 980 x 512 pixels the best solution for creating and sharing images to Facebook.
This means no important visual elements should be outside of the 980 x 512 pixels box.
Anything outside of this will be cropped from the top and bottom in order to fit.
It’s not the recommended size, but big enough to look great on high resolution displays and generate a large image preview when sharing.
This is also the ideal image size for Twitter Cards.
If your image is smaller, the best dimensions to choose are 512 x 256 pixels and remain within the boundaries of 490 x 256 pixels, which would still be optimized to display on mobile.
Optimize the preview
When content is shared for the first time, Facebook has to see an image at least once before it can be rendered.
This means that the first person who shares a piece of content won’t see a rendered image.
To avoid this and have images render on the first share action, you must pre-cache the image with the Facebook Sharing Debugger.
Run your URL through the Facebook Sharing Debugger to get metadata for your page.
If the share message or image are updated, you must re-run your URL through the Facebook Sharing Debugger so that they have the most up-to-date information about your page.
Be aware. There is a limit to how many times Facebook allows you to “scrape” and “re-scrape” a URL, so use it sparingly. In our experience about 5 times, then you have to wait.
Click here for more info on Facebook Sharing Best Practices.
Pinterest Sharing
There is no standard size for Pinterest share images, just make sure images are at least 600 pixels wide.
735 pixels wide x any height seems to be the most commonly accepted.
Images smaller than 100 x 200 (or 200 x 100) pixels will not work.
Design images with a vertical image aspect ratio of 2:3 to a maximum of 1:2.8. Taller, vertically-oriented images look better on mobile screens, which is the majority of Pinterest users.
Other Social Network Sharing
Social Networks like Twitter, Google+ and others will pull the share image used for Facebook.
Users will also have the option to share any other images on your page, like product feature images.
Image Creation
Most online tools let you both edit existing photos and create new image graphic designs. Here is a list of our favorites:
- Adobe Creative Cloud – the mac daddy of photo and image creation (Photoshop, Illustrator, etc). Very steep learning curve.
- Pablo – design engaging social media images.
- Canva – build perfectly sized social media pics. They also feature a photo editor.
- PicMonkey – creative tools for photo editing and graphic design.
- BeFunky – produce photos and designs with easy-to-use editing tools.
- GetStencil – simple image creation for social media. They include royalty-free photos.
- Placeit – beautiful iPhone, iPad, iMac and Macbook mockup images and videos.
Looking for awesome stock photos? Check out our post on finding the perfect image, with sections linking to stock photography sites.
Exporting Images
Without getting into the technical details of each, here are the generally recommended formats to ensure the best quality when exporting images for the web:
PNG, GIF or SVG – best for graphics heavy images like logos, text graphics, etc.
PNG, JPG and sometimes GIF – best for images combining photographs and graphics.
PNGs can produce larger files than their JPG equivalent, and this might impose longer download times for your visitors. Use them mainly for illustrations and graphics. Try experimenting with both formats and go with the one that looks best.
JPG – best used for photographs.
When exporting your files, be sure to use the following settings:
- Export PNGs as PNG-24
- Export JPGs as sRGB quality
- All images should be at 72 ppi or above.
- Do not attempt to upload any other file type. That means no PSD files!
Note that some of the tools mentioned in the “Image Creation” section will not provide some of the advanced settings, that’s because they are already optimized to provide great results.
When naming your files the best practice is to clearly label them. This will help prevent any encoding issues. Make sure the file name has no spaces, instead use underscores(_) or dashes (-):
- My_image_file.jpg – OK
- My-image-file.png – OK
- My Image file.jpg – might break the internet. Not OK.
Social Share Image Best Practices
Design the perfect social share image
Avoid placing something bland, like just your logo. Treat your social share image like a mini campaign, where the image effectively conveys the main message of your campaign.
Here are some proven strategies that will help get more engagement from your social sharing images:
- Include a great product shot.
- Use text overlays to give the image more context.
- Place a call-to-action to mimic the feel of a button.
This amazing example comes from Glowforge, who launched the biggest 30-day crowdfunding campaign in history. Check it out!
Here are a few more good examples:
This share catches the eye with a curious image.
The use of warm color hues make this share image contrast against Facebook blues.
Does KickoffLabs compress, optimize, re-format my images?
No. KickoffLabs does NOT do any type of processing on your images. What you upload is what your visitors see and share.
However, most social networks automatically compress, resize and reformat uploaded images so they are optimized for sharing, but the side effect can be a poor looking image.
To avoid unwanted compression artifacts and make sure your images appear in the highest possible quality, it’s best to use the full-size, uncompressed image.
If you have any further questions on generating an amazing social share image, send an email to support@kickofflabs.com