Description of issue:
I started to notice some of the images I have set for the Twitter card are not showing up. These are my tweets https://twitter.com/search?q=iainsmith.me%20(from%3Ab099l3)&src=typed_query&f=top

URL affected (must be public):
https://iainsmith.me/future-proof-your-flutter-env/

Troubleshooting steps attempted [note that we will not prioritise posts unless there is evidence of following the troubleshooting guides]:

The validator shows this result:

I have tried changing the image to a simple image and it works but with this particular image, it seems to not work. Both are 1200x675. I don’t think the size is an issue as it is 971KB. Something I can see that is different is the colour depth? but I think this is a red hearing?:
Working image “willitshow”:


Non working image “Future-proofed-header-1200x675”:

I have ran
curl -v -A Twitterbot https://iainsmith.me/future-proof-your-flutter-env/
Tags in header:

<meta property="og:site_name" content="Iain Smith" />
<meta property="og:type" content="article" />
<meta property="og:title" content="The future-proof solution to manage your Flutter versions: global, FVM, or asdf-vm?" />
<meta property="og:description" content="Want to try the latest Flutter version but don&#x27;t want your existing projects to break? Want to have a consistent environment across the dev team? Want to future-proof your dev environment? Let me show you how..." />
<meta property="og:url" content="https://iainsmith.me/future-proof-your-flutter-env/" />
<meta property="og:image" content="https://iainsmith.me/content/images/2022/02/Future-proofed-header-1200x675.png" />
<meta property="article:published_time" content="2022-01-26T09:04:33.000Z" />
<meta property="article:modified_time" content="2022-02-02T01:17:35.000Z" />
<meta property="article:tag" content="Flutter" />
<meta property="article:tag" content="How-to" />

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="The future-proof solution to manage your Flutter versions: global, FVM, or asdf-vm?" />
<meta name="twitter:description" content="Want to try the latest Flutter version but don&#x27;t want your existing projects to break? Want to have a consistent environment across the dev team? Want to future-proof your dev environment? Let me show you how..." />
<meta name="twitter:url" content="https://iainsmith.me/future-proof-your-flutter-env/" />
<meta name="twitter:image" content="https://iainsmith.me/content/images/2022/02/Future-proofed-header-1200x675-1.png" />
<meta name="twitter:label1" content="Written by" />
<meta name="twitter:data1" content="Iain Smith" />
<meta name="twitter:label2" content="Filed under" />
<meta name="twitter:data2" content="Flutter, How-to" />
<meta name="twitter:site" content="@b099l3" />
<meta name="twitter:creator" content="@b099l3" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="675" />

I am very sorry to have to raise this but I can’t find what is wrong?

I know the docs have a much bigger limit for images but just from previous experience I’ve seen it fail with that size of image before, I’d aim for something around 250KB or definitely under 500KB if you can. Sometimes it’s not the file size of the image, it’s the speed of your server - if it takes more than a couple of seconds to respond and send the image to twitter, it will also fail to show.

Yeah looks like it is my server then, as images under about 200KB work. Sorry for the bother and thank you for looking into this.

1 Like

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