How Custom Favicons and OpenGraph Tags Increase Social Share Click-Throughs on Forms
How Custom Favicons and OpenGraph Tags Increase Social Share Click-Throughs on Forms
When you share your form link on LinkedIn, Twitter, Slack, or iMessage:
- What does the link preview card look like?
- Does it display your company's crisp vector logo, a compelling title, and an attractive branded banner?
- Or does it display a generic third-party vendor logo with the title: "Untitled Form - Create your own free survey"?
In modern digital communication, Link Previews are the billboard for your form.
When an executive or customer sees an unbranded, generic link preview in their Slack channel, it looks like amateur phishing spam. Click-through rates crater.
Configuring Custom Favicons and OpenGraph (OG) Metadata transforms plain URLs into authoritative, high-converting social invitation cards.
Here is how to optimize social share previews for your web forms.
Anatomy of a Perfect OpenGraph Preview Card
┌────────────────────────────────────────────────────────┐
│ [ Custom High-Resolution 1200x630 OG Image Banner ] │
│ - Company Logo, Crisp Typography, Generative Texture │
├────────────────────────────────────────────────────────┤
│ forms.yourcompany.com │
│ 2026 State of Engineering Productivity Survey │
│ Share 2 minutes of feedback to unlock benchmark data. │
└────────────────────────────────────────────────────────┘
The Essential OpenGraph Meta Tags
When sharing links on modern platforms, social crawlers inspect specific HTML meta tags:
<!-- Essential OpenGraph Metadata -->
<title>Request an Enterprise Demo | InfiForm</title>
<meta name="description" content="Schedule a 20-minute architecture review with our team.">
<!-- OpenGraph / Facebook / LinkedIn -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://forms.yourbrand.com/f/demo">
<meta property="og:title" content="Request an Enterprise Architecture Review">
<meta property="og:description" content="Schedule a 20-minute technical session with our lead engineers.">
<meta property="og:image" content="https://forms.yourbrand.com/images/og-demo.png">
<!-- Twitter Cards -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Request an Enterprise Architecture Review">
<meta name="twitter:image" content="https://forms.yourbrand.com/images/og-demo.png">
3 Rules for High-Converting OG Images
- Optimal Dimensions (1200 x 630 Pixels): At a standard 1.91:1 aspect ratio, the image renders crisply across LinkedIn, Slack, Facebook, and X.
- High-Contrast Text Overlay: Keep critical text centered within the "safe zone" (middle 80% of the canvas) so mobile social apps don't crop the edges.
- Custom Favicon (
favicon.ico&apple-touch-icon): Ensure the browser tab displays your company's crisp logo mark rather than a vendor icon.
Modern White-Label Form Platforms
Platforms like InfiForm allow you to customize social previews directly in your visual settings:
- Upload custom OG social share images.
- Set bespoke page titles and meta descriptions.
- Inherit custom favicons automatically from your custom CNAME domain.
Turn your form links into authoritative, clickable brand assets across every channel.