Utilia

Open Graph -generaattori

Luo Open Graph- ja X (Twitter) -korttitagit ja näe esikatselusta, miltä linkkisi näyttää jaettuna Facebookissa, LinkedInissä ja X:ssä.

Esikatselukuva

Esikatselu

Facebook, LinkedIn ja suuri X-kortti
Ei esikatselukuvaa
Pieni X-kortti
Ei esikatselukuvaa

Likimääräiset esikatselut: jokainen palvelu rajaa kuvan ja lyhentää tekstiä hieman eri tavalla.

Tarkistukset

Näin käytät Open Graph -generaattoria

  1. Kirjoita Otsikko ja Kuvaus, jotka haluat ihmisten näkevän, kun linkkiäsi jaetaan. Ne voivat poiketa SEO-otsikostasi: kirjoita ne sosiaalisen median syötettä varten.
  2. Lisää Sivun URL (ensisijainen osoite) ja Kuvan URL. Molempien on oltava absoluuttisia ja alettava https://.
  3. Kuvaile kuva kohdassa Kuvan kuvaus (alt-teksti), jotta ruudunlukuohjelmia käyttävät tietävät, mitä se esittää.
  4. Valitse tai pudota sama kuva kohtaan Esikatselukuva. Se pysyy laitteellasi: työkalu käyttää sitä vain esikatselujen piirtämiseen sekä kenttien Kuvan leveys (px) ja Kuvan korkeus (px) täyttämiseen.
  5. Aseta Sivuston nimi, Sisältötyyppi ja Kieli ja alue (locale), valitse sitten X-kortti (Twitter) -tyyli ja, jos sinulla on ne, sivuston ja tekijän X-tilit.
  6. Tarkista esikatselut ja Tarkistukset-lista, sitten Kopioi tai Lataa tagit ja liitä ne sivun <head>-osan sisään.

Mitä Open Graph -tagit tekevät

Kun linkki liitetään Facebookiin, LinkedIniin, X:ään, Slackiin, Discordiin, WhatsAppiin, iMessageen ja moniin muihin sovelluksiin, indeksoija hakee sivun ja lukee sen Open Graph (og:) -meta-tagit muodostaakseen kortin: kuvan, otsikon, lyhyen kuvauksen ja verkkotunnuksen. Ilman näitä tageja sovellus arvaa, ja usein se poimii logon, evästebannerin tai valikon ensimmäisen lauseen.

Neljä perusominaisuutta ovat og:title, og:type, og:image ja og:url. Tämä työkalu lisää myös og:description, og:site_name, og:locale ja kuvan tiedot (og:image:width, og:image:height, og:image:alt). Kuvan koon ilmoittaminen antaa joidenkin palvelujen piirtää kortin jo ensimmäisellä jakokerralla sen sijaan, että odotettaisiin kuvan latautumista.

X lukee omat twitter:-tagit mutta käyttää Open Graph -otsikkoa, -kuvausta ja -kuvaa, kun X:n omat versiot puuttuvat, joten työkalu lisää vain sen, mitä X todella tarvitsee: twitter:card, valinnaiset tilit ja kuvan kuvauksen. Näin jokaista arvoa ei tarvitse kahdentaa.

Kuvakoot, jotka toimivat kaikkialla

Käyttö Suositeltu koko Huomautuksia
Suuri kortti (Facebook, LinkedIn, X:n suuri kuva) 1200 × 630 px Suhde noin 1,91:1; pidä teksti keskellä
Pieni X-kortti (summary) vähintään 144 × 144 px Näytetään neliönä, rajataan keskeltä
Facebookin vähimmäiskoko 200 × 200 px Pienemmät kuvat voidaan ohittaa

Käytä JPEG- tai PNG-tiedostoa, pidä tiedosto kohtuullisen pienenä (reilusti alle 5 Mt) äläkä sijoita tärkeää tekstiä reunojen lähelle, koska jokainen palvelu rajaa hieman eri tavalla. Tämän työkalun esikatselut ovat likimääräisiä esityksiä näistä asetteluista, eivät kuvakaappauksia.

Julkaisun jälkeen

Sosiaaliset palvelut tallentavat linkkien esikatselut välimuistiin, joskus päiväksi tai useammaksi. Kun olet muuttanut tageja, pyydä palveluja hakemaan sivu uudelleen Facebookin Sharing Debuggerilla tai LinkedInin Post Inspectorilla. Sivun on oltava julkisesti saavutettavissa: indeksoijat eivät näe kirjautumisen takana olevia sivuja tai localhost-osoitetta.

Usein kysytyt kysymykset

Parantavatko Open Graph -tagit hakukonenäkyvyyttä?

Eivät suoraan. Hakukoneet eivät käytä niitä sijoitustekijänä. Ne parantavat linkkiesi ulkoasua jaettaessa, mikä voi tuoda enemmän napsautuksia ja kävijöitä sosiaalisista verkostoista ja viestisovelluksista.

Miksi vanha kuvani näkyy yhä, kun jaan linkin?

Palvelu tallensi edellisen version välimuistiin. Hae osoite uudelleen palvelun virheenkorjaustyökalulla tai lisää kuva-URL:ään kyselymerkkijono (esimerkiksi ?v=2), jolloin sitä käsitellään uutena tiedostona.

Pitäisikö käyttää summary- vai summary_large_image-korttia?

Käytä ”Suuri kuva (summary_large_image)” -vaihtoehtoa artikkeleille, tuotteille ja laskeutumissivuille, joilla on vahva visuaalinen ilme. Käytä ”Pieni neliökuva (summary)” -vaihtoehtoa, kun kuvasi on logo tai avatar, joka näyttäisi oudolta levitettynä leveälle kortille.

Voinko käyttää suhteellista kuva-URL:ää, kuten /images/share.jpg?

Et. Indeksoijat lukevat tagit irrallaan sivun yhteydestä, joten og:image ja og:url on oltava absoluuttisia URL-osoitteita, joissa on protokolla ja verkkotunnus. Työkalu huomauttaa suhteellisista osoitteista.

Lähetetäänkö kuvani minnekään?

Ei. Esikatseluun valitsemasi kuvan lukee vain selaimesi, eikä sitä lähetetä minnekään. Tagit sisältävät vain kirjoittamasi kuva-URL:n.