My question is related to this one, this one, and this one, but completely different. The URL http://ogp.me/ lists the following example, where multiple images are defined within a single page:
<meta property="og:image" content="http://example.com/rock.jpg" />
<meta property="og:image:width" content="300" />
<meta property="og:image:height" content="300" />
<meta property="og:image" content="http://example.com/rock2.jpg" />
<meta property="og:image" content="http://example.com/rock3.jpg" />
<meta property="og:image:height" content="1000" />
However, the site does not say how these multiple images are used. I was thinking that perhaps Facebook scrapes all of the images specified with the og:image
property and displays the one which best matches the resolution of the browsing device. But I'm not sure of this, and need confirmation.
If I include a 315x315 PNG image and a larger 1200x630 image, so that one can be used as a small image with the text corresponding to the image displayed by Facebook on its right-hand-side, and the other one is a full-size image occupying a rectangular rather than square area with the text described on the site below it, then how does Facebook decide whether to use one image or the other? (Personally, I have a square logo to display, so the smaller image might be best, with the text corresponding to the logo on the right, but I'm not sure whether to include just one of these two images or both?)
Thank you for your answers!!!