Hogyan használd az Open Graph tageket

Hogyan használd az Open Graph tageket

Használsz title tageket és meta description tageket? Persze, hogy használod, hiszen már tudod, hogy a meta tagek segíthetnek növelni a keresőmotoros helyezésedet.

De tudtad, hogy a meta tagek valójában a közösségi média forgalmát is befolyásolják? Persze, ott vannak a Google szerzői címkék, de mi a helyzet a Facebookkal és a Twitterrel? Valójában mindkettőnek megvannak a saját közösségi média meta-tagjei, amelyek segíthetnek növelni a közösségi forgalmat.

Láttad már azokat a posztokat a közösségi médiában, amelyekben menő képek és videók vannak? Talán nem tudod, hogy nincs szükséged semmilyen szoftverre vagy prémium fiókra ahhoz, hogy ugyanezt elérd a közösségi posztjaiddal.

Facebook Open Graph és Twitter Cards a nevük. Íme, hogyan használhatod ki mindkettőt:

Facebook Open Graph

Mikor megosztasz egy képet a Facebookon, hogyan néz ki?

Hát, nem mindig néz ki így. A Facebook megpróbálja kiolvasni az oldaladon lévő kódot, de nem mindig tudja kihúzni a képeidet. Ha nem használod az Open Graph címkéket, amikor megosztasz egy URL-t az oldaladról a Facebookon, akkor így nézhet ki:

Így szokott kinézni a Quick Sprouttal, mielőtt az Open Graph címkéket implementáltam az oldalamon. Az Open Graph címkék bevezetése után 174%-kal tudtam növelni a Facebook-forgalmamat, egyszerűen azért, mert most már egy kép volt a Quick Sprout állapotfrissítéseim mellett.

Most, hogy meggyőződtél arról, hogy használnod kell az Open Graphot, íme, hogyan állíthatod be a webhelyeden.

og:title

Ez az a hely, ahová a tartalom címét teszed. Gondolj erre úgy, mint a normál html title tagre, amelyet egy keresőmotor használna. Az og:title létrehozásakor a karakterek számát tartsa 95 karakternél kevesebbre.

Példa: <meta property=”og:title” content=”11 kreatív mód a linképítéshez”/>

og:type

Itt írja le, hogy milyen típusú tartalmat oszt meg. Videóról, képről, blogbejegyzésről stb. van szó? Itt van a teljes lista, amelyből választhatsz a tartalom típusának meghatározásakor:

Tevékenységek

• tevékenység
• sport

Üzletek

• bár

.

• cég
• kávézó
• szálloda
• étterem

csoportok

• mert
• sportbajnokság
• sportcsapat

szervezetek

• zenekar
• kormányzat

.

• non_profit
• iskola
• egyetem

Népek

• színész
• sportoló
• szerző
• rendező
• zenész
• politikus
• közszereplő

hely

• város
• ország
• országjelzés
• állam_tartomány

Termékek és szórakozás

• album
• könyv
• ital
• élelmiszer
• játék
• termék
• dal
• film

.

• tv_show

Weboldalak

• blog
• weboldal
• cikk

Példa: <meta property=”og:type” content=”article”/>

og:description

Ez is hasonló a html meta description taghez, mert a tartalom leírására szolgál. Nem szabad törődnöd azzal, hogy kulcsszavakban gazdag legyen, hanem olyan meggyőző leírást kell kitalálnod, amely több kattintást eredményez. Erre a tagre legfeljebb 297 karakter áll rendelkezésre.

Példa: <meta property=”og:description” content=”Belefáradtál a régi módszerrel történő linképítésbe? Tudod, azokat a módszereket, amelyek során e-maileket kell küldened webmesterek ezreinek, linkekért könyörögve. “/>

og:image

Memlékszel, említettem, hogy 174%-kal tudtam növelni a Facebook-forgalmamat? Ez azért volt, mert az Open Graph segítségével biztosítottam, hogy a Facebook minden alkalommal megjelenítsen egy képet, amikor valaki megosztott egy URL-t a Quick Sproutból.

Az og:image tag használatával biztosíthatod, hogy a megosztott tartalom mellett egy kép is megjelenjen. Így kiemelkedik az összes többi szöveges állapotfrissítés közül, amelyet az emberek az idővonalukon látnak.

Mielőtt belemennék abba, hogyan használhatja ezt a taget, végigmegyek a Facebook követelményein. A képnek legalább 50px x 50px méretűnek kell lennie, de lehetőleg nagyobbnak, mint 200px x 200px. Ráadásul a kép mérete nem lehet nagyobb 5 MB-nál.

Példa: <meta property=”og:image” content=”https://www.quicksprout.com/wp-content/uploads/2013/03/linkbuilding.jpg”/>

og:url

Ebben a tagben a megosztandó oldal URL-jét kell elhelyezni. Ez a tag lényegtelennek tűnhet, de fontos, mert néha egynél több URL címe lesz ugyanannak a tartalomnak. Ennek a címkének a használatával biztosíthatja, hogy minden megosztás egy URL-címre kerüljön, nem pedig több URL-címre, ami segítheti a Facebook Edgerankjét.

Példa: <meta property=”og:url” content=”https://www.quicksprout.com/2013/03/21/11-creative-ways-to-build-links/”/>

og:site_name

Ez a tag közli a Facebookkal a webhely nevét. Erre a tagre igazából nincs szükséged, de nem árt, ha feltünteted.

Példa: <meta property=”og:site_name” content=”Quick Sprout”/>

fb:admins

Ha van egy rajongói oldalad a Facebookon, és szeretnél több adatot kapni a Facebook Insights-ban, akkor ezt a taget kell használnod. Azt mondja a Facebooknak, hogy te vagy az oldal tulajdonosa, és összekapcsolja a Facebook rajongói oldaladat a weboldaladdal.

Példa: <meta property=”fb:admins” content=”500013011″/>

Most, hogy a Facebook Open Graph meta címkék a helyükön vannak, térjünk át a Twitter kártyákra.

Twitter kártyák

Láttál már ilyen tweetet?

Nos, ezek a részletes tweetek csak akkor jelennek meg, ha Twitter kártyákat használsz. Nem szeretnél ilyet az oldaladon? Segít kitűnni a tömegből.

Íme, hogyan használhatod ki a Twitter-kártyákat:

Ha a Yoast által készített SEO for WordPress bővítményt használod, csak kövesd az alábbi lépéseket. Mindenki másnak az alábbi lépéseket kell követnie.

twitter:card

Ez a meta tag leírja a megosztott tartalom típusát. A Twitter esetében három lehetőséged van: fotó (képek esetében), lejátszó (videók esetében) és összefoglaló (minden más esetében). Ha nem határozza meg a kártyát, a Twitter alapértelmezés szerint az összefoglalót fogja használni.

Példa: <meta name=”twitter:card” content=”summary”>

twitter:url

Ez az oldal, amelyet megosztasz a Twitteren. Hasonlóan ahhoz, ahogy a Facebook kéri az URL-t, a Twitter is ezt teszi, mert előfordulhat, hogy ugyanaz a tartalom többször is szerepel az oldaladon. Ez biztosítja, hogy egyetlen URL-címre kerüljön az összes tweet. Ellenkező esetben a tweetek több url-re lesznek felosztva.

Példa: <meta name=”twitter:url” content=”https://www.quicksprout.com/2013/03/21/11-creative-ways-to-build-links/”>

twitter:title

A Facebook Open Graph címéhez hasonlóan ezt sem szabad kulcsszavakkal tömni. Legyen meggyőző, hogy az emberek rá akarjanak kattintani. A Facebookhoz hasonlóan itt is 70 karakterre kell korlátozni a karakterek számát.

Példa: <meta name=”twitter:title” content=”11 kreatív módja a linképítésnek”>

twitter:description

Ez hasonló a meta description taghez, amit a Google esetében használnál. De ne tömd tele kulcsszavakkal. Az legyen a célod, hogy egy olyan meggyőző mondatot alkoss, amely arra készteti az embereket, hogy kattintsanak át a webhelyedre. A leírás 200 karakterre korlátozódik.

Példa: <meta name=”twitter:description” content=” Belefáradtál a linképítésbe a régi módszerrel? Tudod, azokat a módszereket, amelyek során e-maileket kell küldened webmesterek ezreinek, linkekért könyörögve. “>

twitter:image

Hogy a tweeted kiemelkedjen, szükséged van egy képre. A képeidnek 1 MB-nál kisebb méretűnek kell lenniük, és nem lehetnek kisebbek 60px x 60px-nél. A 120px x 120px-nél nagyobb képeket átméretezzük.

Példa: <meta name=”twitter:image” content=” https://www.quicksprout.com/wp-content/uploads/2013/03/linkbuilding.jpg”>

Miután a Twitter Card meta tageket alkalmazza webhelyén, jelentkeznie kell a Twitter Card programjára. Amint elfogadják, a webhelyed URL-címei a kártya formátumban fognak megjelenni.

Következtetés

A meta címkék nem csak a keresőmotorok számára készültek. A közösségi médiaoldalak is kihasználják őket. Ahogyan a Google rangsoroláshoz és az átkattintási arányokhoz optimalizálná a meta-tageket, ugyanezt kell tennie a Facebook és a Twitter esetében is.

Több ember fogja meglátogatni az oldalát.Több ember fogja meglátogatni az oldalát a közösségi médiából.