Task #86419

Add default cropping ratio for social share images

Added by Richard Haeser 11 months ago. Updated 4 months ago.

Status:
Closed
Priority:
Should have
Category:
SEO
Target version:
Start date:
2018-09-28
Due date:
% Done:

100%

TYPO3 Version:
9
PHP Version:
Tags:
Complexity:
Sprint Focus:

Description

Facebook, LindedIn and Twitter do have the same aspect ratio for images of shared URL's. So it would be great if the default aspect ratio of the cropping tool is already providing the 1.91 / 1 ratio.

Associated revisions

Revision e1ffbaab (diff)
Added by Richard Haeser 10 months ago

[TASK] Added default cropping ratio for social media images

Most of the social networks use the 1.91:1 aspect ratio for images that
belong to the page that is shared.

Now og:image and twitter:image will be rendering an image with a 1.91:1
ratio by default.

Resolves: #86419
Releases: master
Change-Id: Icd3588363f64659f66ba25d4f44a57afff5c1fe1
Reviewed-on: https://review.typo3.org/58774
Tested-by: TYPO3com <>
Reviewed-by: Riny van Tiggelen <>
Tested-by: Riny van Tiggelen <>
Reviewed-by: Susanne Moog <>
Reviewed-by: Benni Mack <>
Tested-by: Benni Mack <>

History

#1 Updated by Richard Haeser 11 months ago

  • Category set to SEO
  • Assignee set to Riny van Tiggelen

#2 Updated by Benni Mack 11 months ago

  • Target version changed from 9 LTS to next-patchlevel

#3 Updated by Gerrit Code Review 11 months ago

  • Status changed from Accepted to Under Review

Patch set 1 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/58546

#4 Updated by Gerrit Code Review 11 months ago

Patch set 2 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/58546

#5 Updated by Gerrit Code Review 11 months ago

Patch set 3 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/58546

#6 Updated by Josef Glatz 11 months ago

Research and my suggestion

According to https://blog.bufferapp.com/ideal-image-sizes-social-media-posts and many other sites and the opengraph website I would suggest the following aspect ratios supported out of the box to minimize integration work for every TYPO3 project:

- 1.91:1
- 9:16
- 16:9
- 4:5
- 3:2
- 2:3
- 1:1
- Free/NaN

based on the following overview:

# Facebook

1.91:1 Sharing images: 1,200 x 628 pixels
1.91:1 Sharing links with an image: 1,200 x 628 pixels
9:16   Sharing Stories: 1,080 x 1,920 pixels*

# Instagram

1:1    Sharing square images: 1,080 x 1,080 pixels
1.91:1 Sharing horizontal images: 1,080 x 566 pixels
4:5    Sharing vertical images: 1,080 x 1,350 pixels
9:16   Sharing Stories: 1,080 x 1,920 pixels*

# Twitter

16:9   Sharing a single image: 1,200 x 675 pixels
16:9   Sharing multiple images: 1,200 x 675 pixels
1.91:1 Sharing links with an image: 800 x 418 pixels

# LinkedIn

3:2    Sharing images to Company Page or personal profile: 1,104 x 736 pixels
1.91:1 Sharing links with an image to Company Page or personal profile: 1,200 x 628 pixels

# Pinterest

2:3    Sharing images: 800 x 1,200 pixels

# Google+

1.91:1 Sharing images or links with an image: 1,200 x 628 pixels

# Snapchat

9:16   Sharing images: 1,080 x 1,920 pixels*

I will update the next patchset based on that research

#7 Updated by Gerrit Code Review 11 months ago

Patch set 4 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/58546

#8 Updated by Gerrit Code Review 10 months ago

Patch set 1 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/58774

#9 Updated by Gerrit Code Review 10 months ago

Patch set 2 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/58774

#10 Updated by Richard Haeser 10 months ago

  • Status changed from Under Review to Resolved
  • % Done changed from 0 to 100

#11 Updated by Benni Mack 4 months ago

  • Status changed from Resolved to Closed

Also available in: Atom PDF