Forum Moderators: not2easy & rumbas

Message Too Old, No Replies

Twitter - Clickable Images?

         

keyplyr

3:02 pm on Aug 6, 2016 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Some tweeted images click-through to remote pages.
How is this done?

bakedjake

3:12 pm on Aug 6, 2016 (gmt 0)

WebmasterWorld Administrator 10+ Year Member Top Contributors Of The Month



Do you mean image cards? See [dev.twitter.com...]

Cards Overview: [dev.twitter.com...]

keyplyr

3:17 pm on Aug 6, 2016 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Don't know what the term is. Thanks, I'll read those links.

bakedjake

3:24 pm on Aug 6, 2016 (gmt 0)

WebmasterWorld Administrator 10+ Year Member Top Contributors Of The Month



You'll pick it right up - basically, it's just a bunch of special meta tags on the page you want to link to, then you just insert the link as a tweet and twitter's bot reads the tags from your page.

There's various types of "cards" too - I think you saw an image one, but there's also ones for app downloads and video.

ken_b

3:31 pm on Aug 6, 2016 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



It seems like those could/should drive a lot more traffic than a plain link.

keyplyr

10:17 pm on Aug 6, 2016 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Too bad Twitter needs their own propriety tags and doesn't just use ogg tags for images like FB and Google+.

keyplyr

12:52 am on Aug 7, 2016 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



After adding the meta tags, I found I needed to bust the cache Twitter had of my page by using the Cad Validator [cards-dev.twitter.com...]

This is also true of Facebook's Open Graph Object Debugger [developers.facebook.com...]

Robert Charlton

9:12 am on Aug 16, 2016 (gmt 0)

WebmasterWorld Administrator 10+ Year Member Top Contributors Of The Month



Too bad Twitter needs their own propriety tags and doesn't just use ogg tags for images like FB and Google+.
I was thinking the same thing when I saw the proprietary twitter card markup. We're talking about Open Graph tags (abbrev OG or og). Apparently there's an overlap in some core og markup for title, description, image, etc... but Twitter, Facebook, Google+, Medium, Pinterest, LinkedIn, etc are all adding proprietary tags. It would be great to have one simplified standard... though perhaps that's no longer possible.

Here are some implementations related to this thread that I could find quickly...

The Open Graph Protocol
http://ogp.me/ [ogp.me]

Cards Markup Tag Reference
https://dev.twitter.com/cards/markup [dev.twitter.com]
The table in this section explains the OpenGraph fallback behavior for each Twitter tag.

The most complete systematic overview I came across in my relatively short research period came up with Cyrus Shepard's 2013 compilation in MOZ....

Must-Have Social Meta Tags for Twitter, Google+, Facebook and More
By: Cyrus Shepard
November 7, 2013

https://moz.com/blog/meta-data-templates-123 [moz.com]

IMO, well selected optimized images are one of the key factors for successful social sharing. Square images often suck, so I'd go against the grain and try to find dimensions that will work visually on whatever platform. I don't know whether it's possible to set up multiple image choices for each platform, but it's a nice feature. I remember that there was a way to give users a choice of sharing one among several images for Facebook, but have lost track of the code for that. I'd be happy to see an example if someone has it. Similar flexibility would of course be great for Twitter.

keyplyr

9:52 am on Aug 16, 2016 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



I've found it best to create different sized images for each Google+ (link_rel), Twitter (twitter tags) and Facebook (og tags.)

Those FB image choices are just the largest succesive images on the page if there is no properly sized og image set.

Robert Charlton

9:59 am on Aug 16, 2016 (gmt 0)

WebmasterWorld Administrator 10+ Year Member Top Contributors Of The Month



keyplyr... understood.

I'm not just talking about image sizes, though. I'm talking about different image choices. Sometimes, I find, the preselected image is exactly wrong for what I decide I want to post.

keyplyr

10:04 am on Aug 16, 2016 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Yes, that too. I use different social media differently.

Also, the sites I have coded in HTML5.0 can validate using OG tags, but not the older sites where I used 4.1 transitional so I use the link_rel meta tags instead. Works well enough and I get both Google+ and FB.