Yleisiä virheitä Open Graph-tunnisteilla
Tarkista OG-tageissasi virheitä
Käytä Proovd — liitä URL-osoite ja katso heti, miltä se näyttää kohdissa X, LinkedIn, Slack, Discord, WhatsApp ja Reddit.
Pikavastaus
- Suhteellisten URL-osoitteiden käyttäminen kohteelle
og:image– alustat eivät voi noutaa niitä - Puuttuva
twitter:card- X ei renderöi korttiasi - Kuva on liian pieni alustalle — LinkedIn tarvitsee vähintään 1200×627
- Välimuistia ei tyhjennetä päivitysten jälkeen – alustat tallentavat OG-tageja välimuistiin päivien ajan
Virhe 1: Suhteellisten URL-osoitteiden käyttäminen kohteelle og:image
Tämä on yleisin yksittäinen virhe. Kehittäjät kirjoittavat:
✗ Väärin
<meta property="og:image" content="/images/preview.jpg" />
Alustaen indeksointirobotit eivät voi ratkaista suhteellisia URL-osoitteita. He tarvitsevat absoluuttisen URL-osoitteen:
✓ oikein
<meta property="og:image" content="https://yoursite.com/images/preview.jpg" />
Käytä aina https:// URL-osoitteessasi og:image. Tämä vaikuttaa kaikkiin alustoihin – X, LinkedIn, Discord, Slack, WhatsApp ja Reddit.
Virhe 2: Tunniste twitter:card puuttuu
Monet kehittäjät asettavat vain Open Graph-tunnisteita ja ohittavat Twitter Card-tunnisteet. X/Twitter suosii numeroa twitter:card, eikä se välttämättä renderöi korttiasi oikein ilman sitä.
✗ Epätäydellinen
<meta property="og:image" content="https://yoursite.com/image.jpg" />
✓ Valmis
<meta property="og:image" content="https://yoursite.com/image.jpg" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image" content="https://yoursite.com/image.jpg" />
Aseta sekä og:image että twitter:image saadaksesi täyden peiton. Katso lisätietoja oppaastamme Open Graph vs Twitter Card.
Virhe 3: Kuva on liian pieni alustalle
Jokaisella alustalla on erilainen vähimmäiskuvakoko. Kuva, joka toimii koolla Discord (vähintään 300×300), ei välttämättä toimi koolla LinkedIn (vähintään 1200×627).
| Platform | Minimum | Recommended |
|---|---|---|
| X / Twitter | 800 × 418 | 1200 × 628 |
| 1200 × 627 | 1200 × 627 | |
| Discord | 300 × 300 | 1200 × 630 |
| 300 × 157 | 1200 × 630 | |
| 120 × 120 | 1200 × 628 |
1200 × 630 käyttäminen vakiokokona kattaa kaikki alustat. Katso täydellinen erittely Open Graph Kuvakokooppaastamme.
Virhe 4: Välimuistia ei tyhjennetä päivitysten jälkeen
Päivität OG-tagisi. Alustat näyttävät edelleen vanhan esikatselun. Ongelma: alustat tallentavat OG-tunnisteet välimuistiin eivätkä nouta niitä automaattisesti.
Kun olet päivittänyt tunnisteet, sinun on tyhjennettävä kunkin alustan välimuisti:
- Facebook: Sharing Debugger → "Raaputa uudelleen"
- LinkedIn: Post Inspector → "Tarkista"
- X/Twitter: Card Validator → "Esikatselukortti"
- Discord/Slack: Poista vanha viesti, lähetä URL-osoite uudelleen
- WhatsApp: Lisää
?v=2kyselyparametri
Katso oppaastamme Kuinka tyhjentää Open Graph Välimuisti saadaksesi täydellisen alustakohtaisen esittelyn.
Virhe 5: Puuttuva og:description tai katkaistu teksti
Jotkut kehittäjät asettavat arvot og:title ja og:image, mutta ohittavat og:description. Toiset kirjoittavat kuvauksia, jotka ovat liian pitkiä ja lyhennettyinä.
Parhaat käytännöt:
- og:title: 50-60 merkkiä (sama kuin SEO otsikkotunniste)
- og:description: 150–160 merkkiä (sama kuin metakuvauksessa)
- Aseta tärkeimmät tiedot ensin – alustat katkaistaan eri kohdissa
Virhe 6: Ei asetusta og:url
Ilman arvoa og:url alustat voivat käyttää väärää URL-osoitetta esikatselussa (esim. URL-osoite seurantaparametreineen). Aseta aina ensisijainen URL-osoite:
✓ oikein
<meta property="og:url" content="https://yoursite.com/your-page" />
Virhe 7: Väärän kuvan MIME-tyypin käyttäminen
Jos palvelimesi palauttaa kuvallesi väärän Content-Type-otsikon (esim. PNG-muodossa image/jpeg), jotkin alustat hylkäävät sen. Varmista, että kuvapalvelimesi palauttaa oikean MIME-tyypin:
- JPG/JPEG →
image/jpeg - PNG →
image/png - WebP →
image/webp - GIF →
image/gif
LinkedIn on erityisen tiukka MIME-tyypin validoinnissa.
Virhe 8: Dynaamiset sivut ilman ainutlaatuisia OG-tunnisteita
Jos sinulla on SPA tai dynaaminen sivusto, jossa jokaisella sivulla on samat OG-tunnisteet (yleensä etusivun tagit), alustat näyttävät saman esikatselun jokaiselle sivulle. Jokainen sivu tarvitsee oman ainutlaatuisen otsikon, kuvauksen ja kuvan.
Käytä kohdassa Next.js generateMetadata(). Käytä kohdassa WordPress Yoast/RankMath-sivukohtaisia asetuksia. Aseta tunnisteet yksitellen jokaiselle sivulle tavallisessa HTML-koodissa.
Pikakorjauksen tarkistuslista
- Käytä absoluuttisia URL-osoitteita (https://...) kaikille og:image poluille
- Aseta sekä
og:- ettätwitter:-tunnisteet - Käytä 1200 × 630 pikselin kuvia yleisen yhteensopivuuden saavuttamiseksi
- Tyhjennä alustan välimuistit tunnisteiden päivittämisen jälkeen
- Aseta yksilölliset OG-tunnisteet jokaiselle sivulle
- Sisällytä og:description (150-160 merkkiä)
- Aseta og:url ensisijaiseksi URL-osoitteeksi
- Varmista, että MIME-tyyppi vastaa todellista kuvamuotoa
- Testaa Proovd saadaksesi kaikki virheet kerralla kiinni
Usein kysytyt kysymykset
Mikä on yleisin Open Graph-virhe?
Suhteellisen URL-osoitteen käyttäminen numerolle og:image absoluuttisen URL-osoitteen sijaan, joka alkaa numerolla https://. Alustat eivät voi noutaa suhteellisia URL-osoitteita, joten kuva ei koskaan näy esikatselussa.
Miksi OG-kuvani toimii yhdellä alustalla mutta ei toisella?
Jokaisella alustalla on erilaiset kuvakokovaatimukset. LinkedIn vaatii vähintään 1200x627, X vaatii 800x418 ja Discord hyväksyy vähintään 300x300. Yhdellä alustalla toimiva kuva voi olla liian pieni toiselle.
Kuinka tarkistan, onko OG-tunnisteissani virheitä?
Käytä Proovd minkä tahansa URL-osoitteen liittämiseen ja katso tarkalleen, kuinka se hahmonnetaan kaikilla kuudella alustalla kerralla.
Aiheeseen liittyvät artikkelit
Tarkista OG-tageissasi virheitä
Käytä Proovd — liitä URL-osoite ja katso esikatselu kohdissa X, LinkedIn, Slack, Discord, WhatsApp ja Reddit.