Provide an image for WhatsApp link sharing
Bubble up your WhatsApp link sharing using Open Graph (og:image) tags. Embed <meta property="og:image" content="IMAGE_URL"/> inside the HTML <head>, using an absolute URL in lieu of IMAGE_URL.
Yes, your image needs to be publicly accessible and referred to by its absolute URL. Why? Because WhatsApp can fetch it only then.
Perfecting the image and meta tags
Don't just share links, share optimized experiences.
When preparing the image:
- Dimensions: A suggestion - opt for about 600x600px for better visibility.
- Weight: Stay below 300KB for optimal loading time.
- Format: Stick to
.pngor.jpg. Don't forget to compress them (Hello, TinyPNG!).
Meta tags are key. Each element matters:
- og:title: Limit it to 35 characters. Keep it short and sweet.
- og:description: 155 characters max. Keep it clear and compelling.
Remember, always use complete URLs for og:image and check them with tools like the Facebook Sharing Debugger.
SEO best practices
The meta universe extends beyond WhatsApp.
Whenever you touch meta tags, keep your eyes locked on SEO:
- Deploy Schema.org tags for better SEO ranking.
- Invent SEO-friendly title tags less than 65 characters long.
- Create a Favicon exactly 32x32px for browser convenience.
Make sharing easy and reliable
- Add a WhatsApp sharing link for seamless sharing.
- Harness the power of validation tools like Open Graph Debugger.
- Revisit the best practices of Twitter and Facebook. They have some good lessons that can be applicable here too.
Sharing your image? Here are the best practices
Size and quality
Compress without compromising quality. Use high-resolution images but stay within web-friendly sizes.
Proper metadata
Make sure og:image is a true reflection of your content. Craft og:title and og:description to be enticing and concise.
Pre-flight checklist
Before you launch, test everything using tools like WhatsApp's Click to Chat.
Gotchas! Things to avoid
Relativity is not king here
When creating og:image, use absolute image paths. Avoid the relatives. They can lead to fetching errors on WhatsApp.
Size does matter
Avoid images over 300KB. They are slow to share, slow to load.
Meta doesn't mean optional
og:title, og:description, or og:image are not merely cosmetic. Each plays a crucial role in your link's click-through rate.
Was this article helpful?