Zo gebruik je deze tool
- Voer de og:title en og:description in die u op de pagina gebruikt of wilt gebruiken.
- Plak de volledige URL van de og:image. De tool laadt de afbeelding en geeft de werkelijke afmetingen in pixels weer.
- Voeg de URL of het domein van de pagina toe, vergelijk de voorbeelden van de grote en kleine kaart en verhelp eventuele waarschuwingen.
Hoe het werkt
Wanneer iemand een link deelt, halen de meeste sociale netwerken en chatapps de pagina op en lezen ze de Open Graph-tags: og:title, og:description, og:image en og:url. Op basis daarvan maken ze een kaart. Een brede afbeelding met een verhouding van ongeveer 1,91:1 levert meestal een grote kaart op met de afbeelding bovenaan. Bij een kleine of vierkante afbeelding wordt vaak een compacte kaart getoond, met een miniatuur naast de tekst.
Deze tool toont twee algemene kaartstijlen, zodat u de lengte van de tekst en de uitsnede van de afbeelding kunt beoordelen. De tool controleert de oorspronkelijke afmetingen van de afbeelding nadat de browser deze heeft geladen: bij minder dan 200 × 200 px slaan veel apps de afbeelding over, bij minder dan 600 × 315 px gebruiken ze meestal de kleine indeling, en bij een verhouding die sterk afwijkt van 1,91:1 wordt de afbeelding bijgesneden. 1200 × 630 px is de algemeen aanbevolen afmeting, omdat de afbeelding daarmee scherp blijft op schermen met een hoge pixeldichtheid.
De voorbeeldweergave kan niet precies laten zien wat een specifieke app toont. Apps verschillen in het aantal regels titel en beschrijving dat ze laten zien; sommige negeren de beschrijving. Ook bewaren de meeste apps een voorbeeldweergave na de eerste keer delen enige tijd in de cache, waardoor wijzigingen aan uw tags niet meteen zichtbaar zijn. Veel platforms bieden een eigen debugtool om die cache te vernieuwen.
Voorbeelden
Een screenshot als og:image
Een screenshot van 1440 × 900 heeft een verhouding van 1,6:1. De tool waarschuwt voor de verhouding: bij een grote kaart worden de boven- en onderkant bijgesneden. Exporteer een versie van 1200 × 630 om verrassingen te voorkomen.
Een logo als enige afbeelding
Een logo van 180 × 180 is kleiner dan 200 × 200 px, waardoor veel apps geen afbeelding tonen. Gebruik in plaats daarvan een grotere, brede banner met het logo erin.
De titellengte controleren
Een og:title van 90 tekens loopt in de voorbeeldweergave van de grote kaart door tot drie regels. Als u de titel inkort tot ongeveer 60 tekens, blijft de kaart in de meeste apps overzichtelijk.
Veelgestelde vragen
Waarom ziet mijn link er anders uit op Facebook, LinkedIn en X?
Elk platform toont kaarten met een eigen indeling, uitsnede en tekstlimieten. Sommige tonen de beschrijving, andere niet. Deze voorbeeldweergave is een algemene benadering en geen exacte kopie van het ontwerp van een platform.
Ik heb og:image gewijzigd, maar de oude afbeelding wordt nog steeds getoond. Hoe kan dat?
Platforms bewaren linkvoorbeelden in de cache. Gebruik de eigen deeldebugger van het platform om de pagina opnieuw op te halen, of wacht tot de cache verloopt. Ook helpt het om de bestandsnaam van de afbeelding te wijzigen.
Kan ik een SVG- of WebP-afbeelding gebruiken?
De meeste platforms ondersteunen SVG niet. WebP werkt in veel apps, maar niet in alle; JPG of PNG is de veiligste keuze.
Waarom kan de tool mijn afbeelding niet laden?
Voor de URL is mogelijk een login nodig, de URL verwijst misschien naar een HTML-pagina in plaats van een afbeelding, of de server blokkeert verzoeken van andere sites. Als de browser de afbeelding hier niet kan laden, kan een crawler van een sociaal platform dat waarschijnlijk ook niet.
Privacy
De tekst die u invoert, blijft in uw browser. Om de afbeelding te controleren, vraagt uw browser deze rechtstreeks op bij de ingevoerde URL (zonder een referrer mee te sturen). Die server ontvangt dus een gewoon afbeeldingsverzoek. Er wordt niets naar TIG Tools verstuurd.