Open Graph á móti Twitter Card: Hver er munurinn?

Báðir stjórna forskoðun tengla á samfélagsmiðlum. En þeir eru ekki sami hluturinn. Hér er hvenær á að nota hvort um sig - og hvers vegna þú ættir að nota bæði.

Open Graph — Facebook staðallinn

Open Graph var kynnt af Facebook árið 2010. Áður en OG merki, þegar einhver deildi tengli á Facebook, valdi pallurinn mynd og texta af handahófi af síðunni. Niðurstaðan var ófyrirsjáanleg og oft óaðlaðandi.

Facebook sagði: "Við skulum gefa vefstjórum staðlaða leið til að stjórna forskoðun tengla sinna." Þeir bjuggu til safn metamerkja sem hvaða vefsíða sem er gæti bætt við:

<meta property="og:title" content="Your Title" />
<meta property="og:description" content="Your description" />
<meta property="og:image" content="https://yoursite.com/image.jpg" />
<meta property="og:url" content="https://yoursite.com/page" />

Aðrir vettvangar tóku upp Open Graph staðalinn. LinkedIn, Discord, Slack, WhatsApp og Reddit allir lesnir og: merki til að birta forskoðun tengla.

Twitter Cards — Twitter staðallinn

Twitter bjó til sitt eigið kerfi sem kallast „Twitter Cards“ áður en Open Graph varð almennt notað. Twitter Cards notaðu aðra nafnavenju eiginleika:

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Title" />
<meta name="twitter:description" content="Your description" />
<meta name="twitter:image" content="https://yoursite.com/image.jpg" />

Twitter Cards hafa tvær megingerðir:

• samantekt — Lítil smámynd hægra megin á tístinu
• summary_large_image — Stór mynd sem tekur mest af kortinu (ráðlagt)

Samhæfni pallur

Hér er hvaða vettvangar nota hvaða merki:

Af hverju þú ættir að stilla bæði

Jafnvel þó að flestir pallar styðji báðar merkjategundirnar, þá eru góðar ástæður til að stilla bæði:

1. X/Twitter kýs frekar twitter:card merki. Þó að X geti fallið aftur í OG-merki, gæti það verið að það skili þeim ekki rétt. Að stilla bæði tryggir að X sýnir rétta kortagerð.
2. Framtíðarsönnun. Ef nýr vettvangur kemur á markað og kýs einn staðal umfram annan, tryggir það samhæfni að hafa báða.
3. Samkvæmni. Með því að nota bæði tryggir það að forsýningin þín líti rétt út, óháð því hvaða vettvangur les hvaða merki.

Heildaruppsetningin

Hér er ráðlögð uppsetning fyrir hvaða síðu sem er:

<!-- Open Graph (LinkedIn, Discord, Slack, WhatsApp, Reddit) -->
<meta property="og:title" content="Your Title" />
<meta property="og:description" content="Your description" />
<meta property="og:image" content="https://yoursite.com/image.jpg" />
<meta property="og:url" content="https://yoursite.com/page" />
<meta property="og:type" content="website" />

<!-- Twitter/X (X/Twitter) -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Title" />
<meta name="twitter:description" content="Your description" />
<meta name="twitter:image" content="https://yoursite.com/image.jpg" />

Gátlisti til fljótlegra laga

Algengar spurningar