Last night I finished up on my creation of images for the new template test. Based on research conducted over the last week, I have compiled a list of image sizes (see below) with references to their source.
I found it surprising that 1.91x1 is as common as it is, appearing both as a social media standard for Facebook and LinkedIn. What I found even more interesting is that 1.91x1 formats are not the same across the board. While Facebook uses a 1200x630 (which is just a tad over the 1.91x1 ratio), LinkedIn lists 1200x627 (which is slightly under the 1.91x1 ratio). Ultimately, I decided to go with just one 1.91x1 image for the template system at the 1200x630 image size, as Facebook is more prevalent in the social media world. Also, 1200x627 stretched vertically to 1200x630 will have minor visual distortion, whereas, 1200x630 cropped to 1200x627 would only lose 3 pixels on the vertical axis.
Another intesting note, is that Twitter, not Google, noted that vector based SVGs can not be used. This brings to mind the research of a few days ago with the Structured Data Testing Tool from Google that displayed an error when using SVG image format in microdata and JSON-LD object definitions. It's sad that a scalable vector format can't be used for a required image. It would be much nicer to use a much smaller filesize and a truly scalable format.
FACEBOOK
https://developers.facebook.com/docs/sharing/best-practices/
- 1x1: 1200 x 1200
- 4x3: 1200 x 900
- 1.91x1: 1200 x 630
Use images that are at least 1200 x 630 pixels for the best display on high resolution devices. At the minimum, you should use images that are 600 x 315 pixels to display link page posts with larger images. Images can be up to 8MB in size.
GOOGLE+
https://developers.google.com/+/web/snippet/
Images that are too small or not square enough are not included in the +Snippet, even if the images are explicitly referenced by schema.org microdata or Open Graph markup. Specifically, the height must be at least 120px, and if the width is less than 100px, then the aspect ratio must be no greater than 3.0.
PINTEREST
https://developers.pinterest.com/docs/rich-pins/reference/
The URL for a high-resolution image related to the article. You can add up to 6 og:image tags.
Here are the image requirements specific to the LinkedIn sharing module:
- Max file size: 5 MB
- Minimum image dimensions: 1200 (w) x 627 (h) pixels
- Recommended ratio: 1.91:1
STRUCTURED DATA - GOOGLE RICH RESULTS - NON AMP
https://developers.google.com/search/docs/data-types/article#non-amp
- 1x1: 1200 x 1200
- 4x3: 1200 x 900
- 16x9: 1200x675
Repeated field of ImageObject or URL, required
The URL to an image that is representative of the article. Only a marked-up image that directly belongs to the article should be specified. Images should be at least 696 pixels wide.
Additional image guidelines:
- Every page must contain at least one image (whether or not you include markup). Google will pick the best image to display in Search results based on the aspect ratio and resolution.
- Image URLs must be crawlable and indexable.
- Images must represent the marked up content.
- Images must be in .jpg, .png, or. gif format.
- For best results, provide multiple high-resolution images (minimum of 300,000 pixels when multiplying width and height) with the following aspect ratios: 16x9, 4x3, and 1x1.
STRUCTURED DATA - GOOGLE RICH RESULTS - AMP
https://developers.google.com/search/docs/data-types/article#amp
- 1x1: 1200 x 1200
- 4x3: 1200 x 900
- 16x9: 1200x675
Repeated field of ImageObject or URL, required
The URL to an image that is representative of the article.
Additional image guidelines:
- Only a marked-up image that directly belongs to the article should be specified.
- Images should be at least 1200 pixels wide.
- Every page must contain at least one image (whether or not you include markup). Google will pick the best image to display in Search results based on the aspect ratio and resolution.
- Image URLs must be crawlable and indexable.
- Images must represent the marked up content.
- Images must be in .jpg, .png, or. gif format.
- For best results, provide multiple high-resolution images (minimum of 800,000 pixels when multiplying width and height) with the following aspect ratios: 16x9, 4x3, and 1x1.
TWITTER
https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/summary.html
- 1200x1200
A URL to a unique image representing the content of the page. You should not use a generic image such as your website logo, author photo, or other image that spans multiple pages. Images for this Card support an aspect ratio of 1:1 with minimum dimensions of 144x144 or maximum of 4096x4096 pixels.
Images must be less than 5MB in size. The image will be cropped to a square on all platforms. JPG, PNG, WEBP and GIF formats are supported. Only the first frame of an animated GIF will be used. SVG is not supported.
Articles
Graphic Design
Images
Web Image Formats
