Description of issue:
Using the twitter card validator, following image is displayed fine:
<meta name="twitter:image" content="https://images-stag.vrt.be/podcast_overlay/2020/12/09/e028ffe3-3a2b-11eb-a575-024847ac1f65.png">
This one is not displayed (the json says ‘Unknown aspect ratio’, but I’m suspecting that is a side-effect of twitter not being able to crawl the image).
<meta name="twitter:image" content="https://images-stag.vrt.be/podcast_overlay/2022/03/29/eacf10db-af61-11ec-841f-024847ac1f65.jpg">
Either twitter can not crawl one of the 2 images (although they are on the same domain), or maybe there is something wrong with the metadata of the image files itself?
There are no errors in the ‘Log’ section of the validator.
Any help would be greatly appreciated!
Okay, it turned out it was something with our image metadata in the end.
The image that was working had metadata looking like this:
Format : JPEG
File size : 272 KiB
Image
Format : JPEG
Width : 1 400 pixels
Height : 1 400 pixels
Color space : YUV
Chroma subsampling : 4:2:0
Bit depth : 8 bits
Compression mode : Lossy
Stream size : 272 KiB (100%)
The image that was not working had metadat like this:
Format : JPEG
File size : 384 KiB
Image
Format : JPEG
Width : 1 400 pixels
Height : 1 400 pixels
Color space : YUV
Chroma subsampling : 4:2:0
Bit depth : 8 bits
Compression mode : Lossy
Stream size : 384 KiB (100%)
ColorSpace_ICC : RGB
After altering our image store to strip the ColorSpace_ICC from all images, it seemed to start working.
2 Likes
Great! thanks for sharing, this is a really subtle one, good to know!
1 Like