Siirry blogiinTakaisin blogiin

Social Media Meta Tags: Kattava opas | Kontentino

Kinga Edwards
Kirjoittanut
Kinga Edwards
Sisältö
Verkkosisällön jakaminen FacebookissaHTML-koodin metatagien ymmärtäminenHakukoneille tarkoitetut meta-ominaisuudetTwitter-metatagitog:titleog:imageog:urlog:descriptionTwitter-metatagitFacebook-metatagien muokkaaminenYleisiä harhaluuloja metatageistaMyytti 1: Metatagit ovat vain SEO-tarkoituksiin.Myytti 2: Kaikki kuvat näkyvät automaattisesti täydellisesti.Myytti 3: Metatagit ovat vaikeita toteuttaa ilman koodausosaamista.YhteenvetoUKKMikä on social media meta tag?Mikä on Facebook-metatagi?

Oletko koskaan miettinyt, miksi Facebookissa tai Twitterissä jakamasi linkit näyttävät välillä omituisilta? Tiedätkö, miten voit vaikuttaa siihen, miltä jaetut blogipostaukset näyttävät sosiaalisessa mediassa?

Jos et ole varma, oletko tehnyt kaikkesi optimoidaksesi Facebookissa ja Twitterissä näkyvät tiedot, lue eteenpäin. Näytämme, kuinka oikeiden social media tagien käyttö auttaa parantamaan postaustesi esikatselun ulkoasua.

Kun jaat artikkelilinkin, haluat postauksen näyttävän hyvältä. Haluat, että siinä on laadukas kuva, oikea otsikko, kuvaus ja URL-osoite. Facebook, Twitter ja muut alustat hakevat nämä tiedot suoraan verkkosivustoltasi.

Voit hallita tätä prosessia lisäämällä social media meta tageja (kuten open graph -tageja) sivustosi HTML-koodiin.

Jos Facebook-metatagit (= Open Graph -metatagit) ovat kunnossa, päätät itse, mitä Facebook-postauksessa näkyy. Jos et käytä näitä Open Graph (og) -ominaisuuksia, Facebook näyttää silti tietoja postauksestasi, mutta todennäköisesti tavalla, joka ei miellytä silmää. Sama pätee Twitter-metatageihin. Katsotaanpa tätä käytännössä Facebookin kautta.

Verkkosisällön jakaminen Facebookissa

Facebook on erinomainen alusta uuden sisällön jakamiseen. Uuden postauksen luominen artikkelista on niinkin yksinkertaista kuin linkin liittäminen uuteen julkaisuun.

Tarkastellaanpa prosessia. Käytämme esimerkkinä postaustamme aiheesta Facebook-markkinointistrategia.

Kun URL-osoite on lisätty, Facebook hakee tiedot osoitteesta ja luo valmiiksi muotoillun postauksen. Muotoilu näkyy heti esikatselussa – sekä työpöytä- että mobiilinäkymässä. Jos käytät Kontentinoa sosiaalisen median hallintaan, esikatselu on heti saatavilla Kontentinon content calendar -näkymässä.

social media meta tags

HTML-koodin metatagien ymmärtäminen

Hakukoneille tarkoitetut meta-ominaisuudet

Koodin yläosassa näemme ominaisuuksia, jotka määrittelevät artikkelin parametrit – näitä kutsutaan metatageiksi. Hakukoneet käyttävät niitä ymmärtääkseen verkkosivun sisältöä sellaisten tietojen avulla, jotka eivät näy suoraan sivulla. Näitä ovat esimerkiksi:

  • Meta title – <title>
  • Meta description – meta name=”description”
  • Robots – meta name=”robots”

Alla oleva kuva näyttää HTML-koodin tälle Kontentinon postaukselle. Näet nämä metatagit vihreällä merkittyinä.

Metatagien tunnistaminen postauksen HTML-koodista: Facebook Ads Target Audiences 101: The Ultimate Guide

Vinkki: Etkö ole varma, miten saat HTML-koodin näkyviin? Paina CTRL+U Windowsilla tai Option + Command + U Macilla.

Näiden metatagien ansiosta hakukoneet tietävät, että sivun indeksointi on sallittu (dofollow). Meta titleä ja meta descriptionia käytetään, kun postaus näytetään hakutuloksissa (SERP). Kuten näette, tässä esimerkissä ne on asetettu seuraavasti:

  • Meta title: ‘Facebook Ads Target Audiences 101: The Ultimate Guide | Kontentino Blog – Simplifying Social Media Approval Workflow’
  • Meta description: ‘Find out how to reach the right people with Facebook Ads target audiences.’

Nämä metatagit eivät ehkä ole pituudeltaan optimaalisia, mutta nyt ei ole kyse SEO-optimoinnista tai Googlesta. Siirrytään suoraan metatageihin, jotka sisältävät tekstin ‘og:’.

Näitä kutsutaan sosiaalisen median metatageiksi tai yksinkertaisesti og-metatageiksi.

Esimerkissämme koodista löytyy 7 erilaista og-ominaisuutta:

  1. og: locale
  2. og: type
  3. og: title
  4. og: description
  5. og: url
  6. og: site_name
  7. og: image

Lisäksi Facebook-metatageihin liittyy og:image-tagiin kytkettyjä ominaisuuksia:

  • og:image:width
  • og:image:height
  • og:image:alt
  • og:image:type

Twitter-metatagit

Näiden lisäksi koodista löytyy usein erityisiä Twitter-metatageja, kuten:

  • meta name=”twitter:card”
  • meta name=”twitter:title”
  • meta name=”twitter:description”
  • meta name=”twitter:site”
  • meta name=”twitter:image”

Palataan Facebook-esimerkkiin. Meidän on ymmärrettävä ja muokattava ‘og:’-ominaisuuksia vaikuttaaksemme siihen, miltä upotettu linkki näyttää.

Lue lisää: i) og:-metatagien avaaminen; ii) ohjeet sisältöjen kirjoittamiseen; ja iii) metatagien muokkaaminen CMS-järjestelmässä.

Facebook- ja Twitter-julkaisut Kontentinolla

Rekisteröidy 14 päivän kokeiluun ja ota sosiaalisen median metatagit haltuun. Näet postauksen esikatselun Kontentinossa ennen julkaisua.

‘og:’ tarkoittaa Open Graph -protokollaa. Sen avulla voit kertoa Facebookille, miten jakamasi sisältö tulisi näyttää. Kuten Facebook toteaa ohjeissaan, ‘ilman näitä tageja Facebookin hiipijä (crawler) tekee parhaan arvauksensa otsikosta, kuvauksesta ja kuvasta’. Määrittelemällä nämä itse varmistat postausten laadun.

Nämä tagit ovat erittäin tärkeitä. Vaikka ne saattavat kuulostaa uusilta, Facebook julkaisi ne jo vuonna 2010. Nykyään protokollaa hallinnoi Open Web Foundation.

Menemättä liian syvälle teknisiin yksityiskohtiin, tarkastellaan neljää tärkeintä tagia, jotka vastaavat Facebookin ulkoasusta: og:title, og:image, og:url ja og:description.

og:title

Tämä on yksi perusmäärityksistä. Se asettaa objektin (tässä tapauksessa blogipostauksen) otsikon sellaisena kuin se halutaan näyttää sosiaalisessa mediassa. Facebook hakee tämän ja näyttää sen linkin otsikkona.

og:image

Tähän lisätään kuvan URL-osoite. Määrittämällä og:image-tagin varmistat, että juuri haluamasi kuva näkyy Facebookissa. Muussa tapauksessa Facebook saattaa valita satunnaisen kuvan artikkelistasi tai sivupalkista.

og:url

Sisältää sivun kanonisen URL-osoitteen, jota käytetään sen pysyvänä tunnisteena. Esimerkissämme osoite on https://www.kontentino.com/blog/facebook-ads-target-audiences/.

og:description

Tämä tagi auttaa määrittämään kuvauksen, joka näkyy linkin alla. Esimerkissämme se on: ‘Find out how to reach the right people with Facebook Ads target audiences.’

Twitter-metatagit

Nämä toimivat vastaavasti kuin Open Graph -tagit ja määrittävät sisällön, jonka Twitter hakee verkkosivua jaettaessa.

og-metatagien hallinta

Sekä Facebook että Twitter tarjoavat ohjeita näiden tagien hyödyntämiseen. On aika katsoa, miten niitä muokataan CMS-järjestelmässä (sisällönhallintajärjestelmässä). Käytämme esimerkkinä WordPressiä, joka on maailman suosituin alusta.

Jos käytössäsi on SEO-lisäosa, kuten Yoast SEO, Rank Math tai All in One SEO, niiden avulla muokkaaminen on helppoa. Useimmat hyvät lisäosat sallivat Facebook- ja Twitter-tagien muokkaamisen erikseen. Näytämme, miten se tehdään Rank Mathilla.

Valitse postauksen muokkaustilassa SEO-välilehti ja sen alta ‘social’.

Social media -metatagien löytäminen CMS-järjestelmästä.

Rank Math sisältää live-esikatselun. Klikkaa ‘Preview & Edit Social Media’ -painiketta nähdäksesi miltä muutos näyttää.

Facebook-metatagien muokkaaminen

Ensin näet esikatselun ja sen alla säädettävät metatagit.

CMS-järjestelmän luoma esikatselu postauksen jaosta.

Jos og:image, og:title tai og:description ei ole määritelty, simulaattori näyttää hakukoneille tarkoitetut perustiedot.

Social media -metatagien muokkaaminen: og:title- ja og:description-tagien asettaminen.

Kun olet tallentanut muutokset, on aika tarkistaa miltä postaus näyttää Facebookissa.

Uudet täytetyt metatagit.

Muita ratkaisuja metatagien hallintaan WordPressissä ovat erilliset Open Graph -lisäosat (kuten OG) tai koodin lisääminen manuaalisesti. WIXissä ja muissa suurissa järjestelmissä on omat sisäänrakennetut ratkaisunsa social media -metatageille.

Kun olet valmis, voit testata linkkiä Facebook Debugger -työkalulla. Muista tyhjentää välimuisti ennen testaamista!

Open Graph -tagit Facebook Sharing Debuggerissa.

Linkin esikatselu Facebookin työkalussa näyttää metatagit toiminnassa.

Yleisiä harhaluuloja metatageista

Myytti 1: Metatagit ovat vain SEO-tarkoituksiin.

Metatagit eivät ole vain hakukoneita varten – niillä on kriittinen rooli siinä, miten sisältösi näkyy sosiaalisissa verkostoissa. Esimerkiksi og:image ja og:title optimoivat postaukset suoraan Facebookiin ja Twitteriin, mikä parantaa engagementia.

Myytti 2: Kaikki kuvat näkyvät automaattisesti täydellisesti.

Ilman og:image-määritelmää tai Twitter-korttia alustat saattavat valita väärän kuvan tai muotoilla sen huonosti, mikä heikentää postauksen ulkoasua.

Myytti 3: Metatagit ovat vaikeita toteuttaa ilman koodausosaamista.

WordPress-lisäosat, kuten Rank Math, tekevät prosessista helppoa. Sinun ei tarvitse olla kehittäjä varmistaaksesi, että postauksesi ovat optimoituja.

Yhteenveto

Toivottavasti tämä opas auttoi ymmärtämään og-metatageja ja niiden merkitystä. Jos haluat virtaviivaistaa sosiaalisen median markkinointiasi, kokeile Kontentinoa. Se on helppokäyttöinen työkalu, joka tukee tiimiyhteistyötä ja hyväksyntäketjuja.

Content calendar -näkymämme sisältää integroidun esikatselun, joten säästät aikaa ja näet heti, miltä linkkipostauksesi näyttävät ilman ulkoisia työkaluja.

UKK

Mikä on social media meta tag?

Se tarjoaa tärkeitä tietoja, kuten otsikon, kuvan ja kuvauksen, jotta sosiaalisen median alustat osaavat näyttää jaetun verkkosivun oikein.

Mikä on Facebook-metatagi?

Esimerkiksi meta property=”og:title” on osa Open Graph -protokollaa. Se määrittää, miltä sivusi tai postauksesi näyttää Facebookissa.

Kontentino social management tool

1,2M+ ajastettua postausta viimeisen
vuoden aikana käyttäjiltä, joilla on samanlaiset tarpeet kuin sinulla.