Recommended Free Tools
To create a website thumbnail link preview, publish a stable share image and describe it with Open Graph metadata in the page’s initial HTML. Make sure crawlers can fetch both the page and image, then run the exact URL through each platform’s debugger or inspector. The platform—not your browser favicon—chooses the final crop, cache and presentation.
What creates a thumbnail link preview
When somebody pastes a URL into a social network or messaging service, its crawler requests the page and looks for metadata. The preview image is normally selected from og:image; it is not taken from the browser favicon. The crawler also reads the title, description, canonical URL and image details before the platform stores its own preview.
The Open Graph Protocol defines four required properties for every page: og:title, og:type, og:image and og:url. In practice, add og:description and og:image:alt as well. These tags belong inside the served HTML <head>, not only in a client-side component that appears after JavaScript runs.
1. Design a dedicated share image
Choose a safe composition
Create an image for sharing rather than reusing a tiny logo, favicon or arbitrary article photo. Put the headline, logo and other essential details in a central safe area. Networks can crop a landscape image, reduce it to a card or display only a thumbnail, so text close to an edge may disappear.
#1 Best Overall
- Use a clear subject and strong contrast at small sizes.
- Keep important text short enough to remain readable on a phone.
- Export a web-friendly JPEG, PNG or WebP and check the actual byte size.
- Use a permanent, publicly reachable URL such as
https://example.com/images/article-share.jpg.
Account for different network rules
There is no single proven size that renders identically everywhere. LinkedIn’s sharing-module guidance specifies a minimum of 1200 × 627 pixels, recommends a 1.91:1 ratio and sets a 5 MB maximum. It says images less than 401 pixels wide display as thumbnails, and warns that square or vertical images can be cropped when shared organically.
HubSpot’s June 20, 2026 documentation lists 1.91:1 as the recommended ratio for Facebook, X link featured images and LinkedIn landscape images. Its own social-publishing limits list 8 MB for Facebook, 5 MB for X (15 MB for GIFs) and 10 MB for LinkedIn. Those are HubSpot’s documented recommendations and posting limits in its publishing context, not a universal crawler specification. Verify the current rules for every destination you support.
| Destination or source | Documented guidance | How to use it |
|---|---|---|
| LinkedIn sharing module | Minimum 1200 × 627 px; recommended 1.91:1; maximum 5 MB | Design at least this large, keep the subject central and validate the exact URL. |
| LinkedIn narrow images | Less than 401 px wide displays as a thumbnail | Do not rely on a small source image for a large card. |
| HubSpot recommendations | 1.91:1 for Facebook, X link images and LinkedIn landscape | Treat as a cross-platform starting point, not a guarantee. |
| HubSpot publishing limits | Facebook 8 MB; X 5 MB (15 MB GIF); LinkedIn 10 MB | These limits apply to HubSpot’s publishing context and may not equal crawler limits. |
2. Add Open Graph metadata
Put one accurate set of tags in the page’s initial <head>. Use the canonical page URL for og:url, an absolute HTTPS image URL for og:image, and a description that matches the page. Optional dimensions and MIME type help consumers process the image.
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com/page">
<meta property="og:title" content="Page title">
<meta property="og:description" content="A short description of the page.">
<meta property="og:image" content="https://example.com/images/page-share.jpg">
<meta property="og:image:alt" content="Description of the share image">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta name="twitter:card" content="summary_large_image">Set values per page
Generate a unique title, description, URL and image for each important page. Keep tags unique; duplicate or conflicting values make the selected preview unpredictable. The twitter:card line is a platform-specific addition shown in HubSpot’s example. It does not establish that every current X surface will use the image in exactly the same way.
Do these 3 things before closing this tab:
1Scan for outdated or missing drivers - takes under a minute2Clear out junk files and repair common Windows errors3Fix the driver behind crashes, sound loss and screen glitchesFramework and CMS checks
After deployment, use “view source” or fetch the raw response rather than relying only on a browser’s live DOM inspector. Server-rendered templates should emit the tags immediately. If your framework inserts metadata only after hydration, configure server-side rendering or an equivalent head-management feature so a crawler receives the tags in the first response.
3. Make the page and image crawlable
A perfect tag cannot produce a preview if the crawler cannot retrieve it. Check both the HTML response and the image response without logging in.
- Use an absolute
og:imageURL that returns the intended file, not a redirect to a login page. - Review
robots.txt, web-application-firewall rules and bot challenges. Do not deny the social crawler that must read the page. - Remove hotlink protection that blocks requests lacking a browser referrer.
- Return a successful HTTP response with the correct
Content-Type, such asimage/jpegorimage/png. - Ensure TLS certificates, DNS and redirects work for an unauthenticated request.
- Check that the image is not generated only after a user session or browser-side script.
HubSpot’s guidance notes that social networks scan page metadata and robots.txt, and gives crawler user-agent examples. Security rules should allow the relevant network bots while continuing to protect private application areas.
4. Publish, inspect and refresh
- Deploy the page, image and metadata together.
- Open the public URL in a normal browser and confirm the page is the intended canonical page.
- Inspect the served source and confirm there is one complete set of Open Graph tags.
- Request the image URL directly and check its status, content type, dimensions and file size.
- Paste the exact URL into the destination’s validator. Open Graph identifies the Facebook Object Debugger as its official parser/debugger; HubSpot also identifies Facebook’s debugger, X card validation and LinkedIn Post Inspector.
- Correct any reported field, publish again and rerun the inspection.
A debugger shows what a crawler fetched; it cannot guarantee the final card. Each platform controls its own crop, compression and cache. The reviewed documentation does not establish a universal cache lifetime, so do not promise that a changed image will appear after a fixed number of minutes. Where a platform offers a fresh-inspection action, use it after publishing an update.
Quick wins for a faster PC:
Repair Windows errors before they cause bigger problemsFix Now →Scan for outdated or missing drivers - takes under a minuteDriver Scan →5. Diagnose a missing or wrong thumbnail
The preview uses an old image
Most often, the platform has a cached copy of the URL. Confirm that the live page now returns the new og:image, then run the platform’s debugger or inspector again and request a refresh if that option exists. Avoid changing URLs repeatedly unless you have a deliberate versioning strategy.
No image appears
Check that og:image is absolute, publicly accessible and unique. Request it without cookies, follow redirects, and verify that a firewall, authentication layer, robots.txt rule or hotlink check is not denying the crawler.
The title or description is wrong
Look for duplicate tags, stale server output or a template that emits metadata only after JavaScript executes. Check the raw response received by a bot, then remove conflicting values and republish.
The image is cropped badly
Compare the source ratio with the destination’s guidance. Keep key content in the center, provide a landscape master around 1.91:1 when it suits your destinations, and test the exact URL on each network rather than assuming one crop will fit all.
The image is blurry or colors changed
Confirm the source dimensions and export quality. HubSpot notes that platform compression and embedded color profiles can alter sharpness and color. Use a standard web color workflow, then inspect the resulting card rather than judging only the original file.
A crawler receives a block page or timeout
Review bot protection, rate limits, DNS, TLS, redirects and server response time. A browser that succeeds with cookies or JavaScript enabled does not prove that an unauthenticated crawler request will succeed.
6. Reliability, performance and maintenance
Keep metadata deterministic
Generate the same tags for every request to a URL unless you intentionally publish a new version. Stable image URLs make cache behavior easier to reason about. If you change the artwork, update the validator and retain the old file until the principal platforms have had an opportunity to fetch the replacement.
Optimize without hiding information
Use dimensions large enough for your destinations, then compress the file to stay below the strictest limit that applies to your workflow. Do not remove the subject or text merely to save a few kilobytes. Validate the delivered file, not just the source file on your design computer.
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
Monitor the whole path
Include a deployment check that requests the HTML and og:image URL, verifies a successful status and confirms that required tags are present. Recheck after CMS, CDN, firewall or template changes; any of those can silently remove metadata or block crawlers.
Or skip the browser setup
If you need a screenshot of a page for a preview workflow, documentation, testing or an automated publishing pipeline, ScreenshotNeo provides a website screenshot API and MCP server. One GET request returns a PNG, JPEG, WebP or PDF. Before capture, it can accept cookie or consent banners and remove more than 60 known consent platforms, newsletter popups and chat widgets; each cleanup step can be disabled. Only clean shots are billed: bot checks or CAPTCHAs, blank pages, timeouts, failed loads and cache hits cost nothing, and the response reports the result in X-Page-Verdict and X-Billed headers.
One-call examples
See the ScreenshotNeo documentation for parameter details. Replace the example URL with the page you want to capture.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webpimport requests
r = requests.get("https://api.screenshotneo.com/v1/shot", params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"}, timeout=90)
open("shot.webp", "wb").write(r.content)const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);Options for preview pipelines
ScreenshotNeo supports full-page captures with lazy images loaded, a single element selected by CSS selector, dark mode, 12 device presets or any custom viewport, retina scale, PDF paper size, margins, landscape mode and page ranges, HTML/CSS-to-image, custom CSS and JavaScript, clicking an element before capture, hiding selectors, and waits for a selector, delay or network idle.
You can also block ads, trackers, selected requests or resource types; send custom headers, cookies, a user agent or Authorization; set timezone and geolocation; use a transparent background; resize images; cache with a TTL you choose; create signed links for public <img> tags; submit asynchronous jobs with signed webhooks; capture up to 100 URLs per bulk call; query a usage API; and use the OpenAPI specification. Parameter names used by other screenshot APIs also work, which can simplify migration.
Best Value
AI-agent and pricing details
The MCP server exposes take_screenshot, get_page_info and capture_pdf for Claude, Cursor and other MCP clients. Every feature is included on every plan. Yearly billing provides two months free.
| Plan | Allowance and price |
|---|---|
| Free | 1,000 shots per month; no card required |
| Starter | $5 for 3,000 shots |
| Growth | $15 for 15,000 shots |
| Pro | $39 for 60,000 shots |
| Scale | $99 for 250,000 shots |
| Business | $249 for 1,000,000 shots |
For a page thumbnail, you still control the social metadata and must validate the destination card. ScreenshotNeo handles the capture step when generating the image yourself in a browser is inconvenient; it does not override a platform’s metadata, crop or cache rules.
Create a free ScreenshotNeo account to get 1,000 screenshots a month with no card. Paid plans start at $5 for 3,000 shots.
Frequently Asked Questions
Should I use og:type="article" instead of website?
Use the type that accurately describes the page. The protocol requires a type value, but the implementation guidance here does not establish a universal advantage for one type; consistency with your content model is the safer choice.
Can a page have more than one og:image?
Some consumers support multiple image declarations, but a deterministic single primary image is easier to test. Add alternatives only when you have a specific platform or content reason and have verified how that destination selects among them.
Do previews work on pages that require a login?
Not reliably. A social crawler generally needs to fetch the HTML and image without your user session. Publish a public landing URL or provide an unauthenticated image endpoint for the preview.
Why does a validator look correct while a pasted link still differs?
The validator reports a particular fetch, while the normal share surface may use a cached record, a different crop or platform-specific processing. Inspect the exact URL again after publishing and treat the destination’s displayed card as the final result.
Free tools Windows power users keep installed
One-click scans. No signup required.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
