Degraded image quality in summary cards w/large image?

[leereilly]

Hi there,

I’m noticing some degraded quality in our Twitter cards’ large images post-processing on Twitter’s end. Concrete example below for this tweet:

What the card image looked like ~ 3 months ago i.e. solid red & looks good:

What the card images look like now i.e. EUGGHHH!

A few questions:

1. Has Twitter’s cropping/resizing/optimization algorithm used in processing these images changed permanently?
2. We usually reuse the 1200x630px images that we optimize for Facebook for the Twitter images too. 99 times out of 100 that works perfectly. Are there new sweetspot file sizes / file types / dimensions we should aim for to optimize for Twitter to eliminate this distortion?

Any tips you have to make our images rock again would be appreciated!

Cheers,
Lee

[andypiper]

I can answer the first question - yes, we recently switched over to an alternative backend for image handling.

I don’t currently know what to tell you on the second half of the question, but I’ll find out what we are able to share.

[aislematt]

Also just noticed that our cards started to look really bad. I tried different sizes, image resolutions, image types to no avail. It looks like the images are being stored at 386x202 on pbs.twimg.com even though on the Twitter website they are actually displayed at 506x254, making it look bad.

While looking through twitter to see if all cards were affected, I noticed that certain cards were being hosted on o.twimg.com (example here - https://twitter.com/davidlongoria7/status/826887697448972288). I can’t really see any different in the meta tags or sizes that would account for the difference in how twitter decides to host these card images.

I would really appreciate knowing if theres anything we can do to to fix this issue.

Thanks,
Matt

[andypiper]

We’re looking into this to see whether our recent backend change might have affected this processing.

[andypiper]

It appears that the cause of this has been identified, and we hope to resolve it over the next week or so.

[Ehsan]

Having the same issue with our site and i thought it was just us, looking forward to the fix. Thanks

[andypiper]

As I understand it there may be a delay of several days to resolve, but this should not require any changes on the side of those implementing cards. As I learn more I will share!

[leereilly]

Thanks for looking into this and reporting back @andypiper

[andypiper]

Update on this, we merged a change in that should resolve the issue. There’s a chance that some of your cards may still be cached within the usual 7 day cache window, but after that this should settle out (and posts with new cards should not have the same issue). I’ll leave this thread open for the moment just to confirm that this is resolved.

[leereilly]

Hi @andypiper - thanks for the update. I just created a new card (with a brand new URL and 1200x630 image similar to the one shown above) and I’m still seeing the distortion. There’s no possibility here that it’s showing me the results for a cached page, or cached image - it’s brand new URL, and I added some text to the image…

What I’m seeing:

Here’s my test case (original markup and image) if that’s useful to you:

leereilly/twitter-summary-card-test

Cheers,
Lee

[andypiper]

thank you @leereilly - please be patient. I will pass this over to the relevant folks.

[leereilly]

No worries, @andypiper. In the meantime, do you happen to know if there are sweetspot image sizes/dimensions where it’s guaranteed that there’ll be no cropping and/or resizing - even if it’s just for desktop or mobile clients? Thanks!

[leereilly]

Hi there,

I just wanted to comment to keep this topic open and see if the relevant team(s) have any updates?

Note: I’m still seeing this distortion on old card images and new images at 1200x630px*.

• Any plans to switch back to the old system / algorithm / whatever, or make any changes to make the output images the same quality as they were previously?
• Any guidance you can provide on exact sweetspot image dimensions and sizes that can prevent this from happening?

^{* Totally aware of the fact 1200x630px are the sweetspot dimensions for Facebook, but it used to work pretty great for Twitter too. If that’s no longer the case, I’d just like to know if there’s anything I can do to maximize image quality on my end.}

Cheers,
Lee

[andypiper]

Hey @leereilly thanks for the great question and comments.

I can share that there are no plans to “revert” on this. However I’m currently working on both a blog post and more detailed documentation updates that should delve into the change and offer more information along these lines. If you can bear with me another few days - I’d like to get this out this week but it could slip into next. Thanks!

[leereilly]

Awesome - thanks @andypiper. Looking forward to reading it!

[EnterFan]

Is there any answer coming? How long? Just need to know the new sizes.

[andypiper]

I’ve just committed a documentation change that should go out in the next deploy in the coming days, as well as a blog post explaining the changes.

For the sake of speed of getting the info to you, here’s the work-in-progress doc update prior to deployment (may be slightly tweaked yet):

twitter:image for summary card: 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 and GIF formats are supported. Only the first frame of an animated GIF will be used. SVG is not supported.

---

twitter:image for summary_large_image card: 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 2:1 with minimum dimensions of 300x157 or maximum of 4096x4096 pixels. Images must be less than 5MB in size. JPG, PNG and GIF formats are supported. Only the first frame of an animated GIF will be used. SVG is not supported.

Note that, in all cases, images will be transcoded to JPG by our crawler at a quality based on performance criteria in our pipeline.

[system]

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.