Wanneer je een sociale post maakt en publiceert in HubSpot, probeert het betreffende sociale netwerk een afbeeldingsvoorbeeld voor je post te genereren. Op basis van de link die je voor de post hebt opgegeven, scant het sociale netwerk de metatags in de broncode van je pagina en crawlt het robots.txt-bestand van je website.
Als je je website host bij een externe provider zoals WordPress en het voorbeeld van je bericht verschijnt niet zoals verwacht, volg dan de onderstaande instructies.
Werk je robots.txt bij
Een robots.txt-bestand informeert zoekmachines hoe ze je website moeten indexeren. Als je je robots.txt-bestand niet correct hebt toegevoegd of geconfigureerd, kunnen sociale netwerken de inhoud van je pagina's niet lezen. Facebook en X geven beide de user agent strings die je moet toevoegen aan je robots.txt bestand:
User-agent: facebookexternalhit
Disallow:
User-agent: Twitterbot
Disallow:
LinkedIn geeft geen documentatie over hun user agent string, maar je kunt de LinkedIn post inspector gebruiken om te controleren of LinkedIn de inhoud van je website kan crawlen.
Voeg meta tags toe aan de <head> sectie van je website pagina's
Zoekmachines en sociale netwerken zullen het hoofdgedeelte van je HTML analyseren om de metadata te zoeken die nodig is om een voorvertoning van de pagina te genereren. Je moet de metagegevens voor Facebook en X opnemen na je primaire metatags:
<!-- Primary Meta Tags -->
<title>Meta Tags — Preview, Edit and Generate</title>
<meta name="title" content="Meta Tags — Preview, Edit and Generate">
<meta name="description" content="With Meta Tags you can edit and experiment with your content then preview how your webpage will look on Google, Facebook, Twitter and more!">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com">
<meta property="og:title" content="Title of your Website Page">
<meta property="og:description" content="Description of your Website Page">
<meta property="og:image" content="https://example.com/image.png">
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://example.com/">
<meta property="twitter:title" content="Title of your Website Page">
<meta property="twitter:description" content="Description of your Website Page">
<meta property="twitter:image" content="https://example.com/image.png">
Vul de inhoudsattributen voor elk van de bovenstaande metatags in met de overeenkomstige waarden voor je pagina. Je kunt je metatags valideren met de Facebook debugger tool, X card validator en LinkedIn post inspector.
Vereisten voor de grootte van uitgelichte afbeeldingen
Als de uitgelichte afbeelding voor een link die je hebt ingevoegd niet correct wordt weergegeven in je sociale voorvertoning (de afbeelding is bijvoorbeeld afgesneden of de verhouding is onjuist), moet je de afbeelding mogelijk bewerken zodat deze de juiste afmetingen heeft voor het sociale netwerk waarop je post en vervolgens de pagina opnieuw publiceren. Als je een bericht op Facebook plaatst, kun je meer te weten komen over hun vereisten voor uitgelichte afbeeldingen in hun documentatie.
De volgende afmetingen worden aanbevolen voor het optimaliseren van uitgelichte afbeeldingen op elk netwerk:
- Facebook: 1.91:1
- X: 16:9 voor fotoposts en 1.91:1 voor uitgelichte afbeeldingen in linkposts
- Instagram (vierkant): 1:1
- Instagram (staand): 4:5
- Instagram (liggend): 1.91:1
- LinkedIn (liggend): 1.91:1
Zorg ervoor dat alle media die je toevoegt aan je sociale berichten de richtlijnen voor bestandsgrootte voor elk netwerk volgen. Als HubSpot bepaalt dat een bestand te groot is om op een bepaald netwerk te posten, wordt er een waarschuwing weergegeven. De maximale bestandsgroottes voor elk sociaal netwerk staan hieronder vermeld:
- Facebook: 8MB (minder dan 1MB aanbevolen voor PNG-bestanden om pixelvorming te voorkomen)
- Instagram: 8MB
- X: 5MB (15MB voor GIF's)
- LinkedIn: 10MB
Kleur- en helderheidsverschillen in afbeeldingen
Verschillen in afbeeldingskleur
Ingesloten kleurprofielen kunnen invloed hebben op de weergave van je uitgelichte afbeelding in je sociale bericht. Verschillende systemen verwerken ongewone kleurprofielen op verschillende manieren, daarom kunnen de kleuren er anders uitzien als je de afbeelding bekijkt in je bestandsbeheer. Je kunt de URL van je afbeelding door een extern hulpprogramma halen om te zien of deze een ongewoon kleurprofiel gebruikt. Indien nodig kun je het storende kleurprofiel verwijderen in een fotobewerkingsprogramma zoals Photoshop en vervolgens de pagina opnieuw publiceren voordat je de sociale berichten publiceert.
Verschillen in helderheid van afbeeldingen
De bestandsbeheerder van HubSpot maakt gebruik van afbeeldingscompressie op JPEG's en PNG's om de laadsnelheid van je HubSpot gehoste inhoud te optimaliseren. Sociale medianetwerken gebruiken ook beeldcompressie in berichten, waardoor de kwaliteit kan afwijken van wat je ziet in HubSpot. Om deze reden wordt het aanbevolen om afbeeldingen met een relatief hoge resolutie (in de aanbevolen beeldverhouding) te gebruiken voor elk netwerk. Als je afbeelding niet voldoet aan de vereisten van een sociaal netwerk, wordt er een waarschuwing weergegeven in HubSpot's tool voor sociale publicaties om je te helpen je afbeelding dienovereenkomstig aan te passen.
Als je nog steeds problemen ondervindt met je linkvoorvertoningen die niet goed worden weergegeven, bekijk dan onze probleemoplossingsgids.
Marketing Hub
Professional
,
Enterprise
